NEZ-863 fix：修改panel 页面 搜素后样式错乱的问题

nezha-fronted/src/components/charts/chart-alert-list.vue

@@ -326,7 +326,7 @@ export default {
       handler (n, o) {
         if (n.id) {
           if (!n.param.state && n.param.state != Number) {
-            n.param.state = "1"
+            n.param.state = '1'
           }
           if (n.param.severity && n.param.severity != Number) {
             n.param.severity = 1

nezha-fronted/src/components/charts/chart-bar-statistics.vue

@@ -293,7 +293,9 @@ export default {
       this.screenModal = true
     },
     resize (chartItem) {
-      getChart(this.chartIndex).resize()
+      if (getChart(this.chartIndex)) {
+        getChart(this.chartIndex).resize()
+      }
     },
     // 设置数据, filter区分
     setData (chartItem, seriesItem, panelId, filter, legend, area, errorMsg) {

nezha-fronted/src/components/charts/chart-group.vue

@@ -12,7 +12,7 @@
             <el-dropdown-menu style="display: none"></el-dropdown-menu>
             <span class="el-dropdown-link chart-title">
               <span class="chart-title-text">
-                <span @click="showList=!showList">
+                <span @click="showListChange">
                   <i class="nz-icon nz-icon-arrow-down" :class="showList?'':'is-active'"/>
                 </span>
                 {{chartData.name}}
@@ -286,6 +286,14 @@ export default {
         that.firstShow = true
         that.endLoading('screen')
       })
+    },
+    showListChange () {
+      this.showList = !this.showList
+      if (this.showList) {
+        this.$nextTick(() => {
+          this.$refs.listGroup.resize()
+        })
+      }
     }
   },
   watch: {

nezha-fronted/src/components/charts/chart-list-group.vue

@@ -75,7 +75,7 @@
                           @sync="()=>{chartBySync(item)}"
                           :panel-id="filter.panelId"
                           :is-lock="panelLock"
-                          :chart-index="item.chartIndex"
+                          :chart-index="item.id"
                           @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
                           :chart-data="item"
         ></line-chart-block>
@@ -92,7 +92,7 @@
                      :is-lock="panelLock"
                      :panel-id="filter.panelId"
                      @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
-                     :chart-index="item.chartIndex"></chart-single-stat>
+                     :chart-index="item.id"></chart-single-stat>
 
         <chart-table  :from="from" :key="'inner' + item.id" :ref="'editChart'+item.id" v-if="item.type === 'table'"
                       @on-refresh-data="refreshChart"
@@ -106,7 +106,7 @@
                       :panel-id="filter.panelId"
                       :chart-data="item"
                       @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
-                      :chart-index="item.chartIndex"></chart-table>
+                      :chart-index="item.id"></chart-table>
 
         <chart-url  :from="from" :key="'inner' + item.id" :ref="'editChart'+item.id" v-if="item.type === 'url'"
                      @on-refresh-data="refreshChart"
@@ -120,11 +120,11 @@
                      :panel-id="filter.panelId"
                      :chart-data="item"
                       @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
-                     :chart-index="item.chartIndex"></chart-url>
+                     :chart-index="item.id"></chart-url>
 
         <chart-detail  v-if="item.type === 'assetInfo' || item.type == 'projectInfo' || item.type == 'endpointInfo' || item.type == 'alertRuleInfo'" :ref="'editChart'+item.id" :key="'inner' + item.id"
                           :from="from" :panel-id="filter.panelId"
-                          :chart-index="item.chartIndex"
+                          :chart-index="item.id"
                           @on-refresh-data="refreshChart"
                           :is-lock="panelLock"
                           :chart-data="item"
@@ -143,7 +143,7 @@
                     :is-lock="panelLock"
                     :panel-id="filter.panelId"
                     :chart-data="item"
-                    :chart-index="item.chartIndex"
+                    :chart-index="item.id"
         ></text-chart>
 
         <diagramChart :from="from" :key="'inner' + item.id" :ref="'editChart'+item.id" v-if="item.type === 'diagram'"
@@ -162,7 +162,7 @@
 
         <chart-alert-list  :from="from" :ref="'editChart'+item.id"
                            :panel-id="filter.panelId"
-                          :chart-index="item.chartIndex"
+                          :chart-index="item.id"
                           v-if="item.type  === 'alertList'"
                           :editChartId="'editChartId' + item.id"
                            :is-lock="panelLock"
@@ -189,7 +189,7 @@
                          :is-lock="panelLock"
                          :panel-id="filter.panelId"
                          @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
-                         :chart-index="item.chartIndex"></chartBarStatis>
+                         :chart-index="item.id"></chartBarStatis>
         <chart-pie  :from="from" :key="'inner' + item.id" :ref="'editChart'+item.id" v-if="item.type === 'pie'" :temp-dom="tempDom"
                             @on-refresh-data="refreshChart"
                             @on-search-data="searchData"
@@ -202,7 +202,7 @@
                             :is-lock="panelLock"
                             :panel-id="filter.panelId"
                             @dropmenu-change="(show) => {dropmenuChange(item.id, show)}"
-                            :chart-index="item.chartIndex"></chart-pie>
+                            :chart-index="item.id"></chart-pie>
       </div>
    </draggable>
     <el-row v-if="dataList.length === 0"  class="noData"></el-row>
@@ -424,13 +424,13 @@ export default {
       this.pagePanelId = this.filter.panelId
       this.getData(this.filter)
     },
-    searchCharts (searchName) {
+    searchCharts (searchName, group) {
       // this.dataList = [];
       // this.dataTotalList = [];
       const chartListTmp = []
       if (searchName && searchName.trim() !== '') {
         this.dataTotalListBak.forEach((item) => {
-          if (item.name.indexOf(searchName) > -1) {
+          if (item.name.indexOf(searchName) > -1 || group.name.indexOf(searchName) > -1) {
             item.isLoaded = false
             item.isHide = false
             chartListTmp.push(item)
@@ -455,7 +455,7 @@ export default {
         if (this.dataList.length > 0) {
           this.dataList.forEach((item, index) => {
             this.$refs['editChart' + item.id][0].showLoad(item)// 之后要实现
-            this.setChartSize(item.span, index)// 设置该图表宽度
+            this.setChartSize(item, index)// 设置该图表宽度
             if (!item.isLoaded) {
               // 获得当前显示在浏览器的图表，从后台获取数据
               const chartBox = document.getElementById('chart-' + item.id)// this.$refs['editChart'+item.id][0];
@@ -1468,6 +1468,18 @@ export default {
         this.getChartData(item, index, this.filter)
       })
     },
+    resize () {
+      this.dataList.forEach((item, index) => {
+        if (item.isHide) {
+          return
+        }
+        if (this.$refs['editChart' + item.id][0].chartResize) {
+          this.$refs['editChart' + item.id][0].chartResize()
+        } else if (this.$refs['editChart' + item.id][0].resize) {
+          this.$refs['editChart' + item.id][0].resize()
+        }
+      })
+    },
     searchData (chartId, searchTime) {
       if (searchTime) { // 全屏时间查询
         this.filter.start_time = bus.timeFormate(searchTime[0], 'yyyy-MM-dd hh:mm:ss')

nezha-fronted/src/components/charts/chart-list.vue

@@ -476,14 +476,22 @@ export default {
           } else {
             item.isLoaded = true
             item.isHide = true
+            let groupShowFlag = false // 判断group内的chart是否被匹配
             if (item.type === 'group' && item.children) {
               item.children.forEach(groupItem => {
                 if (groupItem.name.indexOf(searchName) > -1) {
                   item.isLoaded = false
                   item.isHide = false
-                  chartListTmp.push(item)
+                  groupShowFlag = true
                 }
               })
+              if (groupShowFlag) {
+                item.isLoaded = false
+                item.isHide = false
+                chartListTmp.push(item)
+              } else {
+                chartListTmp.push(item)
+              }
             } else {
               chartListTmp.push(item)
             }
@@ -504,14 +512,14 @@ export default {
         if (this.dataList.length > 0) {
           this.dataList.forEach((item, index) => {
             this.$refs['editChart' + item.id][0].showLoad(item)// 之后要实现
-            this.setChartSize(item.span, index)// 设置该图表宽度
+            this.setChartSize(item, index)// 设置该图表宽度
             if (!item.isLoaded) {
               // 获得当前显示在浏览器的图表，从后台获取数据
               const chartBox = document.getElementById('chart-' + item.id)// this.$refs['editChart'+item.id][0];
               this.handleElementInViewport(chartBox, 0, item, index, true)
             }
             if (item.type === 'group') {
-              this.$refs['editChart' + item.id][0].$refs.listGroup.searchCharts(searchName)
+              this.$refs['editChart' + item.id][0].$refs.listGroup.searchCharts(searchName, item)
             }
           })
         }
@@ -833,7 +841,6 @@ export default {
 
       if (chartItem.type == 'diagram') {
         if (this.$refs['editChart' + chartItem.id] && this.$refs['editChart' + chartItem.id].length > 0) {
-
           if (filterType === 'refresh') {
             this.$get('visual/panel/chart/' + chartItem.id).then(res => {
               const data = res.data.data

nezha-fronted/src/components/charts/chart-pie.vue

@@ -289,7 +289,9 @@ export default {
       this.screenModal = true
     },
     resize (chartItem) {
-      getChart(this.chartIndex).resize()
+      if (getChart(this.chartIndex)) {
+        getChart(this.chartIndex).resize()
+      }
     },
     // 设置数据, filter区分
     setData (chartItem, seriesItem, panelId, filter, legend, area, errorMsg) {

nezha-fronted/src/components/charts/line-chart-block.vue

@@ -1982,7 +1982,9 @@ export default {
       }
     },
     chartResize () {
-      getChart(this.chartIndex).resize()
+      if (getChart(this.chartIndex)) {
+        getChart(this.chartIndex).resize()
+      }
     }
   },
   created () {

nezha-fronted/src/components/common/bottomBox/tabs/assetTab.vue

@@ -58,7 +58,7 @@ import subDataListMixin from '@/components/common/mixin/subDataList'
 import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
 import assetTable from '@/components/common/table/asset/assetTable'
 import assetBox from '@/components/common/rightBox/asset/assetBox'
-import { fromRoute } from "@/components/common/js/constants";
+import { fromRoute } from '@/components/common/js/constants'
 import alertSilenceBox from '@/components/common/rightBox/alertSilenceBox'
 
 export default {

nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue

@@ -70,7 +70,7 @@ import dataListMixin from '@/components/common/mixin/dataList'
 import subDataListMixin from '@/components/common/mixin/subDataList'
 import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
 import cabinetTable from '@/components/common/table/settings/cabinetTable'
-import topToolMoreOptions from "@/components/common/popBox/topToolMoreOptions";
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 export default {
   name: 'cabinetTab',
   mixins: [dataListMixin, subDataListMixin],

nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue

@@ -47,7 +47,7 @@ import subDataListMixin from '@/components/common/mixin/subDataList'
 import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
 import endpointTable from '@/components/common/table/settings/endpointTable'
 import EditEndpointBoxNew from '@/components/common/rightBox/editEndpointBoxNew'
-import { fromRoute } from "@/components/common/js/constants";
+import { fromRoute } from '@/components/common/js/constants'
 import alertSilenceBox from '@/components/common/rightBox/alertSilenceBox'
 
 export default {

nezha-fronted/src/components/common/bottomBox/tabs/terminalLogMonitorTab.vue

@@ -113,11 +113,11 @@ export default {
       }
       // 登录后，你输入的内容从后台服务返回
       this.terminal.on('data', function (data) {
-          // let code = data.charCodeAt(0);
+        // let code = data.charCodeAt(0);
-          // if(code==13){
+        // if(code==13){
-          // }else {
+        // }else {
-          //   that.term.write(data);
+        //   that.term.write(data);
-          // }
+        // }
       })
       // 返回
       this.terminalSocket.onmessage = function (evt) {

nezha-fronted/src/components/common/js/radomcolor/randomcolor.js

@@ -1,11 +1,10 @@
 
-function randomNum(){
+function randomNum () {
-  let array = window.crypto.getRandomValues(new Uint32Array(3))
+  const array = window.crypto.getRandomValues(new Uint32Array(3))
 
-  let avg = eval(array.join('+'))/3
+  const avg = eval(array.join('+')) / 3
-
-  return array[0]>avg?avg/array[0]:array[0]/avg;
 
+  return array[0] > avg ? avg / array[0] : array[0] / avg
 }
 
 function randomcolor () {

nezha-fronted/src/components/common/login.vue

@@ -112,9 +112,9 @@ export default {
       }
     },
     licenseStat () {
-      /*this.license.valid = false
+      /* this.license.valid = false
       this.license.warnInfo = 'hehehe'
-      this.license.token = 'dRqrWja/PzI8FrWVJeGqLw=='*/
+      this.license.token = 'dRqrWja/PzI8FrWVJeGqLw==' */
       this.$get('/sys/license/state').then(response => {
         if (response.code && response.code === 200) {
           this.license.warnInfo = ''

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

@@ -1,7 +1,7 @@
 import bus from '@/libs/bus'
 import { tableSet } from '@/components/common/js/tools'
 import { fromRoute } from '@/components/common/js/constants'
-import {object} from "cytoscape/src/is";
+import { object } from 'cytoscape/src/is'
 export default {
   data () {
     return {
@@ -234,7 +234,7 @@ export default {
         })
       } else if (type === 'alertRule') {
         this.objectSilence.matchers = [
-          { name: 'alertName', value: row.name, regex: 0 },
+          { name: 'alertName', value: row.name, regex: 0 }
         ]
       }
       this.silenceBoxShow = true

nezha-fronted/src/components/common/project/L5/CanvasContextMenu.vue

@@ -132,7 +132,7 @@ export default {
     },
     canvaspaste () {
       getTopology(this.index).paste()
-    },
+    }
   }
 }
 </script>

nezha-fronted/src/components/common/project/L5/CanvasProps.vue

@@ -1109,22 +1109,22 @@
 </template>
 
 <script>
-import {alignNodes, spaceBetween, layout} from '@topology/layout'
+import { alignNodes, spaceBetween, layout } from '@topology/layout'
-import {getTopology, resetZIndex} from '../../js/common'
+import { getTopology, resetZIndex } from '../../js/common'
 import chartDataFormat from '../../../charts/chartDataFormat'
 import promqlInput from '../../../page/dashboard/explore/promqlInput'
 import nezhaColor from '../../nezhaColor'
 
 const rz = {
   methods: {
-    rz(e) {
+    rz (e) {
       resetZIndex(e)
     }
   }
 }
 export default {
   // pen.type 0为node 1位line
-  data() {
+  data () {
     return {
       expressions: [],
       chartTypeList: [
@@ -1135,7 +1135,7 @@ export default {
         {
           id: 'stackArea',
           name: this.$t('dashboard.panel.chartForm.typeVal.stackArea.label')
-        },
+        }
         // {
         //   id: 'bar',
         //   name: this.$t('dashboard.panel.chartForm.typeVal.bar.label')
@@ -1277,19 +1277,19 @@ export default {
         }
       ],
       penDash: [
-        {d: 'M5 14 l85 0', 'stroke-dasharray': ''},
+        { d: 'M5 14 l85 0', 'stroke-dasharray': '' },
-        {d: 'M5 14 l85 0', 'stroke-dasharray': '5,5'},
+        { d: 'M5 14 l85 0', 'stroke-dasharray': '5,5' },
-        {d: 'M5 14 l85 0', 'stroke-dasharray': '10,10'},
+        { d: 'M5 14 l85 0', 'stroke-dasharray': '10,10' },
-        {d: 'M5 14 l85 0', 'stroke-dasharray': '10,10,2,10'}
+        { d: 'M5 14 l85 0', 'stroke-dasharray': '10,10,2,10' }
       ],
       penLineType: [
-        {d: 'M5 14 a100,50 0 0,1 85,0', 'stroke-dasharray': '', name: 'curve'},
+        { d: 'M5 14 a100,50 0 0,1 85,0', 'stroke-dasharray': '', name: 'curve' },
-        {d: 'M5 8 l40 0 l0 12 l40 0', 'stroke-dasharray': '', name: 'polyline'},
+        { d: 'M5 8 l40 0 l0 12 l40 0', 'stroke-dasharray': '', name: 'polyline' },
-        {d: 'M5 14 l85 0', 'stroke-dasharray': '', name: 'line'}
+        { d: 'M5 14 l85 0', 'stroke-dasharray': '', name: 'line' }
         // {d:'M5 20 C0,8 50,0 85,0',"stroke-dasharray":"",name:'mind'},
       ],
       penLineFromTOArrow: [
-        {d: 'M5 14 l85 0', points: '', fill: '', stroke: '', 'stroke-width': '', name: ''},
+        { d: 'M5 14 l85 0', points: '', fill: '', stroke: '', 'stroke-width': '', name: '' },
         {
           d: 'M5 14 l85 0',
           points: '5 14,20 9,20 19',
@@ -1328,11 +1328,11 @@ export default {
         }
       ],
       lineAnimateOptions: [
-        {id: 1, name: this.$t('project.topology.flow')},
+        { id: 1, name: this.$t('project.topology.flow') },
-        {id: 'beads', name: this.$t('project.topology.beads')},
+        { id: 'beads', name: this.$t('project.topology.beads') },
-        {id: 'dot', name: this.$t('project.topology.dot')},
+        { id: 'dot', name: this.$t('project.topology.dot') },
-        {id: 'comet', name: this.$t('project.topology.comet')},
+        { id: 'comet', name: this.$t('project.topology.comet') },
-        {id: 'custom', name: this.$t('project.topology.none')}
+        { id: 'custom', name: this.$t('project.topology.none') }
       ],
       nodeAnimateOptions: [
         {
@@ -1440,7 +1440,7 @@ export default {
     //   immediate:false,
     // },
     selection: {
-      handler() {
+      handler () {
         // this.loading = false
         if (this.selection.pen && this.selection.pen.data && (!this.selection.pen.data.expressAllArr || this.selection.pen.data.expressAllArr.length === 0)) {
           this.selection.pen.data.expressAllArr = ['']
@@ -1451,7 +1451,7 @@ export default {
       immediate: true
     },
     fromDiagram: {
-      handler() {
+      handler () {
         if (this.selection.pen && this.selection.pen.data) {
           // eslint-disable-next-line vue/no-mutating-props
           this.selection.pen.data.iconToolState = false
@@ -1461,14 +1461,14 @@ export default {
       immediate: true
     },
     imgArr: {
-      handler() {
+      handler () {
         // this.loading = false
       },
       deep: true,
       immediate: true
     }
   },
-  created() {
+  created () {
     const dataOption = this.index == -2 ? getTopology(-1).data : getTopology(this.index).data
     if (!dataOption.data) {
       dataOption.data = {}
@@ -1481,14 +1481,14 @@ export default {
       }
     })
   },
-  mounted() {
+  mounted () {
     // this.queryMetrics()
     // this.topologyData.data.grid= !!dataOption.grid;
     // this.topologyData.data.rule= !!dataOption.rule;
     // this.topologyData.data.projectInfo= !!dataOption.projectInfo;
     // this.topologyData.data.alertInfo= !!dataOption.alertInfo;
   },
-  updated(n, o) {
+  updated (n, o) {
     if (!this.selection.pen) { // 没选中node line返回
       return
     }
@@ -1506,7 +1506,7 @@ export default {
     }
   },
   methods: {
-    queryMetrics() {
+    queryMetrics () {
       this.metricOptions = []
       this.$get('prom/api/v1/label/__name__/values').then(response => {
         if (response.status == 'success') {
@@ -1523,9 +1523,9 @@ export default {
             }
             if (metricMap.get(key)) {
               const values = metricMap.get(key)
-              values.push({label: item, value: item})
+              values.push({ label: item, value: item })
             } else {
-              const values = [{label: item, value: item}]
+              const values = [{ label: item, value: item }]
               metricMap.set(key, values)
             }
             // this.metricStore.push({label:item,value:item,insertText:item})
@@ -1543,9 +1543,9 @@ export default {
         }
       })
     },
-    tabClick(n) {
+    tabClick (n) {
     },
-    moduleIdChange(n) {
+    moduleIdChange (n) {
       this.selection.pen.data.moduleName = this.modules.find(item => item.id === n).name
       if (!this.selection.pen.data.title) {
         this.selection.pen.data.title = this.selection.pen.data.moduleName
@@ -1554,7 +1554,7 @@ export default {
         this.$emit('notModuleIDArrChange', this.selection.pen.id)
       }
     },
-    changeTitle(val) {
+    changeTitle (val) {
       if (!val) {
         this.selection.pen.text = this.selection.pen.data.moduleName || ''
         this.selection.pen.data.title = this.selection.pen.data.moduleName || ''
@@ -1563,7 +1563,7 @@ export default {
       }
       this.onChange()
     },
-    onChange(value) {
+    onChange (value) {
       if (value === 'lineWidth') {
         this.selection.pen.lineWidth = this.selection.pen.data.lineWidth
       }
@@ -1574,27 +1574,27 @@ export default {
       //   this.$emit('change');
       // }
     },
-    changeExpand() {
+    changeExpand () {
       this.selection.expand = !this.selection.expand
     },
-    isJson(obj) {
+    isJson (obj) {
       return typeof (obj) === 'object' && Object.prototype.toString.call(obj).toLowerCase() == '[object object]' && !obj.length
     },
 
     // 组件事件
-    onNodesAlign(align) { // 对齐node
+    onNodesAlign (align) { // 对齐node
       alignNodes(getTopology(this.index).activeLayer.pens, getTopology(this.index).activeLayer.rect, align)
       getTopology(this.index).updateProps()
     },
-    onSpaceBetween() {
+    onSpaceBetween () {
       spaceBetween(getTopology(this.index).activeLayer.pens, getTopology(this.index).activeLayer.rect.width)
       getTopology(this.index).updateProps()
     },
-    onLayout() { // 改变布局
+    onLayout () { // 改变布局
       layout(getTopology(this.index).activeLayer.pens, this.layout)
       getTopology(this.index).updateProps()
     },
-    onClickDash(number) { // 改变线型
+    onClickDash (number) { // 改变线型
       this.pen.dash = number
       this.drowdown = 0
       if (this.selection.pen) {
@@ -1603,7 +1603,7 @@ export default {
 
       this.onChange()
     },
-    onClickName(name) {
+    onClickName (name) {
       this.pen.name = name
       // this.pen.calcControlPoints()
       this.drowdown = 0
@@ -1612,7 +1612,7 @@ export default {
       }
       this.onChange()
     },
-    bkTypeChange(val) {
+    bkTypeChange (val) {
       this.selection.pen.data.gradientType = val
       this.$forceUpdate()
       if (val === 0) {
@@ -1638,17 +1638,17 @@ export default {
       }
       this.onChange()
     },
-    colorPickerClick(ref) {
+    colorPickerClick (ref) {
       this.$refs[ref].showPicker = true
     },
-    colorPickerClickTable(ref, row) {
+    colorPickerClickTable (ref, row) {
       row.showColor = row.color.fill
       row.showType = 'fill'
       this.$nextTick(() => {
         this.$refs[ref][0].showPicker = true
       })
     },
-    colorChange(val, name) { // 改变颜色
+    colorChange (val, name) { // 改变颜色
       const bktype = this.selection.pen.data.gradientType
       if (name === 'toArrowColor') {
         this.selection.pen.fromArrowColor = this.colorRGBtoHex(val)
@@ -1687,15 +1687,15 @@ export default {
       this.selection.pen.data[name] = this.colorRGBtoHex(val)
       this.onChange()
     },
-    colorChangeTable(item, val, key) { // 改变颜色
+    colorChangeTable (item, val, key) { // 改变颜色
       item.color[key] = this.colorRGBtoHex(val)
     },
-    changeShowPicker(item, type) {
+    changeShowPicker (item, type) {
       this.$refs['colorPickerBac' + item.level][0].showPicker = true
       item.showType = type
       item.showColor = item.color[type]
     },
-    colorOut(obj, e) {
+    colorOut (obj, e) {
       let flag = false
       e.path.forEach((item) => {
         if (item.className === 'el-color-dropdown el-color-picker__panel' || item.className === 'color-tab') {
@@ -1708,7 +1708,7 @@ export default {
       obj.showType = ''
       obj.showColor = undefined
     },
-    changeTopologyOpt(val, key, isColor) {
+    changeTopologyOpt (val, key, isColor) {
       //
       // getTopology(this.index).data[key]=val;
       // getTopology(this.index).render();
@@ -1727,7 +1727,7 @@ export default {
       getTopology(this.index).render()
       this.$emit('changeProjectTitle')
     },
-    colorRGBtoHex(color) { // 获取颜色16进制数
+    colorRGBtoHex (color) { // 获取颜色16进制数
       if (!color) {
         return ''
       }
@@ -1742,17 +1742,17 @@ export default {
       const hex = '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)
       return hex
     },
-    onClickToArrow(arrow) {
+    onClickToArrow (arrow) {
       this.selection.pen.toArrow = arrow
       this.drowdown = 0
       this.onChange()
     },
-    onClickFromArrow(arrow) {
+    onClickFromArrow (arrow) {
       this.selection.pen.fromArrow = arrow
       this.drowdown = 0
       this.onChange()
     },
-    changeAnimatePlay(val, type) {
+    changeAnimatePlay (val, type) {
       if (type === 'node') {
         if (val === 'custom') {
           this.selection.pen.data.animatePlay = false
@@ -1768,27 +1768,27 @@ export default {
       }
       this.onChange()
     },
-    onAnimate(val) {
+    onAnimate (val) {
       // this.selection.pen.animateStart=this.selection.pen.animateStart?Date.now():0;
       // this.selection.pen.data.animatePlay=this.selection.pen.animatePlay;
       this.onChange()
       // this.$emit('animate');
     },
-    delTopologyPen() {
+    delTopologyPen () {
       const delObj = this.selection.pen ? this.selection.pen.id : this.selection.pens
       this.$emit('del', delObj)
     },
-    getMetricOptions() {
+    getMetricOptions () {
       return this.metricOptions
     },
-    addExpression() {
+    addExpression () {
       this.selection.pen.data.expressAllArr.push('')
       this.selection.pen.data.legendsAll.push('')
     },
-    expressionChange(item) {
+    expressionChange (item) {
 
     },
-    removeExpression(index) {
+    removeExpression (index) {
       if (this.selection.pen.data.expressAllArr.length > 1) {
         this.selection.pen.data.expressAllArr.splice(index, 1)
         this.selection.pen.data.legendsAll.splice(index, 1)
@@ -1801,7 +1801,7 @@ export default {
         })
       }
     },
-    copyExpression(index) {
+    copyExpression (index) {
       this.selection.pen.data.expressAllArr.push(this.selection.pen.data.expressAllArr[index])
       this.selection.pen.data.legendsAll.push(this.selection.pen.data.legendsAll[index])
       this.$nextTick(() => {
@@ -1812,7 +1812,7 @@ export default {
         })
       })
     },
-    valueMappingAdd() {
+    valueMappingAdd () {
       if (this.selection.pen.data.valueMappingSort === 'desc') {
         this.selection.pen.data.valueMapping.push({
           color: {
@@ -1847,10 +1847,10 @@ export default {
         })
       }
     },
-    valueMappingValueChange(index, row) {
+    valueMappingValueChange (index, row) {
 
     },
-    changeValueMappingSort() {
+    changeValueMappingSort () {
       if (this.selection.pen.data.valueMappingSort === 'desc') {
         this.selection.pen.data.valueMappingSort = 'asc'
         const arr = JSON.parse(JSON.stringify(this.selection.pen.data.valueMapping))
@@ -1867,17 +1867,17 @@ export default {
         this.selection.pen.data.valueMapping = arr
       }
     },
-    valueMappingDel(index, row) {
+    valueMappingDel (index, row) {
       this.selection.pen.data.valueMapping.splice(index, 1)
       this.selection.pen.data.valueMapping.forEach((item, index) => {
         item.level = index
       })
     },
-    inputFocus(e) {
+    inputFocus (e) {
       e.path[2].children[0].setAttribute('tabindex', '0')
       e.path[2].children[1].setAttribute('tabindex', '1')
     },
-    inputBlur(e) {
+    inputBlur (e) {
     }
   }
 }

nezha-fronted/src/components/common/project/popData/alertTable.vue

@@ -123,7 +123,7 @@ export default {
           prop: 'summary',
           show: true,
           minWidth: 100
-        },{
+        }, {
           label: this.$t('alert.list.state'),
           prop: 'state',
           show: true,

nezha-fronted/src/components/common/project/popData/assetTable.vue

@@ -89,34 +89,34 @@ export default {
           label: 'ID',
           prop: 'id',
           show: true,
-          width: 110,
+          width: 110
         }, {
           label: this.$t('overall.name'),
           prop: 'name',
           show: true,
-          width: 110,
+          width: 110
         },
         {
           label: this.$t('asset.manageIp'),
           prop: 'manageIp',
           show: true,
-          width: 140,
+          width: 140
         },
         {
           label: this.$t('asset.pingInfo'),
           prop: 'pingInfo',
           show: true,
           width: 110
-        },{
+        }, {
           label: this.$t('asset.alertNum'),
           prop: 'alertNum',
           show: true,
-          width: 140,
+          width: 140
         }, {
           label: this.$t('asset.endpointNum2'),
           prop: 'endpointNum',
           show: true,
-          width: 160,
+          width: 160
         }],
       searchMsg: { // 给搜索框子组件传递的信息
         searchLabelList: [{
@@ -129,7 +129,7 @@ export default {
           type: 'input',
           label: 'name',
           disabled: false
-        },{
+        }, {
           name: this.$t('asset.manageIp'),
           type: 'input',
           label: 'manageIp',

nezha-fronted/src/components/common/project/popData/endpointTable.vue

@@ -79,7 +79,7 @@ export default {
   data () {
     return {
       url: 'monitor/endpoint',
-      tableId:'endpointTableProject',
+      tableId: 'endpointTableProject',
       pageObj: {
         pageNo: 1,
         pageSize: this.$CONSTANTS.defaultPageSize,
@@ -166,7 +166,7 @@ export default {
           //     //console.error(response.data.list[i], err);
           //   }
           // }
-          response.data.list.map( d => {
+          response.data.list.map(d => {
             d.port = JSON.parse(d.configs).port
             d.path = d.module.type
           })

nezha-fronted/src/components/common/rightBox/administration/assetTypeBox.vue

@@ -98,14 +98,14 @@
 </template>
 
 <script>
-import { asset as assetConstants} from '@/components/common/js/constants'
+import { asset as assetConstants } from '@/components/common/js/constants'
 import selectWalk from '../../popBox/selectWalk'
 import editRigthBox from '../../mixin/editRigthBox'
 
 export default {
   name: 'assetTypeBox',
   components: {
-    'select-walk': selectWalk,
+    'select-walk': selectWalk
   },
   props: {
     obj: {
@@ -125,13 +125,13 @@ export default {
       assetConstants,
       editAssetType: {},
       editModule: {},
-      assetTypeList:[
+      assetTypeList: [
         {
-          id:'',
+          id: '',
-          authProtocol:''
+          authProtocol: ''
         }
       ],
-      value:'',
+      value: '',
       url: 'asset/typeConf',
       // brandUrl: 'asset/brand',
       rightBox: { model: { show: false } },
@@ -207,7 +207,7 @@ export default {
         this.editModule.walk.push(walk)
       }
     },
-    assetType(){
+    assetType () {
       this.$get('asset/typeConf').then(res => {
         this.assetTypeList = res.data.list
       })

nezha-fronted/src/components/common/rightBox/alertSilenceBox.vue

@@ -103,7 +103,6 @@
         </el-form>
       </div>
 
-
     </div>
     <!-- end--表单-->
 
@@ -335,9 +334,9 @@ export default {
       this.editAlertSilence.matchers.splice(index, 1)
     },
     querySearch (queryString, cb) {
-      const labels = sameLabels.map(item=>{
+      const labels = sameLabels.map(item => {
         return {
-          name :item,
+          name: item,
           value: item
         }
       })

nezha-fronted/src/components/common/searchInput.vue

@@ -888,9 +888,9 @@ export default {
               objectInfo.type = val.val
             } else if (val.label === 'protocol') {
               objectInfo.protocol = val.val
-            }else if(val.label === 'operation'){
+            } else if (val.label === 'operation') {
               objectInfo.operation = val.val
-            }else if(val.label === 'state'){
+            } else if (val.label === 'state') {
               objectInfo.state = val.val
             }
           } else {

nezha-fronted/src/components/common/table/settings/assetTypeTable.vue

@@ -99,50 +99,49 @@ export default {
           prop: 'id',
           show: true,
           width: 80,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.assetType.name'),
           prop: 'name',
           show: true,
           width: 120,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.assetType.vm'),
           prop: 'vm',
-          show: true,
+          show: true
         }, {
           label: this.$t('config.assetType.vmh'),
           prop: 'vmh',
           show: true
-        },{
+        }, {
           label: this.$t('config.assetType.authProtocol'),
           prop: 'authProtocol',
-          show: true,
+          show: true
-        },{
+        }, {
           label: this.$t('config.assetType.snmpEnable'),
           prop: 'snmpEnable',
-          show: true,
+          show: true
-        },{
+        }, {
           label: this.$t('config.assetType.snmpCollect'),
           prop: 'snmpCollect',
-          show: true,
+          show: true
         },
         {
           label: this.$t('config.assetType.sshCollect'),
           prop: 'sshCollect',
-          show: true,
+          show: true
         },
         {
           label: this.$t('config.assetType.sshCollectScript'),
           prop: 'sshCollectScript',
-          show: true,
+          show: true
         }
       ]
     }
   },
   methods: {
 
-
   },
   computed: {
 

nezha-fronted/src/components/common/table/settings/cabinetTable.vue

@@ -54,10 +54,10 @@
 
 <script>
 import table from '@/components/common/mixin/table'
-import Template from "../../../page/config/template";
+import Template from '../../../page/config/template'
 export default {
   name: 'cabinet Table',
-  components: {Template},
+  components: { Template },
   mixins: [table],
   data () {
     return {

nezha-fronted/src/components/common/table/settings/chartTmplTable.vue

@@ -104,7 +104,7 @@ export default {
           label: this.$t('overall.remark'),
           prop: 'remark',
           show: true,
-          minWidth: 200,
+          minWidth: 200
         }
       ]
     }

nezha-fronted/src/components/common/table/settings/exprTmplTable.vue

@@ -72,17 +72,17 @@ export default {
           prop: 'id',
           show: true,
           width: 80,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.exprTemp.name'),
           prop: 'name',
           show: true,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.exprTemp.gname'),
           prop: 'gname',
           show: true,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.exprTemp.expression'),
           prop: 'expression',

nezha-fronted/src/components/common/table/settings/roleTable.vue

@@ -79,12 +79,12 @@ export default {
           prop: 'id',
           show: true,
           width: 80,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('config.roles.name'),
           prop: 'name',
           show: true,
-          sortable:'custom'
+          sortable: 'custom'
         }, {
           label: this.$t('overall.remark'),
           prop: 'remark',

nezha-fronted/src/components/layout/header.vue

@@ -183,7 +183,7 @@ export default {
     },
     shrink () {
       this.$store.commit('isShrink')
-    },
+    }
   },
   mounted () {
     this.$i18n.locale = this.language

nezha-fronted/src/components/page/alert/alertSilence.vue

@@ -210,7 +210,7 @@ export default {
           }
         })
       })
-    },
+    }
   }
 }
 </script>

nezha-fronted/src/components/page/config/agent.vue

@@ -269,7 +269,7 @@ export default {
           link.click()
           window.URL.revokeObjectURL(link.href)
         }
-      }).catch(()=>{
+      }).catch(() => {
         this.downloadAgentFlag = false
       })
     }

nezha-fronted/src/components/page/config/assetType.vue

@@ -63,11 +63,11 @@ export default {
         id: '',
         name: '',
         vm: '',
-        vmh:'',
+        vmh: '',
-        authProtocol:'',
+        authProtocol: '',
-        snmpEnable:'',
+        snmpEnable: '',
-        snmpCollect:'',
+        snmpCollect: '',
-        sshCollect:''
+        sshCollect: ''
       },
       tableId: 'typeConfTable',
       searchMsg: { // 给搜索框子组件传递的信息

nezha-fronted/src/components/page/config/menus.vue

@@ -128,9 +128,9 @@ export default {
   },
   methods: {
     edit (u) {
-      this.object ={...u}
+      this.object = { ...u }
       this.rightBox.show = true
-    },
+    }
   }
 }
 </script>

nezha-fronted/src/components/page/config/model.vue

@@ -68,7 +68,7 @@ import modelBox from '@/components/common/rightBox/administration/modelBox'
 import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import modelTable from '@/components/common/table/settings/modelTable'
-import topToolMoreOptions from "@/components/common/popBox/topToolMoreOptions";
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 
 export default {
   name: 'model',
@@ -77,7 +77,7 @@ export default {
     modelBox,
     deleteButton,
     modelTable,
-    topToolMoreOptions,
+    topToolMoreOptions
   },
   mixins: [dataListMixin],
   data () {
@@ -120,9 +120,9 @@ export default {
           this.$message.error(res.msg)
         }
       })
-    },
+    }
   },
-  created() {
+  created () {
 
   },
   computed: {

nezha-fronted/src/components/page/config/system.vue

@@ -785,7 +785,7 @@ export default {
         const reader = new FileReader()
         reader.readAsDataURL(file)// 转化二进制流，异步方法
         let base64Str = ''
-        reader.onload = function () { // 完成后this.result为二进制流console.log(this.result);
+        reader.onload = function () { // 完成后this.result为二进制流;
           base64Str = this.result
           resolve(base64Str)
         }

nezha-fronted/src/components/page/config/system/apiKeyTable.vue

@@ -181,7 +181,7 @@ export default {
     },
     save: function (obj) {
       const copy = JSON.parse(JSON.stringify(obj))
-      copy.expireAt = this.timezoneToUtcTimeStr(copy.expireAt);
+      copy.expireAt = this.timezoneToUtcTimeStr(copy.expireAt)
       if (copy.role) {
         copy.roleId = copy.role.id
       }

nezha-fronted/src/components/page/config/system/linkTable.vue

@@ -82,7 +82,7 @@
 
 <script>
 import { tableCommon } from './systemCommon'
-import bus from "../../../../libs/bus";
+import bus from '../../../../libs/bus'
 import table from '@/components/common/mixin/table'
 export default {
   name: 'linkTable',
@@ -111,7 +111,7 @@ export default {
       }
     }
   },
-  beforeUpdate() {
+  beforeUpdate () {
     bus.$emit('link-data-change')
   },
   methods: {

nezha-fronted/src/components/page/config/template/chartTemp.vue

@@ -98,7 +98,7 @@ import chartBox from '@/components/page/dashboard/chartBox'
 import deleteButton from '@/components/common/deleteButton'
 import dataListMixin from '@/components/common/mixin/dataList'
 import chartTmplTable from '@/components/common/table/settings/chartTmplTable'
-import topToolMoreOptions from "@/components/common/popBox/topToolMoreOptions";
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 
 export default {
   name: 'chartTemp',

nezha-fronted/src/components/page/config/template/index.vue

@@ -46,7 +46,7 @@ export default {
     }
   },
   mounted () {
-    this.$nextTick(()=>{
+    this.$nextTick(() => {
       this.showTab = 'exprTemp'
     })
   }

nezha-fronted/src/components/page/dashboard/chartBox.vue

@@ -523,7 +523,7 @@ export default {
       default: false
     }
   },
-  mixins: [rz,editRigthBox],
+  mixins: [rz, editRigthBox],
   data () {
     return {
       fromRoute,