fix：修改asset 详细视图切换时 没有保存分页信息，修改endpoint 搜索部分的数据来源

nezha-fronted/src/components/common/labelFilter/clickSearch.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="{'min-height': height + 'px',height:getHeight + 'px'}" class="search-box__container">
-    <div v-for="(data, type, index) in titleSearchListCopy" v-cloak :key="index" ref="searchContentBox" :class="{'search-content-box-height': data.length == 0}" class="search-content-box">
+    <div v-for="(data, type, index) in titleSearchListCopy" v-if="data.children&&data.children.length" v-cloak :key="index" ref="searchContentBox" :class="{'search-content-box-height': data.length == 0}" class="search-content-box">
       <div class="search-title">{{data.label}}:</div>
       <el-skeleton v-if="data.type === 'checkBox'" :class="skeletonClass(data)" :loading="!data.show" :rows="1" class="search-items">
         <template>
@@ -215,16 +215,24 @@ export default {
         this.titleSearchListCopy[type].children.forEach(c => {
           cascs.push(this.$refs[`${type}_${c.id}_cascader`][0])
         })
-        if (type === 'assetLabel') { // label特殊处理，组织成{“id”:[“张三”,"lw"],"id":["李四"]}
+        if (type === 'assetLabel' || type === 'state') { // label特殊处理，组织成{“id”:[“张三”,"lw"],"id":["李四"]}
           const values = {}
           cascs.forEach(c => {
             const nodes = c.$refs.cascader.getCheckedNodes()
             nodes.forEach(n => {
               const metaId = n.data.metaId
-              if (values[metaId]) {
+              if (type === 'assetLabel') {
-                values[metaId].push(n.data.name)
+                if (values[metaId]) {
+                  values[metaId].push(n.data.name)
+                } else {
+                  values[metaId] = [n.data.name]
+                }
               } else {
-                values[metaId] = [n.data.name]
+                if (values[metaId]) {
+                  values[metaId].push(n.data.id)
+                } else {
+                  values[metaId] = [n.data.id]
+                }
               }
             })
           })

nezha-fronted/src/components/common/labelFilter/dropdown.vue

@@ -39,7 +39,7 @@ export default {
       immediate: true,
       handler (n) {
         this.cascaderData = []
-        if (n && this.type !== 'fields') {
+        if (n && this.type !== 'fields' && this.type !== 'state') {
           n.forEach(item => {
             if (this.item.children.find(children => children.id == item)) {
               this.cascaderData.push([item])
@@ -48,7 +48,7 @@ export default {
               })
             }
           })
-        } else if (n && this.type === 'fields') {
+        } else if (n && (this.type === 'fields' || this.type === 'state')) {
           const obj = JSON.parse(n)
           if (obj[this.item.id]) {
             obj[this.item.id].forEach(item => {

nezha-fronted/src/components/common/mixin/detailViewMixin.js

@@ -59,7 +59,6 @@ export default {
           this.selectValue.fields = ''
         }
       }
-      this.pageObj.pageNo = 1
       setTimeout(() => {
         this.detailViewLoading = false
         this.$refs.clickSearch && this.$refs.clickSearch.needMore()

nezha-fronted/src/components/page/asset/asset.vue

@@ -702,6 +702,13 @@ export default {
           this.titleSearchList[key].children = statistics[keys].map(d => { return { ...d, value: d.id } })
           this.detailSearchList[key].children = statistics[keys].map(d => { return { ...d, value: d.id } })
         }
+        if (this.titleSearchList[key].children.length === 0) {
+          // delete this.titleSearchList[key]
+          // delete this.detailSearchList[key]
+        } else {
+          this.titleSearchList[key].show = true
+          this.detailSearchList[key].show = true
+        }
         this.titleSearchList[key].show = true
         this.detailSearchList[key].show = true
       })

nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue

@@ -292,7 +292,7 @@ export default {
         state: {
           label: 'State',
           key: 'state',
-          type: 'checkBox',
+          type: 'dropdownCheckBox',
           children: [],
           show: false,
           showMore: false,
@@ -313,7 +313,7 @@ export default {
       selectValue: {
         projectIds: [],
         moduleIds: [],
-        state: [],
+        state: '',
         type: []
       },
       searchCheckBox: {},
@@ -449,6 +449,11 @@ export default {
       }
       this.$set(this.searchLabel, 'pageNo', this.pageObj.pageNo)
       this.$set(this.searchLabel, 'pageSize', this.pageObj.pageSize)
+      if (this.$route.path === '/monitor/endpoint' && !this.titleSearchList.project.children.length) {
+        this.$set(this.searchLabel, 'statistics', 1)
+      } else {
+        delete this.searchLabel.statistics
+      }
       const params = {
         ...this.searchLabel,
         ...this.searchCheckBox
@@ -458,6 +463,9 @@ export default {
       this.$get(this.url, params).then(response => {
         this.tools.loading = false
         if (response.code === 200) {
+          if (response.statistics && this.$route.path === '/monitor/endpoint') {
+            this.setSearchData(response.statistics)
+          }
           for (let i = 0; i < response.data.list.length; i++) {
             response.data.list[i].configs.forEach(item => {
               item.config = JSON.parse(item.config)
@@ -475,42 +483,91 @@ export default {
       })
     },
     reloadTable (obj) {
-      Object.keys(obj).forEach(key => {
+      const params = JSON.parse(JSON.stringify(obj))
-        if (key === 'change') {
+      if (this.detailType === 'view') {
-          return
+        const obj = {}
+        params.modelIds = params.modelIdsDetail.map(item => item.split('-')[1])
+        params.fieldsDetail.forEach(item => {
+          const arr = item.split('-')
+          if (obj[arr[0]]) {
+            obj[arr[0]].push(arr[1])
+          } else {
+            obj[arr[0]] = [arr[1]]
+          }
+        })
+        params.fields = JSON.stringify(obj)
+        if (params.fields === '{}') {
+          params.fields = ''
+        }
+        delete params.modelIdsDetail
+        delete params.fieldsDetail
+      }
+      Object.keys(params).forEach(key => {
+        if (typeof params[key] === 'string') {
+          this.searchCheckBox[key] = params[key] ? params[key] : null
+        } else {
+          params[key] && params[key].length > 0 ? this.searchCheckBox[key] = params[key].join(',') : this.searchCheckBox[key] = null
         }
-        this.searchCheckBox[key] = obj[key].join(',')
       })
-      this.getTableData()
+      if (!this.timer) {
+        this.timer = setTimeout(() => {
+          this.getTableData()
+          clearTimeout(this.timer)
+          this.timer = ''
+        }, 1000)
+      } else {
+        clearTimeout(this.timer)
+        this.timer = setTimeout(() => {
+          this.getTableData()
+          clearTimeout(this.timer)
+          this.timer = ''
+        }, 1000)
+      }
     },
-    getTitleSearch () {
+    getSearchableStateData (data) {
-      this.$get('monitor/project', { pageSize: -1 }).then(res => {
+      return new Promise(resolve => {
-        if (res.code === 200) {
+        // this.$get('asset/model?pageSize=-1').then(response => {
-          this.titleSearchList.project.children = res.data.list.map(item => {
+        if (data) {
-            return { key: item.name, value: item.id, name: item.name }
+          this.modelData = data
+          const titleSearchData = {}
+          this.modelData.forEach(m => {
+            m.value = []
+            m.metaId = m.type
+            if (titleSearchData[m.type]) {
+              titleSearchData[m.type].children.push(m)
+            } else {
+              titleSearchData[m.type] = { ...m, children: [m], name: m.type, id: m.type }
+            }
           })
-          this.titleSearchList.project.show = true
+          resolve(Object.keys(titleSearchData).map(b => titleSearchData[b]))
+          // this.titleSearchList.model.children = Object.keys(titleSearchData).map(b => titleSearchData[b])
         }
+        resolve()
+        // })
       })
-      this.$get('monitor/module', { pageSize: -1 }).then(res => {
+    },
-        if (res.code === 200) {
+    setSearchData (statistics) {
-          this.titleSearchList.module.children = res.data.list.map(item => {
+      Object.keys(this.titleSearchList).forEach(key => {
-            return { key: item.name, value: item.id, name: item.name }
+        let keys = key
+        if (key === 'projectIds') {
+          keys = 'project'
+        } else if (key === 'moduleIds') {
+          keys = 'module'
+        }
+        if (key === 'state') {
+          this.getSearchableStateData(statistics[keys]).then(res => {
+            this.titleSearchList.state.children = res
+            // this.detailSearchList.state.children = res
+            this.titleSearchList.state.show = true
+            // this.detailSearchList.state.show = true
           })
-          this.titleSearchList.module.show = true
+        } else {
+          this.titleSearchList[key].children = statistics[keys].map(d => { return { ...d, value: d.id, key: d.name, name: d.name } })
+          // this.detailSearchList[key].children = statistics[keys].map(d => { return { ...d, value: d.id } })
         }
+        this.titleSearchList[key].show = true
+        // this.detailSearchList[key].show = true
       })
-      this.titleSearchList.state.children = [
-        { key: 'Down', value: 0, name: 'Down' },
-        { key: 'Up', value: 1, name: 'Up' },
-        { key: 'Suspended', value: 2, name: 'Suspended' }
-      ]
-      // this.titleSearchList.type.children = [
-      //   { key: 'Metrics', value: 'metrics', name: 'Metrics' },
-      //   { key: 'Logs', value: 'logs', name: 'Logs' }
-      // ]
-      this.titleSearchList.state.show = true
-      // this.titleSearchList.type.show = true
     },
     batchModify () {
       if (!this.batchDeleteObjs.length) {
@@ -550,7 +607,7 @@ export default {
       this.selectValue.projectIds = [Number(localStorage.getItem('endpointProjectId'))]
       // this.$refs.clickSearch.selectValueOut.projectIds = [localStorage.getItem('endpointProjectId')]
     }
-    this.getTitleSearch()
+    // this.getTitleSearch()
   },
   watch: {
     $route: {