Signed-off-by: 1iyc <5212514+liycone@user.noreply.gitee.com>
main
1iyc 3 weeks ago
parent 0b866ed102
commit 00ae5a8a61

@ -11,7 +11,7 @@ export function getNav(query) {
export function getTasks(queryParams) { export function getTasks(queryParams) {
return request({ return request({
url: '/gather/task/page/', url: '/gather/task/page',
method: 'GET', method: 'GET',
params: queryParams, params: queryParams,
}); });
@ -20,7 +20,7 @@ export function getTasks(queryParams) {
export function getDataList(dataSource, queryParams) { export function getDataList(dataSource, queryParams) {
return request({ return request({
url: '/kis/supplier/list/' + dataSource, url: '/kis/supplier/list' + dataSource,
method: 'GET', method: 'GET',
params: queryParams, params: queryParams,
}); });

@ -14,9 +14,8 @@
<el-menu-item v-for="(tab, index) in tabs" <el-menu-item v-for="(tab, index) in tabs"
:key="index" :key="index"
:index="index.toString()" :index="index.toString()"
> >
<span>{{ tab.title }}{{ index }}</span> <span>{{ tab.title }}</span>
</el-menu-item> </el-menu-item>
</el-menu> </el-menu>
</el-card> </el-card>
@ -34,14 +33,42 @@
> >
<el-tab-pane v-for="(tab, index) in tabs" <el-tab-pane v-for="(tab, index) in tabs"
:key="index" :key="index"
:label="tab.title"
:name="index.toString()" :name="index.toString()"
:label="tab.title"
> >
<el-button type="text" @click.stop="showDialog('edit', index)">修改</el-button>
<el-button type="text" @click.stop="disconnectTab(index)">断开</el-button>
<el-button type="text" @click.stop="disconnectTab(index)">打开</el-button>
<!-- form表单 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="form.length > 0">
<el-form-item v-for="(field, index) in form"
:key="index"
:label="field.label"
:prop="field.prop"
v-if="field.type !== 'button'">
<component
:is="getComponentType(field.type)"
v-bind="field"
v-model="queryParams[field.prop]"
:placeholder="field.placeholder"
>
<!-- 下拉框选项 -->
<el-option
v-if="field.type === 'select'"
v-for="option in field.options"
:key="option.value"
:label="option.label"
:value="option.value"
></el-option>
</component>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"></el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"></el-button>
</el-form-item>
</el-form>
<!-- 表格 -->
<el-table <el-table
:data="tableData" :data="tableData"
highlight-current-row highlight-current-row
@ -62,10 +89,32 @@
:width="column.width" :width="column.width"
:align="column.align" :align="column.align"
:show-overflow-tooltip="column.tooltip" :show-overflow-tooltip="column.tooltip"
> />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:dept:edit']"
>修改
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:dept:edit']"
>同步
</el-button>
</template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -132,15 +181,30 @@ export default {
name: 'TabComponent', name: 'TabComponent',
initMenuItem: { initMenuItem: {
type: Array, type: Array,
default: () => [] default: () => [{
title: '数据库',
}]
}, },
callBackSelect: { callBackSelect: {
type: Function, type: Function,
default: () => ({}) default: () => ({})
}, },
initForm: {
type: Array,
default: () => [{
type: 'input',
label: '表名',
prop: 'tableName',
placeholder: '请输入表名',
}]
},
initColumns: { initColumns: {
type: Array, type: Array,
default: () => [] default: () => [{
type: 'id',
width: 55,
align: 'center'
}]
}, },
initTableData: { initTableData: {
type: Array, type: Array,
@ -156,6 +220,7 @@ export default {
return { return {
active: this.initActive, active: this.initActive,
tabs: this.initMenuItem, tabs: this.initMenuItem,
form: this.initForm,
columns: this.initColumns, columns: this.initColumns,
tableData: this.initTableData, tableData: this.initTableData,
loading: false, loading: false,
@ -175,7 +240,8 @@ export default {
total: 0, total: 0,
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10,
activeTab: {},
}, },
} }
} }
@ -183,24 +249,52 @@ export default {
mounted() { mounted() {
// console.log(JSON.stringify(this.initMenuItem)) // console.log(JSON.stringify(this.initMenuItem))
// console.log(JSON.stringify(this.columns)) // console.log(JSON.stringify(this.columns))
this.setDefaultValue()
this.onSelect(this.active)
} }
, ,
methods: { methods: {
getComponentType(type) {
switch (type) {
case 'input':
return 'el-input';
case 'textarea':
return 'el-input';
case 'select':
return 'el-select';
case 'checkbox':
return 'el-checkbox';
case 'radio':
return 'el-radio';
case 'date':
return 'el-date-picker';
case 'button':
return 'el-button';
default:
return 'el-input';
}
},
/* 设置默认值*/
setDefaultValue() {
this.form.forEach(field => {
if (field.type === 'select' && field.options) {
const defaultOption = field.options.find(option => option.default);
if (defaultOption) {
this.queryParams[field.prop] = defaultOption.value;
}
}
});
},
/* 选中菜单 */ /* 选中菜单 */
onSelect(index) { onSelect(index) {
this.active = index this.queryParams.activeTab = this.tabs[index]
this.loading = true this.callBackSelect(this.queryParams)
this.callBackSelect(this.active, this.queryParams)
this.loading = false
}, },
/* tabs 单击实践 */ /* tabs 单击事件 */
onClick(tab) { onClick(tab) {
this.active = tab.name; this.queryParams.activeTab = this.tabs[tab.name]
this.loading = true this.callBackSelect(this.queryParams)
this.callBackSelect(this.active, this.queryParams)
this.loading = false
}, },
/* 加载表格数据*/ /* 加载表格数据*/
@ -210,8 +304,18 @@ export default {
}, },
getList() { getList() {
this.callBackSelect(this.active, this.queryParams) this.callBackSelect(this.queryParams)
},
handleQuery() {
this.getList();
}, },
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
showDialog(mode, index = null) { showDialog(mode, index = null) {
this.dialogTitle = mode === 'add' ? '新建标签页' : '修改标签页'; this.dialogTitle = mode === 'add' ? '新建标签页' : '修改标签页';
@ -265,10 +369,6 @@ export default {
} }
, ,
disconnectTab(index) {
console.log(`断开标签页 ${index}`);
}
,
handleClose(done, event) { handleClose(done, event) {
@ -285,6 +385,9 @@ export default {
} }
} }
, ,
handleUpdate(row) {
alert(row.id)
}
} }

@ -1,11 +1,15 @@
<template> <template>
<div id="app"> <div id="app">
<TabComponent <TabComponent
v-if="tabs.length > 0" v-if="tabs.length > 0"
ref="tabComponent" ref="tabComponent"
:init-menu-item.sync="tabs" :init-menu-item.sync="tabs"
:init-columns="column" :init-form="table.form"
:init-columns="table.column"
:call-back-select="backSelect" :call-back-select="backSelect"
:init-active="'1'"
> >
</TabComponent> </TabComponent>
</div> </div>
@ -19,51 +23,99 @@ export default {
data() { data() {
return { return {
addTabDialogVisible: false, addTabDialogVisible: false,
tabs: [], table: {
currentActiveTab: {}, form: [
column: [ {
{ type: 'input',
type: 'id', label: '表名',
width: 55, prop: 'tableName',
align: 'center' placeholder: '请输入表名',
}, },
{ {
title: '表名称', type: 'input',
key: 'tableName', label: '表描述',
align: 'center' prop: 'tableDescription',
}, placeholder: '请输入表描述',
{ span: 6
title: '描述', },
key: 'tableDescription', {
align: 'center' type: 'input',
}, label: '表注',
{ prop: 'tableNote',
title: '表注', placeholder: '请输入表注',
key: 'tableNote', },
align: 'center' {
}, type: 'select',
{ label: '是否启用',
title: '启用', prop: 'enable',
key: 'enable', placeholder: '请选择是否启用',
align: 'center' options: [
}, {
{ label: '是',
title: 'cron (定时)', value: '1',
key: 'cron', default: true
align: 'center' },
}, {
{ label: '否',
title: '操作', value: '0'
key: 'oper', }
align: 'center' ]
} },
], ],
total: 0, column: [
rows: [], {
type: 'id',
width: 55,
align: 'center'
},
{
title: '表名称',
key: 'tableName',
align: 'center'
},
{
title: '描述',
key: 'tableDescription',
align: 'center'
},
{
title: '表注',
key: 'tableNote',
align: 'center'
},
{
title: '启用',
key: 'enable',
align: 'center',
},
{
title: 'cron (定时)',
key: 'cron',
align: 'center'
}
],
rows: [],
},
initActiveTab: "0", initActiveTab: "0",
tabs: [],
activeTab: {
title: undefined,
name: undefined,
dbType: undefined,
url: undefined,
username: undefined,
driverClassName: undefined,
},
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10,
name: undefined,
tableName: undefined,
enable: undefined,
tableDescription: undefined,
tableNote: undefined,
cron: undefined,
} }
}; };
}, },
@ -84,25 +136,30 @@ export default {
driverClassName: item.driverClassName driverClassName: item.driverClassName
})); }));
if (this.tabs.length > 0) { if (this.tabs.length > 0) {
this.currentActiveTab = this.tabs[0]; this.activeTab = this.tabs[0];
this.getDataList(this.queryParams); this.queryParams.name = this.activeTab.name
this.getDataList();
} }
}).catch(error => { }).catch(error => {
console.error('Failed to fetch navigation data:', error); console.error('Failed to fetch navigation data:', error);
}); });
}, },
backSelect(index, queryParams) { backSelect(callBackActiveTab) {
this.currentActiveTab = this.tabs[index]; console.log(JSON.stringify(callBackActiveTab));
this.getDataList(queryParams); this.activeTab = callBackActiveTab.activeTab
this.queryParams.pageNum = callBackActiveTab.pageNum
this.queryParams.pageSize = callBackActiveTab.pageSize
this.queryParams.enable = callBackActiveTab.enable
this.queryParams.name = this.activeTab.name
this.getDataList();
}, },
getDataList(queryParams) { getDataList() {
getTasks(queryParams) console.log('getDataList', JSON.stringify(this.queryParams));
getTasks(this.queryParams)
.then(response => { .then(response => {
this.rows = response.rows; this.$refs.tabComponent.loadTableData(response.rows, response.total);
this.total = response.total;
this.$refs.tabComponent.loadTableData(this.rows, this.total);
}) })
.catch(error => { .catch(error => {
console.error('Failed to fetch data list:', error); console.error('Failed to fetch data list:', error);

Loading…
Cancel
Save