新增：综合浏览查询结果列表表头改为根据配置动态加载

shandan-browser/src/main/resources/static/js/browser.js

@@ -15,6 +15,7 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
         laydate = layui.laydate,
         globalTree = layui.globalTree,
         DataLabel = layui.datalabel;
+    const tHeadSetLayer = new THeadSetLayer(layui);
 
     let metaListTable, dirFileTable, tagSelector, tags = [], conditions = [];
     const unchecked_tags = new Set();
@@ -126,6 +127,7 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
      * 加载数据资源列表
      */
     function initMetadataTable(id) {
+        const theadConfig = THeadSetLayer.filterConfigData(resourceTableId);
         metaListTable = listPage.init({
             table: {
                 id: 'dirMetadataTable',
@@ -137,27 +139,12 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
                 autoSort: false,
                 defaultToolbar: [
                     {title: '导出', layEvent: 'export', icon: 'layui-icon-export'},
-                    {title: '列表配置', layEvent: 'theadSet', icon: 'layui-icon-cols'}
+                    {title: '列表配置', layEvent: 'theadSet1', icon: 'layui-icon-cols'}
                 ],
                 request: {pageName: 'page', limitName: 'size'},
                 limit: 30,
-                cols: [[
+                minWidth: 80,
-                    {field: 'id', title: 'ID', hide: true},
+                cols: THeadSetLayer.convertColumns(theadConfig, 'dirMetadataTable'),
-                    {field: 'resourceName', title: '数据名称', width: 300, sort: true},
-                    {field: 'resourceComment', title: '中文注释/描述', sort: true},
-                    {field: 'directoryPath', title: '资源路径', sort: true},
-                    {field: 'themeTask', title: '主题任务', hide: true, sort: true},
-                    {
-                        field: 'dataSource',
-                        title: '数据来源',
-                        width: 160,
-                        templet: (data) => DICT.getText("data_source", data.dataSource) || data.dataSource || '',
-                        sort: true
-                    },
-                    {field: 'taskTime', title: '任务时间', width: 180, align: 'center', sort: true},
-                    {field: 'modifyTime', title: '注册时间', width: 160, align: 'center', hide: true},
-                    {fixed: 'right', title: '操作', toolbar: '#rowToolBar', width: 100, align: 'center'}
-                ]],
                 done: function (res, _table) {
                     initConditionBlock();
                     if (_table.where) {
@@ -218,10 +205,11 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
             }
         })
 
-        new THeadSetLayer(layui, metaListTable, [...sourceTableConfigMap.values()]);
+        metaListTable.addTableRowEvent('theadSet1', () => tHeadSetLayer.show(resourceTableId))
     }
 
     function initFileSearchTable(id) {
+        const theadConfig = THeadSetLayer.filterConfigData(fileTableId)
         dirFileTable = listPage.init({
             table: {
                 id: 'dirFileTable',
@@ -232,45 +220,13 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
                 height: 'full-110',
                 request: {pageName: 'page', limitName: 'size'},
                 defaultToolbar: [
-                    {title: '列表配置', layEvent: 'theadSet', icon: 'layui-icon-cols'}
+                    {title: '列表配置', layEvent: 'theadSet2', icon: 'layui-icon-cols'}
                 ],
                 autoSort: false,
                 limit: 30,
                 method: 'get',
-                cols: [[
+                minWidth: 80,
-                    {field: 'id', title: 'ID', hide: true},
+                cols: THeadSetLayer.convertColumns(theadConfig, 'dirFileTable')
-                    {field: 'fileName', title: '文件名称', minWidth: 300, fixed: 'left'},
-                    {
-                        field: 'source',
-                        title: '文件来源',
-                        minWidth: 160,
-                        sort: true,
-                        templet: data => DICT.getText('data_source', data.source) || data.source || ''
-                    },
-                    {field: 'taskCode', title: '任务代号', sort: true, minWidth: 160},
-                    {
-                        field: 'taskNature',
-                        title: '任务性质',
-                        minWidth: 160,
-                        sort: true,
-                        templet: data => DICT.getText('task_nature', data.taskNature) || data.taskNature || ''
-                    },
-                    {field: 'troopCode', title: '部队代号', sort: true, minWidth: 160},
-                    {field: 'missileNumber', title: '导弹编号', sort: true, minWidth: 160},
-                    {field: 'equipmentModel', title: '装备型号', sort: true, minWidth: 160},
-                    {
-                        field: 'targetNumber',
-                        title: '目标/靶标类型',
-                        minWidth: 160,
-                        sort: true,
-                        templet: data => DICT.getText('target_type', data.targetNumber) || data.targetNumber || ''
-                    },
-                    {field: 'entryStaff', title: '录入人员', sort: true, minWidth: 160},
-                    {field: 'inputDate', title: '收文时间', sort: true, width: 160, align: 'center'},
-                    {field: 'remark', title: '文件描述', width: 300},
-                    {field: 'text', title: '文件内容', width: 300},
-                    {fixed: 'right', title: '操作', toolbar: '#fileRowToolBar', width: 100, align: 'center'}
-                ]],
             },
         });
 
@@ -290,7 +246,7 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
             openMaxLayerWithURL(`${ctx}/sys/file/view?fileId=${obj.id}`)
         })
 
-        new THeadSetLayer(layui, dirFileTable, [...fileTableConfigMap.values()]);
+        dirFileTable.addTableRowEvent('theadSet2', () => tHeadSetLayer.show(fileTableId))
     }
 
     /**
@@ -520,18 +476,15 @@ layui.use(['layer', 'listPage', 'globalTree', 'gtable', 'form', 'element', 'drop
  * 表格表头配置组件
  */
 class THeadSetLayer {
-    constructor(lay, pageTable, configData) {
+    constructor(lay) {
+        this.id = 'theadConfig';
         this.layer = lay.layer;
         this.form = lay.form;
         this.gtable = lay.gtable;
-        this.pageTable = pageTable;
-        this.id = pageTable.table.id + 'Set';
-        this.configData = configData;
-        this.pageTable.addTableRowEvent('theadSet', () => this.show())
     }
 
-    show() {
+    show(tableId) {
-        const {layer, pageTable, id} = this;
+        const {layer, id} = this;
         layer.open({
             id: id + 'Layer',
             title: '数据列表配置',
@@ -543,26 +496,27 @@ class THeadSetLayer {
             content: `<table id="${id}" lay-filter="${id}"></table>`,
             btn: ['保存', '取消'],
             success: () => {
-                this._renderInnerTable();
+                this._renderInnerTable(tableId);
             },
             yes: (layerIndex) => {
                 this._saveTheadSet().then(() => {
-                    pageTable.reloadTable();
+                    window.location.reload();
                     layer.close(layerIndex);
                 })
             }
         });
     }
 
-    _renderInnerTable() {
+    _renderInnerTable(tableId) {
         const {gtable, form, id} = this;
         gtable.init({
             id,
-            data: this.configData,
+            data: this.filterConfigData(tableId),
             method: 'get',
             toolbar: false,
-            height: 'full-310',
+            height: 'full',
             page: false,
+            limit: 1000,
             cols: [[
                 {field: 'id', hide: true},
                 {field: 'colName', title: '列名'},
@@ -582,23 +536,13 @@ class THeadSetLayer {
             ]],
         });
         gtable.on(`edit(${id})`, ({field, value, data}) => {
-            this._setData(data.id, field, value);
+            theadConfigMap.get(data.id)[field] = value;
-            if (this.id.startsWith('dirMetadataTable')) {
-                sourceTableConfigMap.get(data.id)[field] = value;
-            } else if (this.id.startsWith('dirFileTable')) {
-                fileTableConfigMap.get(data.id)[field] = value;
-            }
         })
         // 监听switch按钮
         form.on(`switch(${id}-switch)`, ({elem}) => {
             const id = $(elem).attr('id'), name = $(elem).attr('name');
-            if (this.id.startsWith('dirMetadataTable')) {
+            const value = theadConfigMap.get(id)[name];
-                const value = sourceTableConfigMap.get(id)[name];
+            theadConfigMap.get(id)[name] = !value;
-                sourceTableConfigMap.get(id)[name] = !value;
-            } else if (this.id.startsWith('dirFileTable')) {
-                const value = fileTableConfigMap.get(id)[name];
-                fileTableConfigMap.get(id)[name] = !value;
-            }
         });
 
         function renderSwitch(colName, data) {
@@ -607,17 +551,10 @@ class THeadSetLayer {
         }
     }
 
-    _setData(id, name, value) {
-        if (this.id.startsWith('dirMetadataTable')) {
-            sourceTableConfigMap.get(id)[name] = value;
-        } else if (this.id.startsWith('dirFileTable')) {
-            fileTableConfigMap.get(id)[name] = value;
-        }
-    }
 
     _saveTheadSet() {
         return new Promise(resolve => {
-            Util.post(`/sys/thead/config/api/save`, {params: JSON.stringify([...sourceTableConfigMap.values(), ...fileTableConfigMap.values()])}).then(res => {
+            Util.post(`/sys/thead/config/api/save`, {params: JSON.stringify([...theadConfigMap.values()])}).then(res => {
                 if (res.flag) {
                     showOkMsg('保存成功')
                 } else {
@@ -627,4 +564,47 @@ class THeadSetLayer {
             resolve();
         })
     }
+
+    static filterConfigData(tableId){
+        return theadConfig.filter(item => item.tableId === tableId);
+    }
+
+    static convertColumns(tHeadConfig = [], tableId) {
+        // 提前定义好需要使用templet属性的字段
+        const templets = {
+            source: data => DICT.getText('data_source', data.source) || data.source || '',
+            dataSource: data => DICT.getText('data_source', data.source) || data.source || '',
+            dataType: data => DICT.getText('data_type', data.dataType) || data.dataType || '',
+            taskCode: data => DICT.getText('task_code', data.taskCode) || data.taskCode || '',
+            taskNature: data => DICT.getText('task_nature', data.taskNature) || data.taskNature || '',
+            troopCode: data => DICT.getText('troop_code', data.troopCode) || data.troopCode || '',
+            missileNumber: data => DICT.getText('missile_number', data.missileNumber) || data.missileNumber || '',
+            equipmentModel: data => DICT.getText('equipment_model', data.equipmentModel) || data.equipmentModel || '',
+            targetNumber: data => DICT.getText('target_type', data.targetNumber) || data.targetNumber || '',
+            secretLevel: data => DICT.getText('secret_level', data.secretLevel) || data.secretLevel || '',
+            exerciseData: data => data.exerciseData ? '是' : '否',
+            resourceType: data => data.resourceType === 'file' ? '文件' : '数据库表'
+        }
+
+        // 遍历配置项转换为列
+        const cols = tHeadConfig.map(conf => {
+            const {colName, colTitle, colWidth, isShow, isSort} = conf;
+            const width = !colWidth ? undefined : (Number.isInteger(colWidth) ? parseInt(colWidth) : colWidth);
+            let col = {field: colName, title: colTitle, width, sort: isSort, hide: !isShow}
+            if(templets[colName]){
+                col['templet'] = templets[colName];
+            }
+            return col;
+        });
+
+        // 设置操作列
+        let operateCol = {fixed: 'right', title: '操作', toolbar: '', width: 100, align: 'center'};
+        if(tableId === 'dirMetadataTable'){
+            operateCol.toolbar = '#rowToolBar'
+        }else if(tableId === 'dirFileTable'){
+            operateCol.toolbar = '#fileRowToolBar'
+        }
+        cols.push(operateCol);
+        return [cols];
+    }
 }

shandan-browser/src/main/resources/view/browser.html

@@ -14,14 +14,8 @@
         const resourceTableId = 'browser_resource_table',
             fileTableId = 'browser_file_table',
             theadConfig = /*[[${theadConfig}]]*/ [];
-        const sourceTableConfigMap = new Map(), fileTableConfigMap = new Map();
+        const theadConfigMap = new Map();
-        theadConfig.forEach(item => {
+        theadConfig.forEach(item => theadConfigMap.set(item.id, item));
-            if (item.tableId === resourceTableId) {
-                sourceTableConfigMap.set(item.id, item);
-            } else if (item.tableId === fileTableId) {
-                fileTableConfigMap.set(item.id, item);
-            }
-        });
 
     </script>
 </head>