feat: 增加搜索功能，logManage左侧树暂时改为加载json

src/components/TreeWithLine/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="tree-with-line">
-    <a-tree v-bind="$attrs" :defaultExpandAll="true" :selected-keys="selectedKeys" @select="onSelect">
+    <a-tree v-bind="$attrs" :defaultExpandedKeys="defaultExpandedKeys" :selected-keys="selectedKeys" @select="onSelect">
       <template slot="switcherIcon">
         <div></div>
       </template>
@@ -12,6 +12,9 @@ export default {
   props: {
     selectedKeys: {
       type: Array
+    },
+    defaultExpandedKeys: {
+      type: Array
     }
   },
   methods: {

src/style.less

@@ -127,8 +127,9 @@ body {
     }
     &-clear,
     &-icon {
-      color: #01b6e3 !important;
+      >svg {
-      background-color: #03353f !important;
+        display: none;
+      }
     }
   }
 
@@ -287,6 +288,9 @@ body {
       background-color: transparent;
     }
   }
+  &-clear-icon {
+    color: #00e9fe !important;
+  }
 }
 
 // 单选样式
@@ -420,6 +424,16 @@ body {
       }
     }
   }
+
+  &-clear-icon {
+    color: #00e9fe !important;
+    background-color: #03353f !important;
+  }
+  &-open {
+    .ant-select-clear-icon {
+      background-color: #055565 !important;
+    }
+  }
 }
 
 // 下拉菜单

src/views/logManage/index.vue

@@ -17,7 +17,7 @@
       </template>
       <!-- 标题结束 -->
       <!-- 内容 -->
-      <tree-with-line :treeData="treeData" :selected-keys.sync="selectedKeys" @select="onSelect"> </tree-with-line>
+      <tree-with-line :treeData="treeData" :selected-keys.sync="selectedKeys" :expanded-keys.sync="expandedKeys" @select="onSelect"> </tree-with-line>
       <!-- 内容结束 -->
     </a-card>
     <div class="log-list">
@@ -47,7 +47,7 @@
     </div>
 
     <custom-modal title="Log" v-model="visible" :show-footer="false">
-        这里是Log内容
+      这里是Log内容
     </custom-modal>
   </div>
 </template>
@@ -55,6 +55,7 @@
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import TreeWithLine from '@/components/TreeWithLine/index.vue'
 import { downloadFile, getAction } from '../../api/manage'
+import TreeJson from './tree.json'
 
 const columns = [
   {
@@ -94,64 +95,18 @@ export default {
         list: '/test'
       },
       isGettingTreeData: false, // 正在获取左侧树信息
-      treeData: [
+      treeData: [],
+      selectedKeys: [],
+      expandedKeys: [],
+      dataSource: [
         {
-          title: 'Db',
+          id: 1,
-          key: '1',
+          name: 'DEX33_002-20220512_0723_S_FULL_9011.9.log',
-          children: [
+          date: '2022-05-13',
-            {
+          size: '105KB',
-              title: '2022',
+          fileName: 'test.txt'
-              key: '1-1',
-              children: [
-                {
-                  title: '04',
-                  key: '1-1-1'
-                },
-                {
-                  title: '05',
-                  key: '1-1-2'
-                }
-              ]
-            },
-            {
-              title: '2023',
-              key: '1-2',
-              children: [
-                {
-                  title: '04',
-                  key: '1-2-1'
-                },
-                {
-                  title: '05',
-                  key: '1-2-2'
-                }
-              ]
-            }
-          ]
-        },
-        {
-          title: 'Error',
-          key: '2',
-          children: [
-            {
-              title: '2022',
-              key: '2-1',
-              children: [
-                {
-                  title: '04',
-                  key: '2-1-1'
-                },
-                {
-                  title: '05',
-                  key: '2-1-2'
-                }
-              ]
-            }
-          ]
         }
       ],
-      selectedKeys: [],
-      dataSource: [{ id: 1, name: 'DEX33_002-20220512_0723_S_FULL_9011.9.log', date: '2022-05-13', size: '105KB', fileName: 'test.txt' }],
       visible: false
     }
   },
@@ -159,7 +114,7 @@ export default {
     this.getTreeData()
   },
   methods: {
-    async getTreeData () {
+    async getTreeData() {
       try {
         this.isGettingTreeData = true
         const res = await getAction('/logManage/findFtpFolders')
@@ -167,13 +122,36 @@ export default {
       } catch (error) {
         console.error(error)
         this.$message.error('Get Tree Data Failed')
-        this.selectedKeys = ['1-1-2']
+        this.treeData = this.buildTreeData(TreeJson)
+        console.log('%c [ this.treeData ]-125', 'font-size:13px; background:pink; color:#bf2c9f;', this.treeData)
+        const firstNode = this.treeData[0]
+        this.selectedKeys = [firstNode.key]
+        this.expandedKeys = [firstNode.key]
         this.onSelect()
       } finally {
         this.isGettingTreeData = false
       }
     },
-    onSelect () {
+
+    /**
+     * @param {Array<any>} treeJson
+     */
+    buildTreeData(treeJson) {
+      const tree = []
+      treeJson.forEach(item => {
+        const treeNode = {
+          title: item.name,
+          key: item.path,
+          children: []
+        }
+        if (item.children && item.children.length) {
+          treeNode.children.push(...this.buildTreeData(item.children))
+        }
+        tree.push(treeNode)
+      })
+      return tree
+    },
+    onSelect() {
       this.queryParam.query = this.selectedKeys[0]
       this.loadData()
     },

src/views/logManage/tree.json

@@ -0,0 +1,170 @@
+[
+	{
+		"name": "Alert",
+		"path": "/log/Alert/",
+		"orderNum": 1,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "AlertLog1",
+				"path": "/log/Alert/AlertLog1/",
+				"orderNum": 1,
+				"parentNum": 1,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "AlertLog2",
+				"path": "/log/Alert/AlertLog2/",
+				"orderNum": 2,
+				"parentNum": 1,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	},
+	{
+		"name": "Error",
+		"path": "/log/Error/",
+		"orderNum": 2,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "ErrorLog1",
+				"path": "/log/Error/ErrorLog1/",
+				"orderNum": 1,
+				"parentNum": 2,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "ErrorLog2",
+				"path": "/log/Error/ErrorLog2/",
+				"orderNum": 2,
+				"parentNum": 2,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	},
+	{
+		"name": "Mail",
+		"path": "/log/Mail/",
+		"orderNum": 3,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "MailLog1",
+				"path": "/log/Mail/MailLog1/",
+				"orderNum": 1,
+				"parentNum": 3,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "MailLog2",
+				"path": "/log/Mail/MailLog2/",
+				"orderNum": 2,
+				"parentNum": 3,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	},
+	{
+		"name": "Met",
+		"path": "/log/Met/",
+		"orderNum": 4,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "MetLog1",
+				"path": "/log/Met/MetLog1/",
+				"orderNum": 1,
+				"parentNum": 4,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "MetLog2",
+				"path": "/log/Met/MetLog2/",
+				"orderNum": 2,
+				"parentNum": 4,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	},
+	{
+		"name": "Soh",
+		"path": "/log/Soh/",
+		"orderNum": 5,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "SohLog1",
+				"path": "/log/Soh/SohLog1/",
+				"orderNum": 1,
+				"parentNum": 5,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "SohLog2",
+				"path": "/log/Soh/SohLog2/",
+				"orderNum": 2,
+				"parentNum": 5,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	},
+	{
+		"name": "Spectrum",
+		"path": "/log/Spectrum/",
+		"orderNum": 6,
+		"parentNum": 0,
+		"hashParent": false,
+		"hashChild": true,
+		"children": [
+			{
+				"name": "SpectrumLog1",
+				"path": "/log/Spectrum/SpectrumLog1/",
+				"orderNum": 1,
+				"parentNum": 6,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			},
+			{
+				"name": "SpectrumLog2",
+				"path": "/log/Spectrum/SpectrumLog2/",
+				"orderNum": 2,
+				"parentNum": 6,
+				"hashParent": true,
+				"hashChild": false,
+				"children": null
+			}
+		]
+	}
+]

src/views/system/DataBase.vue

@@ -222,9 +222,12 @@ export default {
         {
           label: 'SampleID',
           type: 'a-input',
-          name: 'sampleID',
+          name: 'sampleId',
           style: {
             width: '19%'
+          },
+          props: {
+            allowClear: true
           }
         },
         {
@@ -240,7 +243,8 @@ export default {
               ...this.stationList
             ],
             showSearch: true,
-            filterOption: this.filterOption
+            filterOption: this.filterOption,
+            allowClear: true
           },
           style: {
             width: '19%'
@@ -259,7 +263,8 @@ export default {
               ...this.detectorList
             ],
             showSearch: true,
-            filterOption: this.filterOption
+            filterOption: this.filterOption,
+            allowClear: true
           },
           style: {
             width: '19%'
@@ -268,10 +273,11 @@ export default {
         {
           label: 'From',
           type: 'a-date-picker',
-          name: 'from',
+          name: 'collectStart',
           props: {
             showTime: { format: 'HH:mm' },
             format: 'YYYY-MM-DD HH:mm',
+            valueFormat: 'YYYY-MM-DD HH:mm:ss',
             style: {
               minWidth: 'auto'
             }
@@ -283,10 +289,11 @@ export default {
         {
           label: 'To',
           type: 'a-date-picker',
-          name: 'to',
+          name: 'collectStop',
           props: {
             showTime: { format: 'HH:mm' },
             format: 'YYYY-MM-DD HH:mm',
+            valueFormat: 'YYYY-MM-DD HH:mm:ss',
             style: {
               minWidth: 'auto'
             }

src/views/system/DetectorInfo.vue

@@ -100,39 +100,7 @@ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import FormMixin from '@/mixins/FormMixin'
 import { cloneDeep } from 'lodash'
 import moment from 'moment'
-
+import { getAction } from '../../api/manage'
-const formItems = [
-  {
-    label: 'Detector Code',
-    type: 'a-input',
-    name: 'detectorCode',
-    style: {
-      width: '310px'
-    }
-  },
-  {
-    label: 'Type',
-    type: 'a-input',
-    name: 'type',
-    style: {
-      width: '310px'
-    }
-  },
-  {
-    label: 'Status',
-    type: 'j-dict-select-tag',
-    name: 'status',
-    props: {
-      dictCode: 'STATION_STATUS',
-      getPopupContainer: () => {
-        return document.body
-      }
-    },
-    style: {
-      width: '310px'
-    }
-  }
-]
 
 const columns = [
   {
@@ -213,7 +181,6 @@ const columns = [
 export default {
   mixins: [JeecgListMixin, FormMixin],
   data() {
-    this.formItems = formItems
     this.columns = columns
     const validateDetectorCode = (_, value, callback) => {
       if (!value) {
@@ -239,10 +206,27 @@ export default {
         delete: '/gardsDetectors/deleteById',
         add: '/gardsDetectors/create',
         edit: '/gardsDetectors/update'
-      }
+      },
+      typeList: []
     }
   },
+  created() {
+    this.getTypeList()
+  },
   methods: {
+    async getTypeList() {
+      try {
+        const res = await getAction('/gardsDetectors/findType')
+        this.typeList = res.filter(item => item).map(item => ({ label: item, value: item }))
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+
     onAdd() {
       this.isAdd = true
       this.model = {}
@@ -276,6 +260,51 @@ export default {
     beforeSubmit() {
       this.model.moddate = moment(this.model.moddate).format('yyyy-MM-DD HH:mm:ss')
     }
+  },
+  computed: {
+    formItems() {
+      return [
+        {
+          label: 'Detector Code',
+          type: 'a-input',
+          name: 'detectorCode',
+          props: {
+            allowClear: true
+          },
+          style: {
+            width: '310px'
+          }
+        },
+        {
+          label: 'Type',
+          type: 'custom-select',
+          name: 'type',
+          props: {
+            options: this.typeList,
+            allowClear: true,
+            showSearch: true,
+            filterOption: this.filterOption
+          },
+          style: {
+            width: '310px'
+          }
+        },
+        {
+          label: 'Status',
+          type: 'j-dict-select-tag',
+          name: 'status',
+          props: {
+            dictCode: 'STATION_STATUS',
+            getPopupContainer: () => {
+              return document.body
+            }
+          },
+          style: {
+            width: '310px'
+          }
+        }
+      ]
+    }
   }
 }
 </script>

src/views/system/NuclearFacility.vue

@@ -2,7 +2,7 @@
   <a-card :bordered="false">
     <!-- 搜索栏 -->
     <search-form :items="formItems" v-model="queryParam" @search="searchQuery">
-      <a-space style="float: right;" class="btn-group" slot="additional">
+      <a-space style="float: right" class="btn-group" slot="additional">
         <a-button @click="onAdd" type="primary">
           <img src="@/assets/images/global/add.png" alt="" />
           Add
@@ -84,47 +84,7 @@
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import FormMixin from '@/mixins/FormMixin'
 import { cloneDeep } from 'lodash'
-
+import { getAction } from '../../api/manage'
-const formItems = [
-  {
-    label: 'Name',
-    type: 'a-input',
-    name: 'facilityName',
-    style: {
-      width: '300px'
-    }
-  },
-  {
-    label: 'Type',
-    type: 'a-input',
-    name: 'type',
-    style: {
-      width: '300px'
-    }
-  },
-  {
-    label: 'Location',
-    type: 'a-input',
-    name: 'location',
-    style: {
-      width: '300px'
-    }
-  },
-  {
-    label: 'Status',
-    type: 'j-dict-select-tag',
-    name: 'status',
-    props: {
-      getPopupContainer: () => {
-        return document.body
-      },
-      dictCode: 'NUCLEARFACILITY_STATUS'
-    },
-    style: {
-      width: '300px'
-    }
-  }
-]
 
 const columns = [
   {
@@ -182,7 +142,6 @@ const columns = [
 export default {
   mixins: [JeecgListMixin, FormMixin],
   data() {
-    this.formItems = formItems
     this.columns = columns
     return {
       queryParam: {},
@@ -195,10 +154,38 @@ export default {
         delete: '/gardsNuclearfacility/deleteById',
         add: '/gardsNuclearfacility/create',
         edit: '/gardsNuclearfacility/update'
-      }
+      },
+      typeList: [],
+      locationList: []
     }
   },
+  created() {
+    this.getTypeList()
+    this.getLocationList()
+  },
   methods: {
+    async getTypeList() {
+      try {
+        const res = await getAction('/gardsNuclearfacility/findType')
+        this.typeList = res.filter(item => item).map(item => ({ label: item, value: item }))
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    async getLocationList() {
+      try {
+        const res = await getAction('/gardsNuclearfacility/findLocation')
+        this.locationList = res.filter(item => item).map(item => ({ label: item, value: item }))
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+
     onAdd() {
       this.isAdd = true
       this.model = {}
@@ -228,6 +215,65 @@ export default {
         this.$message.warn('Please Select An Item To Delete')
       }
     }
+  },
+  computed: {
+    formItems() {
+      return [
+        {
+          label: 'Name',
+          type: 'a-input',
+          name: 'facilityName',
+          props: {
+            allowClear: true
+          },
+          style: {
+            width: '300px'
+          }
+        },
+        {
+          label: 'Type',
+          type: 'custom-select',
+          name: 'type',
+          props: {
+            options: this.typeList,
+            allowClear: true,
+            showSearch: true,
+            filterOption: this.filterOption
+          },
+          style: {
+            width: '300px'
+          }
+        },
+        {
+          label: 'Location',
+          type: 'custom-select',
+          name: 'location',
+          props: {
+            options: this.locationList,
+            allowClear: true,
+            showSearch: true,
+            filterOption: this.filterOption
+          },
+          style: {
+            width: '300px'
+          }
+        },
+        {
+          label: 'Status',
+          type: 'j-dict-select-tag',
+          name: 'status',
+          props: {
+            getPopupContainer: () => {
+              return document.body
+            },
+            dictCode: 'NUCLEARFACILITY_STATUS'
+          },
+          style: {
+            width: '300px'
+          }
+        }
+      ]
+    }
   }
 }
 </script>

src/views/system/stationList.vue

@@ -91,39 +91,7 @@
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import FormMixin from '@/mixins/FormMixin'
 import { cloneDeep } from 'lodash'
-
+import { getAction } from '../../api/manage'
-const formItems = [
-  {
-    label: 'Country Code',
-    type: 'a-input',
-    name: 'countryCode',
-    style: {
-      width: '310px'
-    }
-  },
-  {
-    label: 'Type',
-    type: 'a-input',
-    name: 'type',
-    style: {
-      width: '310px'
-    }
-  },
-  {
-    label: 'Status',
-    type: 'j-dict-select-tag',
-    name: 'status',
-    props: {
-      dictCode: 'STATION_STATUS',
-      getPopupContainer: () => {
-        return document.body
-      }
-    },
-    style: {
-      width: '310px'
-    }
-  }
-]
 
 const columns = [
   {
@@ -191,7 +159,6 @@ const columns = [
 export default {
   mixins: [JeecgListMixin, FormMixin],
   data() {
-    this.formItems = formItems
     this.columns = columns
     const validateStationCode = (_, value, callback) => {
       if (!value) {
@@ -224,10 +191,38 @@ export default {
         delete: '/gardsStations/deleteById',
         add: '/gardsStations/create',
         edit: '/gardsStations/update'
-      }
+      },
+      countryCodeList: [],
+      typeList: []
     }
   },
+  created() {
+    this.getTypeList()
+    this.getCountryCodeList()
+  },
   methods: {
+    async getTypeList() {
+      try {
+        const res = await getAction('/gardsStations/findType')
+        this.typeList = res.filter(item => item).map(item => ({ label: item, value: item }))
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    async getCountryCodeList() {
+      try {
+        const res = await getAction('/gardsStations/findCountryCode')
+        this.countryCodeList = res.filter(item => item).map(item => ({ label: item, value: item }))
+      } catch (error) {
+        console.error(error)
+      }
+    },
+
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+
     onAdd() {
       this.isAdd = true
       this.model = {}
@@ -257,6 +252,54 @@ export default {
         this.$message.warn('Please Select An Item To Delete')
       }
     }
+  },
+  computed: {
+    formItems() {
+      return [
+        {
+          label: 'Country Code',
+          type: 'custom-select',
+          name: 'countryCode',
+          props: {
+            options: this.countryCodeList,
+            allowClear: true,
+            showSearch: true,
+            filterOption: this.filterOption
+          },
+          style: {
+            width: '310px'
+          }
+        },
+        {
+          label: 'Type',
+          type: 'custom-select',
+          name: 'type',
+          props: {
+            options: this.typeList,
+            allowClear: true,
+            showSearch: true,
+            filterOption: this.filterOption
+          },
+          style: {
+            width: '310px'
+          }
+        },
+        {
+          label: 'Status',
+          type: 'j-dict-select-tag',
+          name: 'status',
+          props: {
+            dictCode: 'STATION_STATUS',
+            getPopupContainer: () => {
+              return document.body
+            }
+          },
+          style: {
+            width: '310px'
+          }
+        }
+      ]
+    }
   }
 }
 </script>