|
|
@ -1,201 +1,229 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<anji-crud ref="listPage" :option="crudOption">
|
|
|
|
<anji-crud ref="listPage" :option="crudOption">
|
|
|
|
<template v-slot:buttonLeftOnTable>
|
|
|
|
<template v-slot:buttonLeftOnTable>
|
|
|
|
<el-button type="primary" icon="el-icon-plus" @click="operateDatasource('add')" v-permission="'datasourceManage:insert'">新增</el-button>
|
|
|
|
<el-button
|
|
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
|
|
icon="el-icon-plus"
|
|
|
|
|
|
|
|
@click="operateDatasource('add')"
|
|
|
|
|
|
|
|
v-permission="'datasourceManage:insert'"
|
|
|
|
|
|
|
|
>新增</el-button
|
|
|
|
|
|
|
|
>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<template slot="rowButton" slot-scope="props">
|
|
|
|
<template slot="edit" slot-scope="props">
|
|
|
|
<el-button type="text" @click="operateDatasource('edit',props)" v-permission="'datasourceManage:update'">编辑</el-button>
|
|
|
|
<el-button
|
|
|
|
|
|
|
|
type="text"
|
|
|
|
|
|
|
|
@click="operateDatasource('edit', props)"
|
|
|
|
|
|
|
|
v-permission="'datasourceManage:update'"
|
|
|
|
|
|
|
|
>编辑</el-button
|
|
|
|
|
|
|
|
>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
<!--自定义的卡片插槽,将在编辑详情页面,出现在底部新卡片-->
|
|
|
|
<!--自定义的卡片插槽,将在编辑详情页面,出现在底部新卡片-->
|
|
|
|
<!--这里可以将自定义的弹出框代码,放入到page中
|
|
|
|
<!--这里可以将自定义的弹出框代码,放入到page中
|
|
|
|
-->
|
|
|
|
-->
|
|
|
|
<template v-slot:pageSection>
|
|
|
|
<template v-slot:pageSection>
|
|
|
|
<EditDataSource ref="EditDataSource" :dataSource="dataSource" :visib="dialogVisibleSetDataSource" @handleClose="dialogVisibleSetDataSource = false" @refreshList="refreshList" />
|
|
|
|
<EditDataSource
|
|
|
|
|
|
|
|
ref="EditDataSource"
|
|
|
|
|
|
|
|
:dataSource="dataSource"
|
|
|
|
|
|
|
|
:visib="dialogVisibleSetDataSource"
|
|
|
|
|
|
|
|
@handleClose="dialogVisibleSetDataSource = false"
|
|
|
|
|
|
|
|
@refreshList="refreshList"
|
|
|
|
|
|
|
|
/>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
</anji-crud>
|
|
|
|
</anji-crud>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
import { reportDataSourceList, reportDataSourceAdd, reportDataSourceDeleteBatch, reportDataSourceUpdate, reportDataSourceDetail } from '@/api/reportDataSource'
|
|
|
|
import {
|
|
|
|
import EditDataSource from '@/views/report/datasource/components/EditDataSource'
|
|
|
|
reportDataSourceList,
|
|
|
|
|
|
|
|
reportDataSourceAdd,
|
|
|
|
|
|
|
|
reportDataSourceDeleteBatch,
|
|
|
|
|
|
|
|
reportDataSourceUpdate,
|
|
|
|
|
|
|
|
reportDataSourceDetail
|
|
|
|
|
|
|
|
} from "@/api/reportDataSource";
|
|
|
|
|
|
|
|
import EditDataSource from "@/views/report/datasource/components/EditDataSource";
|
|
|
|
export default {
|
|
|
|
export default {
|
|
|
|
name: 'ReportDataSource',
|
|
|
|
name: "ReportDataSource",
|
|
|
|
components: {
|
|
|
|
components: {
|
|
|
|
EditDataSource: EditDataSource
|
|
|
|
EditDataSource: EditDataSource
|
|
|
|
},
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
return {
|
|
|
|
dialogVisibleSetDataSource : false,
|
|
|
|
dialogVisibleSetDataSource: false,
|
|
|
|
dataSource : {},
|
|
|
|
dataSource: {},
|
|
|
|
crudOption: {
|
|
|
|
crudOption: {
|
|
|
|
// 使用菜单做为页面标题
|
|
|
|
// 使用菜单做为页面标题
|
|
|
|
title: '数据源',
|
|
|
|
title: "数据源",
|
|
|
|
// 详情页中输入框左边文字宽度
|
|
|
|
// 详情页中输入框左边文字宽度
|
|
|
|
labelWidth: '120px',
|
|
|
|
labelWidth: "120px",
|
|
|
|
// 查询表单条件
|
|
|
|
// 查询表单条件
|
|
|
|
queryFormFields: [
|
|
|
|
queryFormFields: [
|
|
|
|
{
|
|
|
|
{
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
label: '数据源编码',
|
|
|
|
label: "数据源编码",
|
|
|
|
field: 'sourceCode'
|
|
|
|
field: "sourceCode"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
label: '数据源名称',
|
|
|
|
label: "数据源名称",
|
|
|
|
field: 'sourceName'
|
|
|
|
field: "sourceName"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
inputType: 'anji-select', //form表单类型 input|input-number|anji-select(传递url或者dictCode)|anji-tree(左侧树)|date|datetime|datetimerange
|
|
|
|
inputType: "anji-select", //form表单类型 input|input-number|anji-select(传递url或者dictCode)|anji-tree(左侧树)|date|datetime|datetimerange
|
|
|
|
anjiSelectOption: {
|
|
|
|
anjiSelectOption: {
|
|
|
|
dictCode: 'SOURCE_TYPE',
|
|
|
|
dictCode: "SOURCE_TYPE"
|
|
|
|
},
|
|
|
|
|
|
|
|
label: '数据源类型',
|
|
|
|
|
|
|
|
field: 'sourceType'
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
label: "数据源类型",
|
|
|
|
|
|
|
|
field: "sourceType"
|
|
|
|
|
|
|
|
}
|
|
|
|
],
|
|
|
|
],
|
|
|
|
// 操作按钮
|
|
|
|
// 操作按钮
|
|
|
|
buttons: {
|
|
|
|
buttons: {
|
|
|
|
|
|
|
|
customButton: {
|
|
|
|
|
|
|
|
operationWidth: 150
|
|
|
|
|
|
|
|
},
|
|
|
|
query: {
|
|
|
|
query: {
|
|
|
|
api: reportDataSourceList,
|
|
|
|
api: reportDataSourceList,
|
|
|
|
permission: 'datasourceManage:query',
|
|
|
|
permission: "datasourceManage:query",
|
|
|
|
sort: 'update_time',
|
|
|
|
sort: "update_time",
|
|
|
|
order: 'DESC'
|
|
|
|
order: "DESC"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
queryByPrimarykey: {
|
|
|
|
queryByPrimarykey: {
|
|
|
|
api: reportDataSourceDetail,
|
|
|
|
api: reportDataSourceDetail,
|
|
|
|
permission: 'datasourceManage:detail'
|
|
|
|
permission: "datasourceManage:detail"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
add: {
|
|
|
|
add: {
|
|
|
|
api: reportDataSourceAdd,
|
|
|
|
api: reportDataSourceAdd,
|
|
|
|
permission: 'datasourceManage:insert',
|
|
|
|
permission: "datasourceManage:insert",
|
|
|
|
isShow:false
|
|
|
|
isShow: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
delete: {
|
|
|
|
delete: {
|
|
|
|
api: reportDataSourceDeleteBatch,
|
|
|
|
api: reportDataSourceDeleteBatch,
|
|
|
|
permission: 'datasourceManage:delete'
|
|
|
|
permission: "datasourceManage:delete"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
edit: {
|
|
|
|
edit: {
|
|
|
|
api: reportDataSourceUpdate,
|
|
|
|
api: reportDataSourceUpdate,
|
|
|
|
permission: 'datasourceManage:update',
|
|
|
|
permission: "datasourceManage:update",
|
|
|
|
isShow:false
|
|
|
|
isShow: false
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
// 表格列
|
|
|
|
// 表格列
|
|
|
|
columns: [
|
|
|
|
columns: [
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '',
|
|
|
|
label: "",
|
|
|
|
field: 'id',
|
|
|
|
field: "id",
|
|
|
|
primaryKey: true, // 根据主键查询详情或者根据主键删除时, 主键的
|
|
|
|
primaryKey: true, // 根据主键查询详情或者根据主键删除时, 主键的
|
|
|
|
tableHide: true, // 表格中不显示
|
|
|
|
tableHide: true, // 表格中不显示
|
|
|
|
editHide: true, // 编辑弹框中不显示
|
|
|
|
editHide: true // 编辑弹框中不显示
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '数据源编码',//数据源编码
|
|
|
|
label: "数据源编码", //数据源编码
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'sourceCode',
|
|
|
|
field: "sourceCode",
|
|
|
|
editField: 'sourceCode',
|
|
|
|
editField: "sourceCode",
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [
|
|
|
|
{ min: 1, max: 100, message: '不超过100个字符', trigger: 'blur' }
|
|
|
|
{ min: 1, max: 100, message: "不超过100个字符", trigger: "blur" }
|
|
|
|
],
|
|
|
|
],
|
|
|
|
disabled: false,
|
|
|
|
disabled: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '数据源名称',//数据源名称
|
|
|
|
label: "数据源名称", //数据源名称
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'sourceName',
|
|
|
|
field: "sourceName",
|
|
|
|
editField: 'sourceName',
|
|
|
|
editField: "sourceName",
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [
|
|
|
|
{ min: 1, max: 100, message: '不超过100个字符', trigger: 'blur' }
|
|
|
|
{ min: 1, max: 100, message: "不超过100个字符", trigger: "blur" }
|
|
|
|
],
|
|
|
|
],
|
|
|
|
disabled: false,
|
|
|
|
disabled: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '数据源描述',//数据源描述
|
|
|
|
label: "数据源描述", //数据源描述
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'sourceDesc',
|
|
|
|
field: "sourceDesc",
|
|
|
|
editField: 'sourceDesc',
|
|
|
|
editField: "sourceDesc",
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [
|
|
|
|
{ min: 1, max: 255, message: '不超过255个字符', trigger: 'blur' }
|
|
|
|
{ min: 1, max: 255, message: "不超过255个字符", trigger: "blur" }
|
|
|
|
],
|
|
|
|
],
|
|
|
|
disabled: false,
|
|
|
|
disabled: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '数据源类型',//数据源类型 DIC_NAME=SOURCE_TYPE; mysql,orace,sqlserver,elasticsearch,接口,javaBean,数据源类型字典中item-extend动态生成表单
|
|
|
|
label: "数据源类型", //数据源类型 DIC_NAME=SOURCE_TYPE; mysql,orace,sqlserver,elasticsearch,接口,javaBean,数据源类型字典中item-extend动态生成表单
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'sourceType',
|
|
|
|
field: "sourceType",
|
|
|
|
fieldTableRowRenderer: (row) => {
|
|
|
|
fieldTableRowRenderer: row => {
|
|
|
|
return this.getDictLabelByCode('SOURCE_TYPE', row['sourceType'])
|
|
|
|
return this.getDictLabelByCode("SOURCE_TYPE", row["sourceType"]);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
editField: 'sourceType',
|
|
|
|
editField: "sourceType",
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [
|
|
|
|
{ min: 1, max: 50, message: '不超过50个字符', trigger: 'blur' }
|
|
|
|
{ min: 1, max: 50, message: "不超过50个字符", trigger: "blur" }
|
|
|
|
],
|
|
|
|
],
|
|
|
|
disabled: false,
|
|
|
|
disabled: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '数据源连接配置json',//数据源连接配置json:关系库{ jdbcUrl:'', username:'', password:'' } ES{ hostList:'ip1:9300,ip2:9300,ip3:9300', clusterName:'elasticsearch_cluster' } 接口{ apiUrl:'http://ip:port/url', method:'' } javaBean{ beanNamw:'xxx' }
|
|
|
|
label: "数据源连接配置json", //数据源连接配置json:关系库{ jdbcUrl:'', username:'', password:'' } ES{ hostList:'ip1:9300,ip2:9300,ip3:9300', clusterName:'elasticsearch_cluster' } 接口{ apiUrl:'http://ip:port/url', method:'' } javaBean{ beanNamw:'xxx' }
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'sourceConfig',
|
|
|
|
field: "sourceConfig",
|
|
|
|
editField: 'sourceConfig',
|
|
|
|
editField: "sourceConfig",
|
|
|
|
tableHide: true,
|
|
|
|
tableHide: true,
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [
|
|
|
|
{ min: 1, max: 2048, message: '不超过2048个字符', trigger: 'blur' }
|
|
|
|
{
|
|
|
|
|
|
|
|
min: 1,
|
|
|
|
|
|
|
|
max: 2048,
|
|
|
|
|
|
|
|
message: "不超过2048个字符",
|
|
|
|
|
|
|
|
trigger: "blur"
|
|
|
|
|
|
|
|
}
|
|
|
|
],
|
|
|
|
],
|
|
|
|
disabled: false,
|
|
|
|
disabled: false
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '状态',//0--已禁用 1--已启用 DIC_NAME=ENABLE_FLAG
|
|
|
|
label: "状态", //0--已禁用 1--已启用 DIC_NAME=ENABLE_FLAG
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'enableFlag',
|
|
|
|
field: "enableFlag",
|
|
|
|
fieldTableRowRenderer: (row) => {
|
|
|
|
fieldTableRowRenderer: row => {
|
|
|
|
return this.getDictLabelByCode('ENABLE_FLAG', row['enableFlag'])
|
|
|
|
return this.getDictLabelByCode("ENABLE_FLAG", row["enableFlag"]);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
colorStyle: {
|
|
|
|
colorStyle: {
|
|
|
|
0: 'table-danger', //key为editField渲染的值(字典的提交值)'红色': 'danger','蓝色': 'primary','绿色': 'success','黄色': 'warning','灰色': 'info','白色':''
|
|
|
|
0: "table-danger", //key为editField渲染的值(字典的提交值)'红色': 'danger','蓝色': 'primary','绿色': 'success','黄色': 'warning','灰色': 'info','白色':''
|
|
|
|
1: 'table-success',
|
|
|
|
1: "table-success"
|
|
|
|
},
|
|
|
|
},
|
|
|
|
editField: 'enableFlag',
|
|
|
|
editField: "enableFlag",
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [],
|
|
|
|
],
|
|
|
|
disabled: false
|
|
|
|
disabled: false,
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '删除标记',//0--未删除 1--已删除 DIC_NAME=DELETE_FLAG
|
|
|
|
label: "删除标记", //0--未删除 1--已删除 DIC_NAME=DELETE_FLAG
|
|
|
|
placeholder: '',
|
|
|
|
placeholder: "",
|
|
|
|
field: 'deleteFlag',
|
|
|
|
field: "deleteFlag",
|
|
|
|
editField: 'deleteFlag',
|
|
|
|
editField: "deleteFlag",
|
|
|
|
tableHide: true,
|
|
|
|
tableHide: true,
|
|
|
|
inputType: 'input',
|
|
|
|
inputType: "input",
|
|
|
|
rules: [
|
|
|
|
rules: [],
|
|
|
|
],
|
|
|
|
disabled: false
|
|
|
|
disabled: false,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
created() { },
|
|
|
|
created() {},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
operateDatasource(type, prop) {
|
|
|
|
operateDatasource(type, prop) {
|
|
|
|
this.dialogVisibleSetDataSource = true
|
|
|
|
this.dialogVisibleSetDataSource = true;
|
|
|
|
if (prop) {
|
|
|
|
if (prop) {
|
|
|
|
this.dataSource = prop.msg;
|
|
|
|
this.dataSource = prop.msg;
|
|
|
|
}else {
|
|
|
|
} else {
|
|
|
|
this.dataSource = {}
|
|
|
|
this.dataSource = {};
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.$refs.EditDataSource.getSystem()
|
|
|
|
this.$refs.EditDataSource.getSystem();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
refreshList(){
|
|
|
|
refreshList() {
|
|
|
|
this.$refs.listPage.handleQueryForm('query')
|
|
|
|
this.$refs.listPage.handleQueryForm("query");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|