perf: VueX缩减、优化; 表头编辑插件重构

nezha-fronted/src/components/common/alert/alertMessageTable.vue

@@ -8,17 +8,27 @@
         <i style="cursor: pointer" class="el-icon-delete"></i>
       </div>
     </transition>
+    <!-- 自定义table列 -->
+    <transition name="el-zoom-in-top">
+      <element-set
+        v-if="tools.showCustomTableTitle"
+        @close="tools.showCustomTableTitle = false"
+        :custom-table-title.sync="tools.customTableTitle"
+        :original-table-title="tableTitle"
+        ref="customTableTitle"
+      ></element-set>
+    </transition>
     <!--表格-->
     <el-table
       class="nz-table tabelH100"
       :data="tableData"
       border
-      v-show="mainResizeShow"
+      v-show="bottomBox.mainResizeShow"
       ref="alertListTable"
       tooltip-effect="light"
       :height="tableHeight"
       v-scrollBar:el-table="'large'"
-      v-loading="loading"
+      v-loading="tools.loading"
       :cell-class-name="labelsClassName"
       @selection-change="selectChange"
       style="width: 100%;height: 100%"
@@ -34,7 +44,7 @@
       </el-table-column>
       <el-table-column
         :resizable="false"
-        v-for="(item, index) in tablelable"
+        v-for="(item, index) in tools.customTableTitle"
         v-if="item.show"
         :width="item.width"
         :minWidth="item.minWidth"
@@ -48,9 +58,6 @@
       >
         <template slot-scope="scope" :column="item">
           <template v-if="item.prop == 'alertRule'">
-            <!--<div class="link too-long-split"
-               @click="viewRule(scope.row[item.prop].id)" :id="'view-rule-'+scope.row[item.prop].id"
-               v-if="scope.row[item.prop].alertName">{{scope.row[item.prop].alertName}}</div>-->
             <span class="too-long-split pointer" v-if="scope.row[item.prop].alertName" @mouseover="alertMessagehover(scope.row,scope.$index)">
                     <el-tooltip
                       :placement="scope.$index==0?'right-start':(scope.$index==tableData.length-1?'right-end':'right')"
@@ -61,11 +68,6 @@
                   </span>
             <template v-else>-</template>
           </template>
-          <!--<div v-else-if="item.prop == 'type'" class="content-right-options">
-            <span v-if="scope.row[item.prop] == 1">Project</span>
-            <span v-if="scope.row[item.prop] == 2">Module</span>
-            <span v-if="scope.row[item.prop] == 3">Device</span>
-          </div>-->
           <template v-else-if="item.prop == 'summary'">
             <template v-if="scope.row[item.prop]">{{scope.row[item.prop]}}</template>
             <template v-else>-</template>
@@ -79,15 +81,6 @@
                 <span style="padding-left: 18px;" v-if="scope.row[item.prop] == 'medium'">{{returnSeverityLabel(scope.row[item.prop])}}</span>
                 <span v-if="scope.row[item.prop] == 'low'"><i class="el-icon-arrow-down"></i>&nbsp;{{returnSeverityLabel(scope.row[item.prop])}}</span>
               </span>
-          <!--<div v-else-if="item.prop == 'linkObject'">
-            <span v-if="(scope.row['type'] == 1 || scope.row['type'] == 2) && scope.row[item.prop]" class="link too-long-split"
-                  @click="viewAlertType(scope.row['type'],scope.row[item.prop])" style="max-width: 125px;"
-                  :id="'link-obj-'+scope.row['type']+'-'+scope.row[item.prop].id">{{scope.row[item.prop].name}}</span>
-            <span v-else-if="scope.row['type'] == 3 && scope.row[item.prop]" class="link"
-                  @click="viewAlertType(scope.row['type'],scope.row[item.prop].id)"
-                  :id="'link-obj-'+scope.row['type']+'-'+scope.row[item.prop].id">{{scope.row[item.prop].host}}</span>
-            <span v-else>-</span>
-          </div>-->
           <template v-else-if="item.prop == 'labels'" class="labels">
             <el-tooltip
               v-for="item in labelsSort(scope.row.labels)"
@@ -114,12 +107,6 @@
                      </nz-alert-tag>
                    </span>
             </el-tooltip>
-            <!--<el-tag @click="showTagDetail(scope.row, key)"
-                    :key="key"
-                    :class="{'link': key == 'asset' || key == 'endpoint' || key == 'project' || key == 'module' || key == 'datacenter'}"
-                    v-if="key != 'alertname' && key != 'severity'"
-                    :type="tagType(key)"
-                    size="mini" v-for="(value, key) in scope.row.labels" class="alert-message-tag">{{tagValue(key, value)}}</el-tag>-->
           </template>
           <div v-else-if="item.prop == 'state'">
                 <span class="">
@@ -147,25 +134,25 @@
 
       <el-table-column width="28" :resizable="false">
         <template slot="header" slot-scope="scope">
-              <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
-                <i class="nz-icon nz-icon-gear"></i>
+            <i class="nz-icon nz-icon-gear"></i>
-              </span>
+          </span>
         </template>
         <template v-slot="scope">
-          <button v-if="scope.$index == 0" class="to-top" :style="{top: toTopBtnTop}" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn && mainResizeShow" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
+          <button v-if="scope.$index == 0" class="to-top" :style="{top: tools.toTopBtnTop}" :class="{'to-top-is-hover': tools.tableHover}" v-show="tools.showTopBtn && tools.mainResizeShow" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
         </template>
       </el-table-column>
     </el-table>
     <!--<弹窗>-->
     <!--删除弹窗-->
-    <element-set
+    <!--<element-set
     v-clickoutside="elementsetHide"
     :table-title="tableTitle"
     :dropCol="dropCol"
     @tablelable="tablelabelEmit"
     ref="elementset"
     :path="this.fromPath"
-  ></element-set>
+  ></element-set>-->
     <!--导出-->
     <div class="export-xlsx">
       <el-dialog :visible.sync="importBox.show" :title="importBox.title" :modal-append-to-body='false' :show-close="true" width="300px" @close="closeDialog" class="nz-dialog">
@@ -244,16 +231,25 @@
         /*二级列表相关*/
         tabList: [], //二级列表的标签
         tabDetailList: [], //多个详情
-        targetTab: '', //展示二级列表中的哪个页签
+        bottomBox: {
-        inTransform: false, //搜索框相关，搜索条件下拉框是否在transform里
+          tabList: [], //二级列表的标签
-        mainResizeShow: true, //dom高度改变时部分内容是否展示
+          tabDetailList: [], //多个详情
-        subResizeShow: true,
+          mainResizeShow: true, //dom高度改变时是否展示|隐藏
-        isFullScreen: false,
+          subResizeShow: true,
-        showSubList: false, //是否展示二级列表
+          isFullScreen: false, //全屏状态
-        mainTableHeight: this.$tableHeight.normal, //主列表table高度
+          showSubList: false, //是否显示二级列表
-
+          targetTab: '', //显示二级列表中的哪个页签
-        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          inTransform: false, //搜索框相关，搜索条件下拉框是否在transform里
-        tableHover: false, //控制滚动条和top按钮同时出现
+        },
+        /*工具参数*/
+        tools: {
+          loading: false, //是否显示table加载动画
+          toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          tableHover: false, //控制滚动条和top按钮同时出现
+          showTopBtn: false, //显示To top按钮
+          showCustomTableTitle: false, //自定义列弹框是否显示
+          customTableTitle: [], //自定义列工具的数据
+        },
 
         //导出相关
         importBox: {show: false, title:this.$t('overall.exportExcel')},
@@ -267,7 +263,6 @@
         searchTime: [new Date().setHours(new Date().getHours() - 1), new Date()],
         currentMsg: {},
         chartUnit: 5,
-        showTopBtn: false,
         pageObj: {
           pageNo: 1,
           pageSize: 50,
@@ -329,8 +324,6 @@
             width: 90
           }
         ],
-        tablelable: [],
-        dropCol: [],
         viewRuleData: {
           id: '',
           alertName: '',
@@ -390,36 +383,6 @@
         })
         return result;
       },
-      elementsetShow(s, e) {
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tablelable = data;
-      },
       chartUnitChange:function(unit){
         this.chartUnit=unit;
         this.$nextTick(()=>{
@@ -435,7 +398,7 @@
         }
       },
       queryChartDate() {
-        let $temp=this;
+        let $temp = this;
         let start = this.searchTime[0]?this.searchTime[0]:this.getTime(-1, 'h');
         let end = this.searchTime[1]?this.searchTime[1]:this.getTime(0, 'h');
         this.searchTime = [start, end];
@@ -618,7 +581,7 @@
       },
       deleteMessage() {
         this.$emit('deleteMessage',this.deleteBox);
-        console.log(this.deleteBox);
+        //console.log(this.deleteBox);
         this.deleteBox.show = false;
         this.deleteBox.ids=[];
       },
@@ -695,14 +658,17 @@
       },
       // 全屏
       fullScreen() {
+        let vm = this;
         this.$bottomBoxWindow.fullScreen(vm);
       },
       // 退出全屏
       exitFullScreen() {
+        let vm = this;
         this.$bottomBoxWindow.exitFullScreen(vm);
       },
       // 鼠标拖动二级列表
       listResize(e) {
+        let vm = this;
         this.$bottomBoxWindow.listResize(vm, e);
       },
       showTagDetail(data, key) {
@@ -719,10 +685,8 @@
               detailList.push(data[item]);
             }
           }
-          this.showSubList = true;
+          this.bottomBox.showSubList = true;
           this.tabList = labelList;
-          /*this.tabDetailList = detailList;
-          this.targetTab = key;*/
         }
       },
       labelsClassName(row) {
@@ -732,18 +696,7 @@
           return "";
         }
       },
-      jumpTo(data, id) {
+      viewRule(id) {
-        bus.$emit("menu-change", data);
-        this.$store.state.assetData.moduleData = data
-        this.$store.state.assetData.selectedData = id
-        this.$router.push({
-          path: "/" + data,
-          query: {
-            t: +new Date()
-          }
-        });
-      },
-      viewRule: function (id) {
         this.closeViews();
         this.$get('alert/rule', {"id": id}).then(response => {
           if (response.code == 200) {
@@ -817,16 +770,6 @@
       },
       // 数据排序
       tableDataSort(item){
-        // let orderBy='';
-        // if(item.order==='ascending'){
-        //   orderBy=item.prop;
-        // }
-        // if(item.order==='descending'){
-        //   orderBy='-'+item.prop;
-        // }
-        // this.pageObj.orderBy=orderBy;
-        // this.$set(this.searchLabel, "orderBy", orderBy);
-        // this.getAlertList();
         this.$emit('tableDataSort',item);
       },
       // label tooltip是否显示
@@ -866,6 +809,10 @@
       },
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -879,20 +826,20 @@
         if (el._ps_) {
           el.addEventListener("ps-scroll-y", () => {
             if (el._ps_.scrollbarYTop > 50) {
-              this.showTopBtn = true;
+              this.tools.showTopBtn = true;
             } else {
-              this.showTopBtn = false;
+              this.tools.showTopBtn = false;
             }
           });
           el.addEventListener("mouseenter", () => {
-            this.tableHover = true;
+            this.tools.tableHover = true;
           });
           el.addEventListener("mouseleave", () => {
-            this.tableHover = false;
+            this.tools.tableHover = false;
           });
         }
       });
-      if(this.from=='alertMessage'){
+      /*if(this.from=='alertMessage'){
         this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
           ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
           : this.tableTitle;
@@ -910,7 +857,7 @@
           : this.tableTitle;
         console.log(2);
       }
-      console.log( this.tableTitle,this.fromPath,this.form,this.tablelable);
+      console.log( this.tableTitle,this.fromPath,this.form,this.tablelable);*/
     }
   }
 

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

@@ -27,10 +27,20 @@
         </export-excel>
       </div>
     </div>
+    <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
     <el-table
       :data="tableData"
       border
-      v-loading="loading"
+      v-loading="tools.loading"
       class="nz-table endpoint-table"
       :height="$tableHeight.noPagination"
       v-scrollBar:el-table="'large'"
@@ -40,7 +50,7 @@
     >
       <el-table-column
         :resizable="false"
-        v-for="(item, index) in tablelable"
+        v-for="(item, index) in tools.customTableTitle"
         v-if="item.show"
         :width="item.width"
         :key="`col-${index}`"
@@ -76,24 +86,16 @@
       </el-table-column>
       <el-table-column width="28" :resizable="false">
         <template slot="header" slot-scope="scope">
-          <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
             <i class="nz-icon nz-icon-gear"></i>
           </span>
         </template>
         <template v-slot="scope">
-          <button v-if="scope.$index == 0" class="to-top" :style="{top: toTopBtnTop}" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn" @click="$toTop('ps', 1)"><i class="nz-icon nz-icon-top"></i></button>
+          <button v-if="scope.$index == 0" class="to-top" :style="{top: tools.toTopBtnTop}" :class="{'to-top-is-hover': tools.tableHover}" v-show="tools.showTopBtn" @click="$toTop('ps', 1)"><i class="nz-icon nz-icon-top"></i></button>
         </template>
       </el-table-column>
     </el-table>
 
-    <element-set
-      v-clickoutside="elementsetHide"
-      :table-title="tableTitle"
-      :dropCol="dropCol"
-      @tablelable="tablelabelEmit"
-      :path="'/assetEndpoint'"
-      ref="elementset"
-    ></element-set>
     <transition name="right-box">
       <add-endpoint-box v-if="rightBox.add.show" :current-project="currentProject" :current-module="currentModule" @close="closeRightBox" ref="addEndpointBox"></add-endpoint-box>
     </transition>
@@ -119,15 +121,19 @@
           add: {show: false},
           edit: {show: false},
         },
+        /*工具参数*/
+        tools: {
+          loading: false, //是否显示table加载动画
+          toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          tableHover: false, //控制滚动条和top按钮同时出现
+          showTopBtn: false, //显示To top按钮
+          showCustomTableTitle: false, //自定义列弹框是否显示
+          customTableTitle: [], //自定义列工具的数据
+        },
         endpoint: {}, //用来查看详情和编辑的对象
-        //asset: {}, //对应props的obj
-        showTopBtn: false, //top按钮是否显示
-        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
-        tableHover: false, //控制滚动条和top按钮同时出现
         endpointSearchLabel:{
 
         },
-        loading: false,
         tableTitle: [
           {
             label: this.$t("project.endpoint.endpointId"),
@@ -213,11 +219,11 @@
         this.$emit('changeTab', tab);
       },
       getTableData() {
-        this.loading = true;
+        this.tools.loading = true;
         this.$set(this.endpointSearchLabel, "assetId", this.asset.id);
         this.$set(this.endpointSearchLabel, "pageSize", '-1');
         this.$get('/endpoint',this.endpointSearchLabel).then(response => {
-          this.loading = false;
+          this.tools.loading = false;
           if (response.code === 200) {
             this.tableData = response.data.list;
             this.$emit("reload");
@@ -262,36 +268,6 @@
         }
         this.getTableData();
       },
-      elementsetShow(s, e) {
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', { positionx, positiony });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tablelable = data;
-      },
       dateFormat(time) {
         if (!time) {
           return '-';
@@ -386,11 +362,9 @@
       }
     },
     mounted() {
-      this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/assetEndpoint")
+      //初始化表头
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/assetEndpoint"))
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/project")
-        : this.tableTitle;
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/project"))
-      this.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/assetEndpoint")
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-/assetEndpoint"))
         : this.tableTitle;
 
       this.$nextTick(() => {
@@ -399,16 +373,16 @@
         if (el._ps_) {
           el.addEventListener("ps-scroll-y", () => {
             if (el._ps_.scrollbarYTop > 50) {
-              this.showTopBtn = true;
+              this.tools.showTopBtn = true;
             } else {
-              this.showTopBtn = false;
+              this.tools.showTopBtn = false;
             }
           });
           el.addEventListener("mouseenter", () => {
-            this.tableHover = true;
+            this.tools.tableHover = true;
           });
           el.addEventListener("mouseleave", () => {
-            this.tableHover = false;
+            this.tools.tableHover = false;
           });
         }
       });

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

@@ -1,28 +1,14 @@
 <template>
-  <div
+  <div class="pop-custom" v-clickoutside="esc">
-    class="pop-elementset"
-    :style="{opacity:(eventfixedVal.shezhi==1),left:(eventfixedVal.shezhi==1 ? event_positionx : -2000)+'px',top:(event_positiony)+'px'}"
-  >
-    <!--<div class="pop-top-btns">
-      <button type="button" @click="shezhiControl('ok')" class="nz-btn nz-btn-size-alien nz-btn-size-small nz-btn-style-light nz-btn-min-width-35" id="element-set-ok">
-        <span class="pop-top-btn-icon"><i class="nz-icon nz-icon-edit"></i></span>
-        <span class="pop-top-btn-txt">{{$t('overall.save')}}</span>
-      </button>
-      <button type="button" @click="shezhiControl('cancel')" class="nz-btn nz-btn-size-alien nz-btn-size-small nz-btn-style-light nz-btn-min-width-35" id="element-set-esc">
-        <span class="pop-top-btn-icon"><i class="el-icon-close"></i></span>
-        <span class="pop-top-btn-txt">{{$t('overall.esc')}}</span>
-      </button>
-    </div>-->
     <div class="pop-title">{{$t('overall.select')}}</div>
-    <div class="pop-box elementset-labels">
+    <div class="pop-box custom-labels">
       <el-scrollbar style="height: 100%;">
         <div
-          v-for="(item,index) in dropColRes"
+          v-for="(item,index) in custom"
           :key="index"
-          class="elementset-label"
+          class="custom-label"
-          :class="!allowedAll&&(index==0 || index == 1) ? 'elementset-label-disabled' : ''"
+          :class="!allowedAll && (index==0 || index == 1) ? 'custom-label-disabled' : ''"
-          :title="item.visibility == 'disabled' ? other.inDevelopment : ''"
+          @click="handler(item,index)"
-          @click="addcol(item,index)"
           :id="'element-set-el-'+index"
         >
           <i class="el-icon-check" v-if="!allowedAll&&(index==0||index==1||item.visibility=='disabled')"></i>
@@ -31,140 +17,100 @@
         </div>
       </el-scrollbar>
     </div>
-    <div class="elementset-bottom-btns">
+    <div class="custom-bottom-btns">
-      <button v-if="isCancel" type="button" @click="dropAll(false)" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35 is-cancel">
+      <button v-if="isCancel" type="button" @click="batchHandler(false)" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35 is-cancel">
         <span class="top-tool-btn-txt">{{$t('overall.clear')}}</span>
       </button>
-      <button v-if="!isCancel" type="button" @click="dropAll(true)" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35">
+      <button v-if="!isCancel" type="button" @click="batchHandler(true)" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35">
         <span class="top-tool-btn-txt">{{$t('overall.all')}}</span>
       </button>
       <div>
-        <button type="button" @click="shezhiControl('cancel')" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35">
+        <button type="button" @click="esc" class="nz-btn nz-btn-size-small nz-btn-style-light nz-btn-min-width-35">
           <span class="top-tool-btn-txt">{{$t('overall.esc')}}</span>
         </button>
-        <button type="button" @click="shezhiControl('ok')" class="nz-btn nz-btn-size-small nz-btn-style-normal nz-btn-min-width-35">
+        <button type="button" @click="save" class="nz-btn nz-btn-size-small nz-btn-style-normal nz-btn-min-width-35">
           <span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
         </button>
       </div>
-      <!--<button type="button" @click="dropAll(false)" class="nz-btn nz-btn-size-normal nz-btn-style-light">
-        <span class="top-tool-btn-txt">{{$t('overall.cancel')}}</span>
-      </button>-->
     </div>
   </div>
 </template>
 
 <script>
 export default {
-  // props: ["dropCol","tableTitle","path"],
   props:{
-    dropCol:{},
+    customTableTitle: Array, //自定义的title
-    tableTitle:{},
+    originalTableTitle: Array, //原始title
-    path:{},
+    path: String,
-    allowedAll:{default:false},
+    allowedAll: {default: false},
   },
   data() {
     return {
-      other: this.$t("overall.other"),
+      custom: [],
-      event_positiony: 0,
-      event_positionx: 0,
-      eventfixedVal: {},
-      dropColRes: JSON.parse(JSON.stringify(this.dropCol)),
-      titles: JSON.parse(JSON.stringify(this.tableTitle))
     };
   },
-  mounted() {},
   created() {
-    let localStorageTitle=JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path));
+    let localStorageTitle = JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path));
-    if(localStorageTitle){
+    if (localStorageTitle ){
-      for(let title of this.titles){
+      for (let title of this.originalTableTitle) {
-        for(let lsTitle of localStorageTitle){
+        for (let lsTitle of localStorageTitle) {
-          if(lsTitle.prop === title.prop){
+          if (lsTitle.prop === title.prop){
-            lsTitle.label=title.label;
+            lsTitle.label = title.label;
           }
         }
       }
-      localStorage.setItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path,JSON.stringify(localStorageTitle))
+      localStorage.setItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path, JSON.stringify(localStorageTitle))
     }
 
   },
   watch: {
-    dropCol: {
+    customTableTitle: {
       immediate: true,
       deep: true,
-      handler(data) {
+      handler(n) {
-        this.dropColRes = JSON.parse(JSON.stringify(data));
+        this.custom = JSON.parse(JSON.stringify(n));
       },
     },
-    position: {
-      //监听设置icon的显示位置
-      handler(data) {
-        this.event_positiony = data.positiony;
-        this.event_positionx = data.positionx;
-      },
-      immediate: true
-    },
-    eventfixed: {
-      handler(data) {
-        if (data)
-        this.eventfixedVal = data;
-      },
-      immediate: true
-    }
   },
   methods: {
     //悬浮点击空白隐藏
-    elementsetHide() {
+    esc() {
-      this.eventfixedVal.shezhi = 0;
       this.$emit('close');
     },
-    //点击全选all或者cancel按钮
+    //全选all true 或者全取消cancel false按钮
-    dropAll(state) {
+    batchHandler(state) {
-      for (let index = 0; index < this.dropColRes.length; index++) {
+      for (let index = 0; index < this.custom.length; index++) {
         if (index == 0 || index == 1) {
-          this.dropColRes[index].show = true;
+          this.custom[index].show = true;
         } else {
-          this.dropColRes[index].show = state;
+          this.custom[index].show = state;
         }
       }
     },
-    //下拉选项选择
+    //单选
-    addcol(val, index) {
+    handler(val, index) {
-      if (!this.allowedAll&&(index == 0 || index == 1)) {
+      if (!this.allowedAll && (index == 0 || index == 1)) {
-        this.dropColRes[index].show = true;
+        this.custom[index].show = true;
       } else {
-        this.dropColRes[index].show = !this.dropColRes[index].show;
+        this.custom[index].show = !this.custom[index].show;
       }
     },
     //点击第二个cancel
-    shezhiControl(t) {
+    save() {
-      if (t == "ok") {
+      this.$emit('update:customTableTitle', this.custom);
-        this.$emit("tablelable", JSON.parse(JSON.stringify(this.dropColRes)));
+      localStorage.setItem(
-        localStorage.setItem(
+        "nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + ((typeof this.path != 'undefined') ? this.path : this.$route.path),
-          "nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + ((typeof this.path != 'undefined') ? this.path : this.$route.path),
+        JSON.stringify(this.custom)
-          JSON.stringify(this.tablelable)
+      );
-        );
+      this.esc();
-      } else {
-        this.dropColRes = JSON.parse(JSON.stringify(this.tablelable));
-      }
-
-      this.elementsetHide();
     },
   },
   computed: {
-    eventfixed() {
-      return this.$store.state.eventfixed;
-    },
-    position() {
-      return this.$store.state.position;
-    },
-    tablelable() {
-      return this.$store.state.tablelable;
-    },
     //点击all是否是全部取消选中，true为是
     isCancel() {
       let isCancel = true;
-      for (let i = 0; i < this.dropColRes.length; i++) {
+      for (let i = 0; i < this.custom.length; i++) {
-        if (!this.dropColRes[i].show) {
+        if (!this.custom[i].show) {
           isCancel = false;
           break;
         }
@@ -175,45 +121,47 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
-.pop-elementset {
+.pop-custom {
   padding: 0 12px 12px 12px;
   border: 1px solid #EBEEF5;
   box-shadow: $pop-box-shadow;
-  position: fixed;
+  position: absolute;
-  top: 0;
+  top: 83px;
-  left: 10px;
+  right: 0;
   width: 200px;
   color: #606266;
   background: #fff;
   border-radius: 4px;
   z-index: 999999;
 }
-
+.relative-position .pop-custom {
-.elementset-labels {
+  top: 33px;
+}
+.custom-labels {
   margin-top: 12px;
   width: 100%;
   height: 300px;
 }
-.elementset-labels i {
+.custom-labels i {
   color: #04b330;
   font-size: 14px;
   position: absolute;
   left: 5px;
   top: 6px;
 }
-.elementset-label {
+.custom-label {
   padding: 2px 0 2px 25px;
   position: relative;
   cursor: default;
   font-size: 14px;
 }
-.elementset-label-disabled {
+.custom-label-disabled {
   cursor: not-allowed;
   background: #f1f3f4;
   opacity: 0.7;
 }
-.elementset-bottom-btns {
+.custom-bottom-btns {
   margin-top: 7px;
   display: flex;
   justify-content: space-between;

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

@@ -58,7 +58,7 @@
       <el-submenu index="3" popper-class="nz-submenu">
         <template slot="title">
           <div v-if="assetData.length == 0">{{$t('overall.asset')}}</div>
-          <div v-else @click="jumpToAsset(assetData[0])" :class="{'menu-active' : activeIndex == 'asset'}">{{$t('overall.asset')}}</div>
+          <div v-else @click="jumpToAsset()" :class="{'menu-active' : activeIndex == 'asset'}">{{$t('overall.asset')}}</div>
         </template>
         <template>
           <el-menu-item v-if="assetData.length == 0" index="3-0"><div @click="createBox({type: 6})"><i class="nz-icon nz-icon-create-square header-dropdown-add"></i>&nbsp;&nbsp;{{$t("overall.createDatacenter")}}</div></el-menu-item>
@@ -366,15 +366,16 @@
         }
       },
       jumpToAsset(dc) {
-        this.activeItemIndex = dc.id;
+        if (dc) {
-        bus.$emit("header-dc-change", dc.id); //发送给leftMenu，顶部dc条件改变了
+          this.activeItemIndex = dc.id;
+          bus.$emit("header-dc-change", dc.id); //发送给leftMenu，顶部dc条件改变了
+        }
         this.jumpTo("asset", "assets");
       },
       jumpToProject(p) {
         this.currentProject = p;
         this.$store.commit('currentProjectChange', p);
         bus.$emit("project-page-type", 'project');
-        localStorage.setItem('nz-current-project', p.id);
 
         this.activeItemIndex = p.id;
         this.jumpTo('project', 'projects');
@@ -499,7 +500,7 @@
           this.refreshLang();
           this.activeIndex = 'overview';
         });
-        bus.$on("dc-list-change", () => {
+        bus.$on("dc-list-change", () => { //dc.vue增删改dc时刷新顶部菜单dc列表
           this.getAssetData();
         });
         bus.$on("current-project-change", project => {
@@ -514,6 +515,7 @@
     },
     mounted() {
       this.$i18n.locale = this.language;
+      this.initEvent();
       this.getAssetData();
       this.getUserData();
       this.getProjectList();

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

@@ -236,19 +236,16 @@
             }
           },
         },
-        dcCheckList(n, o) {
-          this.$store.commit("currentDcListChange", n);
-        /*  setTimeout(() => {
-            if (n.length > 0 ) {
-              bus.$emit("asset-filter-change", "idcIds", n.join(','));
-            } else {
-              bus.$emit("asset-filter-change", "idcIds", "");
-            }
-          }, 100);*/
-        },
         currentProject(n, o) {
           bus.$emit("current-project-change", n); //告知project.vue
         },
+        dcCheckList: {
+          deep: true,
+          immediate: true,
+          handler(n) {
+            bus.$emit("asset-filter-change", "idcIds", n.join(","));
+          }
+        }
       },
       mounted() {
         Promise.all([this.getProjectList(), this.getModuleList(), this.getLeftMenuList()]).then(response => {
@@ -324,11 +321,14 @@
           bus.$emit("project-page-type", "endpoint");  //告知project.vue
         },
         addModule() {
-          /*this.module = this.newModule();
+          this.module = this.newModule();
           this.rightBox.module.show = true;
           this.$nextTick(() => {
             this.$refs.moduleBox.initWalk();
-          });*/
+          });
+        },
+        newModule() {
+          return JSON.parse(JSON.stringify(this.blankModule));
         },
         //弹出module编辑页
         editModule(module) {
@@ -433,7 +433,6 @@
             bus.$emit("asset-filter-change", "typeIds", "");
             this.pageObj.typeIds='';
           }
-          this.getTableData();
         },
         changeVendorCheckBox() {
           if(this.vendorCheckList && this.vendorCheckList.length > 0){
@@ -442,7 +441,6 @@
           }else{
             bus.$emit("asset-filter-change", "vendorIds", "");
           }
-          this.getTableData();
         },
         changePingCheckBox() {
           if(this.pingCheckList && this.pingCheckList.length > 0){

nezha-fronted/src/components/common/popBox/dcConfig.vue

@@ -1,236 +0,0 @@
-<template>
-  <el-popover :placement="placement"  @show="afterShow"  width="400" @hide="hidePop"  ref="popBox" v-model="popBox.show" popper-class="nz-pop">
-    <div class="">
-      <!-- begin--顶部按钮-->
-      <div class="pop-top-btns">
-        <button type="button" v-if="idc.id && idc.id != ''&& popBox.isEdit" @click="del" class="nz-btn nz-btn-size-small nz-btn-size-alien nz-btn-style-light nz-btn-min-width-60" id="dc-del">
-          <span class="pop-top-btn-icon"><i class="el-icon-delete"></i></span>
-          <span class="pop-top-btn-txt">{{$t('overall.delete')}}</span>
-        </button>
-        <button type="button" @click="saveOrToEdit" class="nz-btn nz-btn-size-alien nz-btn-size-small nz-btn-style-light nz-btn-min-width-60" id="dc-save">
-          <span class="pop-top-btn-icon"><i class="nz-icon nz-icon-edit"></i></span>
-          <span class="pop-top-btn-txt" v-if="popBox.isEdit">{{$t('overall.save')}}</span>
-          <span class="pop-top-btn-txt" v-else>{{$t('overall.edit')}}</span>
-        </button>
-
-        <button type="button" @click="esc" class="nz-btn nz-btn-size-alien nz-btn-size-small nz-btn-style-light nz-btn-min-width-35" id="dc-esc">
-          <span class="pop-top-btn-icon"><i class="el-icon-close"></i></span>
-          <span class="pop-top-btn-txt">{{$t('overall.esc')}}</span>
-        </button>
-      </div>
-      <!-- end--顶部按钮-->
-      <div class="pop-title">{{title}}</div>
-
-      <div class="pop-item-wider">
-        <el-form class="right-box-form" :model="idc" label-position="left" label-width="150px"  :rules="rules" ref="idcForm">
-          <el-form-item :label="$t('asset.dcName')" prop="name">
-            <el-input type="text"  placeholder="" v-model="idc.name" size="mini" maxlength="64" v-if="popBox.isEdit"></el-input>
-            <div class="right-box-form-content-txt" v-if="!popBox.isEdit">{{idc.name}}</div>
-          </el-form-item>
-          <el-form-item :label="$t('asset.location')" prop="location">
-            <el-input type="text"  placeholder="" v-model="idc.location" size="mini" v-if="popBox.isEdit"></el-input>
-            <div class="right-box-form-content-txt" v-if="!popBox.isEdit">{{idc.location}}</div>
-          </el-form-item>
-          <el-form-item :label="$t('asset.principal')" prop="principal">
-            <el-select v-model="idc.principal" clearable size="mini" placeholder="" v-if="popBox.isEdit" popper-class="dc-dropdown">
-              <el-option v-for="item in principals" :key="item.id" :label="item.username" :value="item.userId"></el-option>
-            </el-select>
-            <div class="right-box-form-content-txt" v-if="!popBox.isEdit">{{idc.principal}}</div>
-          </el-form-item>
-          <el-form-item :label="$t('asset.tel')" prop="tel" >
-            <el-input type="text"  placeholder="" v-model="idc.tel" size="mini" v-if="popBox.isEdit"></el-input>
-            <div class="right-box-form-content-txt" v-if="!popBox.isEdit">{{idc.tel}}</div>
-          </el-form-item>
-        </el-form>
-      </div>
-    </div>
-    <span :class="buttonClass" @click.prevent.stop="" slot="reference" :id="'edit-idc-'+Math.random().toString(36).slice(-8)">
-      <slot name="optionZone">
-        <i class="el-icon-plus" id="dc-plus"></i>
-      </slot>
-    </span>
-  </el-popover>
-</template>
-
-<script>
-    import {phone} from '../../common/js/validate'
-    export default {
-      name: "dcConfig",
-      props:{
-        postIdc:{type:Object},
-        placement:{type:String},
-        buttonClass:{type:String},
-        isEdit:{type:Boolean,default:true},
-        userData:{type:Array}
-      },
-      created() {
-        this.init();
-      },
-      data(){
-        return {
-          title:"",
-          rules:{
-            name:[
-              {required:true,message:this.$t('validate.required'),trigger:'blur'}
-            ],
-            location:[
-            ],
-            principal:[
-            ],
-            tel:[
-              { validator: phone, trigger: 'blur'}
-            ]
-          },
-          idc:{},
-          principals:[],
-          popBox:{isEdit:true,show:false}
-        }
-      },
-      methods:{
-        init:function(){
-          let temp=this;
-          temp.getUserData();
-        },
-        resetData:function(){
-          let temp=this;
-          temp.idc={
-            name:"",
-            location: "",
-            principal: null,
-            tel:""
-          }
-        },
-        openBox:function(){
-          this.popBox.show=true;
-        },
-        afterShow:function(){
-          if(!this.popBox.isEdit){
-            this.popBox.isEdit=this.isEdit;
-          }
-        },
-        getUserData() {
-          let temp=this;
-          if(temp.userData&&temp.userData.length>0){
-            temp.principals=temp.userData;
-            return;
-          }
-          temp.$get('sys/user/list').then(response => {
-            if (response.code === 200) {
-              temp.principals = response.data.list
-            }
-          })
-        },
-        saveOrToEdit:function(){
-          if (!this.popBox.isEdit) {
-            this.toEdit(this.idc);
-          } else {
-            this.save();
-          }
-        },
-        save:function(){
-          let temp=this;
-          temp.$refs.idcForm.validate((valide)=>{
-            if(valide){
-              const h = temp.$createElement;
-              if(!temp.idc.id){
-                temp.$post('idc', temp.idc).then(response => {
-                  if (response.code === 200) {
-                    temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.saveSuccess")});
-                    temp.$emit("after");
-                    temp.$store.commit('assetDcListChange');
-                    temp.esc();
-                  } else {
-                    this.$message.error(response.msg);
-                  }
-                })
-              }else{
-                this.$put('idc', temp.idc).then(response => {
-                  if (response.code === 200) {
-                    temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.saveSuccess")});
-                    temp.$emit("after");
-                    temp.$store.commit('assetDcListChange');
-                    temp.esc();
-                  } else {
-                    this.$message.error(response.msg);
-                  }
-                })
-              }
-
-            }else{
-              return false;
-            }
-          });
-        },
-        toEdit:function(u){
-          this.idc = Object.assign({}, u);
-          this.popBox.isEdit = true;
-          this.title = this.$t('asset.editIdcTab.title') + "  ID：" + this.idc.id
-          this.popBox.show = true;
-        },
-        show:function(isShow,isEdit){
-          this.popBox.show=isShow;
-          this.popBox.isEdit=isEdit;
-        },
-        esc:function(){
-          this.popBox.show=false;
-        },
-        del:function(){
-          let temp=this;
-          temp.$confirm(temp.$t("tip.confirmDelete"), {
-            confirmButtonText: temp.$t("tip.yes"),
-            cancelButtonText: temp.$t("tip.no"),
-            type: 'warning'
-          }).then(() => {
-            temp.$delete("idc?ids=" + temp.idc.id).then(response => {
-              if (response.code === 200) {
-                temp.$message({duration: 1000, type: 'success', message: temp.$t("tip.deleteSuccess")});
-                temp.$emit("after");
-                temp.$store.commit('assetDcListChange');
-                temp.esc();
-              } else {
-                this.$message.error(response.msg);
-              }
-            });
-          });
-
-        },
-        hidePop:function(){//隐藏事件触发方法
-          if(this.postIdc&&this.postIdc.id){
-            this.idc=this.postIdc
-          }else{
-            this.resetData();
-          }
-          this.clearValidate();
-        },
-        clearValidate:function(){
-          this.$refs.idcForm.clearValidate();
-        }
-      },
-      watch:{
-        postIdc: {
-          immediate: true,
-          deep: true,
-          handler(n, o) {
-            if (n && n.id) {
-              this.title = this.popBox.isEdit?this.$t('asset.editIdcTab.title') + "  ID：" + n.id:this.$t('asset.dc') + "  ID：" + n.id;
-              this.idc=n;
-
-            } else {
-              this.title = this.$t('asset.AddIdcTab.title');
-              this.resetData();
-            }
-          }
-        },
-        isEdit:{
-          immediate: true,
-          handler(n, o) {
-            this.popBox.isEdit=n;
-          }
-        }
-      }
-    }
-</script>
-
-<style scoped>
-
-</style>

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

@@ -512,7 +512,6 @@
               this.$put('module', this.editModule).then(response => {
                 if (response.code === 200) {
                   this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
-                  //this.$store.commit('moduleListChange');
                   this.esc(true);
                 } else {
                   this.$message.error(response.msg);
@@ -522,7 +521,6 @@
               this.$post('module', this.editModule).then(response => {
                 if (response.code === 200) {
                   this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")});
-                  //this.$store.commit('moduleListChange');
                   this.esc(true);
                 } else {
                   this.$message.error(response.msg);
@@ -544,7 +542,6 @@
           this.$delete("module?ids=" + this.editModule.id).then(response => {
             if (response.code === 200) {
               this.$message({duration: 1000, type: 'success', message: this.$t("tip.deleteSuccess")});
-              //this.$store.commit('moduleListChange');
               this.esc(true);
             } else {
               this.$message.error(response.msg);

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

@@ -222,11 +222,6 @@
                 downBool:false
             }
         },
-        computed: {
-            alertListAssetId() {
-              return this.$store.state.assetForAlertList;
-            }
-        },
         watch: {
           defaultValue: {
             immediate: true,
@@ -348,100 +343,6 @@
                   }
               }
           },
-          /*alertListAssetId: {
-            immediate: true,
-            handler(newData, oldData) {
-              if (newData && this.$route.path == '/alertList') {
-                setTimeout(()=>{
-                  //
-                  //1.条件名alertType
-                  //
-                  this.searchLabelList.splice(2, 1);
-                  this.select_list.push({
-                    name: this.$t('alert.list.type'),
-                    id: 3,
-                    type: 'select',
-                    label: 'alertType',
-                    disabled: false
-                  });
-                  //
-                  //2.条件值asset
-                  //
-                  this.select_list.forEach(val => {
-                    if (val.label == 'alertType') {
-                      val.val = this.$t('alert.config.typeOption.asset');
-                      val.valnum = 3;
-                      //alertList页type选择asset时，可以搜索asset
-                      if (this.$route.path == '/alertList' && val.label == 'alertType' && val.valnum == 3) {
-                        for (let i = 0; i < this.searchLabelList.length; i++) {
-                          if (this.searchLabelList[i].label == 'asset') {
-                            this.searchLabelList[i].disabled = false;
-                            break;
-                          }
-                        }
-                      } else if (this.$route.path == '/alertList' && val.label == 'alertType' && val.valnum != 3) {
-                        let ind = -1;
-                        for (let i = 0; i < this.searchLabelList.length; i++) {
-                          if (this.searchLabelList[i].label == 'asset') {
-                            this.searchLabelList[i].disabled = true;
-                            break;
-                          }
-                        }
-                        for (let i = 0; i < this.select_list.length; i++) {
-                          if (this.select_list[i].label == 'asset') {
-                            ind = i;
-                            break;
-                          }
-                        }
-                        if (ind >= 0) {
-                          this.close_selcet_list(ind);
-                        }
-                      }
-                    }
-                  });
-                  //
-                  //3.条件名asset
-                  //
-                  //this.input_list = false;
-                  this.searchLabelList.splice(3, 1);
-                  this.select_list.push({
-                    name: this.$t('asset.asset'),
-                    id: 11,
-                    type: 'asset',
-                    label: 'asset',
-                    disabled: false
-                  });
-
-                  //
-                  //4.条件值：指定的asset
-                  setTimeout(()=>{
-                    let assetHost = '';
-                    for (let i = 0; i < this.assetSelect.length; i++) {
-                      if (this.assetSelect[i].id == newData) {
-                        assetHost = this.assetSelect[i].host;
-                      }
-                    }
-                    this.select_list.forEach(val => {
-                      if (val.label == 'asset') {
-                        val.val = assetHost;
-                        val.valnum = newData;
-                      }
-                    });
-                    this.input_sreach = '';
-                    this.sreach_num = this.select_list.length;
-                    this.change_sreach_show = false;
-                    this.input_list = true;
-                    //
-                    //5.点击搜索
-                    //
-                    this.select();
-                  }, 50);
-
-                }, 100);
-                this.$store.commit('assetForAlertListChange', '');
-              }
-            }
-          }*/
         },
         props:['searchMsg','defaultItem','defaultValue','inTransform'],
         methods: {

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

@@ -19,6 +19,16 @@
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table
         class="nz-table"
         :data="tableData"
@@ -35,7 +45,7 @@
       >
         <el-table-column
           :resizable="false"
-          v-for="(item, index) in tools.tablelable"
+          v-for="(item, index) in tools.customTableTitle"
           v-if="item.show"
           :width="item.width"
           :key="`col-${index}`"
@@ -72,7 +82,7 @@
         </el-table-column>
         <el-table-column width="28" :resizable="false">
           <template slot="header" slot-scope="scope">
-          <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
             <i class="nz-icon nz-icon-gear"></i>
           </span>
           </template>
@@ -92,15 +102,6 @@
     <transition name="right-box">
       <alert-config-box v-if="rightBox.show" :alert-rule="alertRule" @close="closeRightBox" ref="alertConfigBox"></alert-config-box>
     </transition>
-    <element-set
-      v-if="tools.showElementSet"
-      @close="elementsetHide"
-      v-clickoutside="elementsetHide"
-      :table-title="tableTitle"
-      :tools.dropCol="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
   </div>
 
 </template>
@@ -132,10 +133,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         mainTableHeight: this.$tableHeight.normal, //主列表table高度
 
@@ -256,40 +256,6 @@
         this.bottomBox.showSubList = true;
         this.bottomBox.targetTab = 'alertMessage';
       },
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        this.$nextTick(() => {
-          var eventfixed = {
-            shezhi: 0,
-            screen: 0
-          };
-          eventfixed[s] = 1;
-          e.preventDefault();
-          this.$store.commit('setHeaderTable', this.tools.tablelable);
-          this.$store.commit('setEventfixed', eventfixed);
-          const h = document.documentElement.clientHeight;
-          const w = document.documentElement.clientWidth;
-          const dw = this.$refs.elementset.$el.offsetWidth;
-          const dh = this.$refs.elementset.$el.offsetHeight;
-          let positionx =
-            e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-          let positiony =
-            e.clientY + dh <= h - 10
-              ? e.clientY + 20
-              : e.clientY + 20 - (e.clientY + dh - h);
-          this.$store.commit('setPosition', {positionx, positiony});
-        });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.tools.showElementSet = false;
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-        this.tools.dropCol = data;
-      },
       edit(u) {
         this.alertRule = JSON.parse(JSON.stringify(u));
         this.rightBox.show = true;
@@ -542,6 +508,10 @@
       window.onresize = null;
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -569,12 +539,6 @@
           });
         }
       });
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -18,11 +18,11 @@
 </style>
 <template>
   <div class="list">
-    <div class="main-list main-and-sub-transition" :class="{'main-list-with-sub': showSubList}">
+    <div class="main-list main-and-sub-transition" :class="{'main-list-with-sub': bottomBox.showSubList}">
-      <div class="top-tools" v-show="mainResizeShow">
+      <div class="top-tools" v-show="bottomBox.mainResizeShow">
-        <div class="top-tool-main-right" :class="{'top-tool-main-right-to-left': showSubList}">
+        <div class="top-tool-main-right" :class="{'top-tool-main-right-to-left': bottomBox.showSubList}">
           <div class="top-tool-search">
-            <search-input :searchMsg="searchMsg" @search="search" :inTransform="inTransform"></search-input>
+            <search-input :searchMsg="searchMsg" @search="search" :bottomBox.inTransform="bottomBox.inTransform"></search-input>
           </div>
           <button type="button" @click="showExportDialog" :title="$t('overall.exportExcelLower')"
                   class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="alert-list-export">
@@ -33,19 +33,19 @@
       </div>
       <alertMessageTable
         :tableData="tableData"
-        :loading="loading"
+        :loading="tools.loading"
         :tableHeight="mainTableHeight"
         :tableId="tableId"
         @tableDataSort="tableDataSort"
         @deleteMessage="deleteMessage"
         :from="'alertMessage'"
       ></alertMessageTable>
-      <div class="pagination-bottom" v-show="!showSubList">
+      <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
     </div>
-    <bottom-box v-if="showSubList" :show-sub-list="showSubList" :subResizeShow="subResizeShow" :isFullScreen="isFullScreen" :from="'alertMessage'" :targetTab.sync="targetTab" :detailList="tabDetailList"
+    <bottom-box v-if="bottomBox.showSubList" :show-sub-list="bottomBox.showSubList" :sub-resize-show="bottomBox.subResizeShow" :is-full-screen="bottomBox.isFullScreen" :from="'alertMessage'" :target-tab.sync="bottomBox.targetTab" :detailList="tabDetailList"
-                @closeSubList="showSubList = false" @fullScreen="fullScreen" @exitFullScreen="exitFullScreen" @listResize="listResize" :tabList="tabList"></bottom-box>
+                @closeSubList="bottomBox.showSubList = false" @fullScreen="fullScreen" @exitFullScreen="exitFullScreen" @listResize="listResize" :tabList="tabList"></bottom-box>
     <!--导出-->
     <div class="export-xlsx">
       <el-dialog :visible.sync="importBox.show" :title="importBox.title" :modal-append-to-body='false' :show-close="true" width="300px" @close="closeDialog" class="nz-dialog">
@@ -100,7 +100,7 @@
   import chartDataFormat from "../../charts/chartDataFormat";
   import alertRuleInfo from '../../common/alert/alertRuleInfo'
   import alertLabel from '../../common/alert/alertLabel'
-  import alertMessageTable from '@/components/common/alert/alertMessageTable.vue'
+  import alertMessageTable from '../../common/alert/alertMessageTable.vue'
   export default {
     name: "alertList",
     components: {
@@ -112,20 +112,28 @@
     },
     data() {
       return {
-        loading: false,
         /*二级列表相关*/
-        tabList: [], //二级列表的标签
-        tabDetailList: [], //多个详情
-        targetTab: '', //展示二级列表中的哪个页签
-        inTransform: false, //搜索框相关，搜索条件下拉框是否在transform里
-        mainResizeShow: true, //dom高度改变时部分内容是否展示
-        subResizeShow: true,
-        isFullScreen: false,
-        showSubList: false, //是否展示二级列表
         mainTableHeight: this.$tableHeight.normal, //主列表table高度
-
+        /*二级页面相关*/
-        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+        bottomBox: {
-        tableHover: false, //控制滚动条和top按钮同时出现
+          tabList: [], //二级列表的标签
+          tabDetailList: [], //多个详情
+          mainResizeShow: true, //dom高度改变时是否展示|隐藏
+          subResizeShow: true,
+          isFullScreen: false, //全屏状态
+          showSubList: false, //是否显示二级列表
+          targetTab: '', //显示二级列表中的哪个页签
+          inTransform: false, //搜索框相关，搜索条件下拉框是否在transform里
+        },
+        /*工具参数*/
+        tools: {
+          loading: false, //是否显示table加载动画
+          toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          tableHover: false, //控制滚动条和top按钮同时出现
+          showTopBtn: false, //显示To top按钮
+          showCustomTableTitle: false, //自定义列弹框是否显示
+          customTableTitle: [], //自定义列工具的数据
+        },
 
         //导出相关
         importBox: {show: false, title:this.$t('overall.exportExcel')},
@@ -141,7 +149,6 @@
         chartUnit: 5,
 
         tableId: 'alertListTable', //需要分页的table的id，用于记录每页数量
-        showTopBtn: false,
         pageObj: {
           pageNo: 1,
           pageSize: 50,
@@ -258,8 +265,6 @@
         searchLabel: { //搜索参数
 
         },
-        tablelable: [],
-        dropCol: [],
         tableData: [],
         requestIndex:0,
         viewRuleData: {
@@ -321,11 +326,6 @@
         })
         return result;
       },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tablelable = data;
-      },
       chartUnitChange:function(unit){
         this.chartUnit=unit;
         this.$nextTick(()=>{
@@ -481,9 +481,9 @@
       getAlertList: function () {
         this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
         this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
-        this.loading = true;
+        this.tools.loading = true;
         this.$get('alert/message', this.searchLabel).then(response => {
-          this.loading = false;
+          this.tools.loading = false;
           if (response.code == 200) {
             this.tableData = response.data.list;
             this.tableData.forEach((item) => {
@@ -638,14 +638,17 @@
       },
       // 全屏
       fullScreen() {
+        let vm = this;
         this.$bottomBoxWindow.fullScreen(vm);
       },
       // 退出全屏
       exitFullScreen() {
+        let vm = this;
         this.$bottomBoxWindow.exitFullScreen(vm);
       },
       // 鼠标拖动二级列表
       listResize(e) {
+        let vm = this;
         this.$bottomBoxWindow.listResize(vm, e);
       },
       showTagDetail(data, key) {
@@ -662,10 +665,10 @@
               detailList.push(data[item]);
             }
           }
-          this.showSubList = true;
+          this.bottomBox.showSubList = true;
           this.tabList = labelList;
           /*this.tabDetailList = detailList;
-          this.targetTab = key;*/
+          this.bottomBox.targetTab = key;*/
         }
       },
       labelsClassName(row) {
@@ -675,17 +678,6 @@
           return "";
         }
       },
-      jumpTo(data, id) {
-        bus.$emit("menu-change", data);
-        this.$store.state.assetData.moduleData = data
-        this.$store.state.assetData.selectedData = id
-        this.$router.push({
-          path: "/" + data,
-          query: {
-            t: +new Date()
-          }
-        });
-      },
       pageNo(val) {
         this.pageObj.pageNo = val;
         this.getAlertList();
@@ -695,7 +687,7 @@
         localStorage.setItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId, val);
         this.getAlertList();
       },
-      search: function (searchObj) {
+      search(searchObj) {
         let orderBy='';
         if(this.searchLabel.orderBy){
           orderBy=this.searchLabel.orderBy
@@ -831,6 +823,10 @@
       },
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -844,25 +840,19 @@
         if (el._ps_) {
           el.addEventListener("ps-scroll-y", () => {
             if (el._ps_.scrollbarYTop > 50) {
-              this.showTopBtn = true;
+              this.tools.showTopBtn = true;
             } else {
-              this.showTopBtn = false;
+              this.tools.showTopBtn = false;
             }
           });
           el.addEventListener("mouseenter", () => {
-            this.tableHover = true;
+            this.tools.tableHover = true;
           });
           el.addEventListener("mouseleave", () => {
-            this.tableHover = false;
+            this.tools.tableHover = false;
           });
         }
       });
-      this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -20,7 +20,16 @@
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
-
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table
         class="nz-table"
         :height="mainTableHeight"
@@ -37,7 +46,7 @@
       >
         <el-table-column
           :resizable="false"
-          v-for="(item, index) in tools.tablelable"
+          v-for="(item, index) in tools.customTableTitle"
           v-if="item.show"
           :width="item.width"
           :key="`col_${index}`"
@@ -136,7 +145,7 @@
         </el-table-column>
         <el-table-column width="28" fixed="right" :resizable="false">
           <template slot="header" slot-scope="scope">
-          <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
             <i class="nz-icon nz-icon-gear"></i>
           </span>
           </template>
@@ -160,16 +169,6 @@
     <transition name="right-box">
       <asset-box v-if="rightBox.show" :asset="asset" @refresh="flushData" ref="assetBox" @close="closeRightBox"></asset-box>
     </transition>
-    <element-set
-      v-if="tools.showElementSet"
-      @close="elementsetHide"
-      v-clickoutside="elementsetHide"
-      :drop-col="tools.dropCol"
-      :table-title="tableTitle"
-      @tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
-
   </div>
 </template>
 
@@ -208,10 +207,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         asset: {},
         blankAsset: {
@@ -362,14 +360,6 @@
       }
     },
     watch: {
-      currentDcListChange: {
-        deep: true,
-        immediate: true,
-        handler(n) {
-          this.pageObj.idcIds = n.join(",");
-          this.getTableData();
-        }
-      },
       'bottomBox.showSubList': function(n) {
         let vm = this;
         this.$bottomBoxWindow.showSubListWatch(vm, n);
@@ -399,51 +389,6 @@
         let vm = this;
         this.$bottomBoxWindow.listResize(vm, e);
       },
-      dcSelectAll(val) { //DC全选
-        if (this.checkListData.length > 0) {
-          this.checkList = [];
-          if (val) {
-            for (let i = 0; i < this.checkListData.length; i++) {
-              this.checkList.push(this.checkListData[i].id);
-              this.$store.commit('assetItemIdChange',this.checkListData[i].id)
-            }
-            this.$store.commit('assetAllIdChange',this.checkListData)
-          }
-        }
-      },
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        this.$nextTick(() => {
-          var eventfixed = {
-            shezhi: 0,
-            screen: 0
-          };
-          eventfixed[s] = 1;
-          e.preventDefault();
-          this.$store.commit('setHeaderTable', this.tools.tablelable);
-          this.$store.commit('setEventfixed', eventfixed);
-          const h = document.documentElement.clientHeight;
-          const w = document.documentElement.clientWidth;
-          const dw = this.$refs.elementset.$el.offsetWidth;
-          const dh = this.$refs.elementset.$el.offsetHeight;
-          let positionx =
-            e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-          let positiony =
-            e.clientY + dh <= h - 10
-              ? e.clientY + 20
-              : e.clientY + 20 - (e.clientY + dh - h);
-          this.$store.commit('setPosition', { positionx, positiony });
-        });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.tools.showElementSet = false;
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       cli([id,host,account]){
         const consoleParam = {
           id: id,
@@ -718,13 +663,22 @@
         });
       }
     },
-    computed: {
-      currentDcListChange() {
-        return this.$store.state.currentDcList;
-      }
-    },
 
     mounted() {
+      //初始化表头
+      let tableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
+      if (this.assetPingSwitch == 'off') {
+        for (let i in tableTitle) {
+          let label = tableTitle[i];
+          if (label.prop == 'pingStatus') {
+            tableTitle.splice(i, 1);
+            break;
+          }
+        }
+      }
+      this.tools.customTableTitle = tableTitle;
       //初始化数据
       this.getUserData();
       this.getTableData();
@@ -759,23 +713,6 @@
           el._ps_.update();
         };
       });
-      let localStorageTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path);
-      this.tools.tablelable = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
-
-      if (this.assetPingSwitch == 'off') {
-
-        for (let i in this.tools.tablelable) {
-          let label = this.tools.tablelable[i];
-
-          if (label.prop == 'pingStatus') {
-            this.tools.tablelable.splice(i, 1);
-            //console.log(this.tools.tablelable)
-            break;
-          }
-        }
-      }
-
-      this.tools.dropCol = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
     },
     destroyed() {
       window.onresize = null;

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

@@ -22,6 +22,16 @@
         <!-- 顶部分页组件，当打开底部上滑框时出现 -->
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table
         class="nz-table"
         :data="tableData"
@@ -35,7 +45,7 @@
         @sort-change="tableDataSort">
         <el-table-column
           :resizable="false"
-          v-for="(item, index) in tools.tablelable"
+          v-for="(item, index) in tools.customTableTitle"
           v-if="item.show"
           :width="item.width"
           :key="`col-${index}`"
@@ -74,7 +84,7 @@
         </el-table-column>
         <el-table-column width="28">
           <template slot="header" slot-scope="scope" :resizable="false">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
           </template>
@@ -95,15 +105,6 @@
     <transition name="right-box">
       <account-box v-if="rightBox.show" :user="user" @close="closeRightBox"></account-box>
     </transition>
-    <!-- 自定义table列 -->
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :dropCol="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      :table-title="tableTitle"
-      ref="elementset"
-    ></element-set>
   </div>
 </template>
 <script>
@@ -138,10 +139,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         mainTableHeight: this.$tableHeight.normal, //主列表table高度
 
@@ -231,37 +231,6 @@
         detail.push({label: this.$t("config.account.createTime"), value: obj.createTime});
         return detail;
       },
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tools.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       closeRightBox(refresh) {
         this.rightBox.show = false;
         if (refresh) {
@@ -277,6 +246,22 @@
         this.bottomBox.targetTab = "detail";
         this.bottomBox.showSubList = true;
       },
+      del(u) {
+        this.$confirm(this.$t("tip.confirmDelete"), {
+          confirmButtonText: this.$t("tip.yes"),
+          cancelButtonText: this.$t("tip.no"),
+          type: 'warning'
+        }).then(() => {
+          this.$delete("sys/user/delete?userIds=" + u.userId).then(response => {
+            if (response.code === 200) {
+              this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
+              this.getTableData();
+            } else {
+              this.$message.error(response.msg);
+            }
+          })
+        });
+      },
       getTableData() {
         this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
         this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
@@ -365,6 +350,10 @@
       }
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -391,12 +380,6 @@
           });
         }
       });
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -20,6 +20,16 @@
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table
         class="nz-table"
         :data="tableData"
@@ -36,7 +46,7 @@
         <el-table-column
           :resizable="false"
           show-overflow-tooltip
-          v-for="(item, index) in tools.tablelable"
+          v-for="(item, index) in tools.customTableTitle"
           v-if="item.show"
           :width="item.width"
           :key="`col-${index}`"
@@ -46,8 +56,6 @@
         >
           <template slot-scope="scope" :column="item">
             <div v-if="item.prop == 'option'" class="content-right-options">
-              <!--<span :title="$t('overall.view')" @click="detail(scope.row)" class="content-right-option" :id="'dc-detail-'+scope.row.id"><i class="nz-icon nz-icon-view"></i></span>
-              &nbsp;-->
               <span :title="$t('overall.edit')" @click="edit(scope.row)" class="content-right-option" :id="'dc-edit-'+scope.row.id"><i class="nz-icon nz-icon-edit"></i></span>
               &nbsp;
               <span :title="$t('overall.delete')" @click="del(scope.row)" class="content-right-option" :id="'dc-del-'+scope.row.id"><i class="el-icon-delete"></i></span>
@@ -88,7 +96,7 @@
         </el-table-column>
         <el-table-column width="28" :resizable="false">
           <template slot="header" slot-scope="scope">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
           </template>
@@ -106,15 +114,6 @@
       </transition>
     </div>
     <!--dc table end-->
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :dropCol="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      :table-title="tableTitle"
-      ref="elementset"
-    ></element-set>
-
     <transition name="right-box">
       <dc-box @close="closeDcBox" :dc="dc" :user-data="userData" @reload="getTableData" v-if="rightBox.dc.show"></dc-box>
     </transition>
@@ -152,10 +151,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         tableId: 'dcTable', //需要分页的table的id，用于记录每页数量
         dc: {},
@@ -237,43 +235,12 @@
       }
     },
     methods: {
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tools.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
       assetStatClassName(param) {
         if (param.column.label == this.$t("config.dc.assets")) {
           return "asset-state";
         }
         return "";
       },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       jumpTo(data, id) {
         bus.$emit("menu-change", data);
         this.$router.push({
@@ -368,7 +335,7 @@
             if (response.code === 200) {
               this.$message({duration: 1000, type: 'success', message: this.$t("tip.deleteSuccess")});
               this.getTableData();
-              this.$store.commit("dcListChange");
+              bus.$emit("dc-list-change");
             } else {
               this.$message.error(response.msg);
             }
@@ -484,6 +451,10 @@
       window.onresize = null;
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -512,13 +483,6 @@
           };
         }
       });
-
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -25,8 +25,18 @@
           </button>
         </div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table :data="tableData" border :height="$tableHeight.normal" style="width: 100%;" ref="mibTable" class="nz-table mib-table" v-scrollBar:el-table="'large'" v-loading="tools.loading" @sort-change="tableDataSort">
-        <el-table-column :resizable="false" v-for="(item, index) in tools.tablelable" v-if="item.show" :width="item.width" :class-name="item.prop == 'modelsDetail'?'detail-column':''"
+        <el-table-column :resizable="false" v-for="(item, index) in tools.customTableTitle" v-if="item.show" :width="item.width" :class-name="item.prop == 'modelsDetail'?'detail-column':''"
                          :key="`col-${index}`" :label="item.label" :sortable="sortableShow(item.prop)"
                          :prop="propTitle(item.prop)"
                          :sort-orders="['ascending', 'descending']">
@@ -76,7 +86,7 @@
         </el-table-column>
         <el-table-column :resizable="false" width="28">
           <template slot="header" slot-scope="scope">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
           </template>
@@ -88,14 +98,6 @@
       <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
     </template>
     <mib-browser :show-tab="showTab" v-if="showTab == 'browser'" @toFileTab="showTab = 'file'"></mib-browser>
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :table-title="tableTitle"
-      :dropCol="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
     <transition name="right-box">
       <mib-box v-if="rightBox.show" ref="mibBox" :mib="mib" @reload="getTableData" @close="closeRightBox"></mib-box>
     </transition>
@@ -120,10 +122,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         tableId: 'mibTable', //需要分页的table的id，用于记录每页数量
         mib: {},
@@ -197,39 +198,6 @@
       }
     },
     methods: {
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        this.$nextTick(() => {
-          var eventfixed = {
-            shezhi: 0,
-            screen: 0
-          };
-          eventfixed[s] = 1;
-          e.preventDefault();
-          this.$store.commit('setHeaderTable', this.tools.tablelable);
-          this.$store.commit('setEventfixed', eventfixed);
-          const h = document.documentElement.clientHeight;
-          const w = document.documentElement.clientWidth;
-          const dw = this.$refs.elementset.$el.offsetWidth;
-          const dh = this.$refs.elementset.$el.offsetHeight;
-          let positionx =
-            e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-          let positiony =
-            e.clientY + dh <= h - 10
-              ? e.clientY + 20
-              : e.clientY + 20 - (e.clientY + dh - h);
-          this.$store.commit('setPosition', {positionx, positiony});
-        });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       clickOutside() {
         this.rightBox.show = false;
       },
@@ -373,6 +341,10 @@
       },
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -399,12 +371,6 @@
           });
         }
       });
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     },
   }
 </script>

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

@@ -19,6 +19,16 @@
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table :data="tableData"
                 border style="width: 100%;"
                 ref="modelTable"
@@ -32,7 +42,7 @@
                 @sort-change="tableDataSort"
       >
         <el-table-column :resizable="false"
-                         v-for="(item, index) in tools.tablelable"
+                         v-for="(item, index) in tools.customTableTitle"
                          v-if="item.show"
                          :width="item.width"
                          :key="`col-${index}`"
@@ -66,7 +76,7 @@
         </el-table-column>
         <el-table-column :resizable="false" width="28">
           <template slot="header" slot-scope="scope">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
           </template>
@@ -83,14 +93,6 @@
       <bottom-box v-if="bottomBox.showSubList" :sub-resize-show="bottomBox.subResizeShow" :is-fullscreen="bottomBox.isFullScreen" from="model" :target-tab.sync="bottomBox.targetTab" :obj="bottomBox.model"
                   @closeSubList="bottomBox.showSubList = false" @fullScreen="fullScreen" @exitFullScreen="exitFullScreen" @listResize="listResize" ref="panelBox"></bottom-box>
     </transition>
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :table-title="tableTitle"
-      :dropCol="tools.dropCol"
-      @tools.tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
     <transition name="right-box">
       <model-box v-if="rightBox.show" ref="modelBox" :model="model" @close="closeRightBox" @reload="getTableData"></model-box>
     </transition>
@@ -120,10 +122,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
         tableId: 'modelTable', //需要分页的table的id，用于记录每页数量
 
@@ -196,45 +197,12 @@
       }
     },
     methods: {
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        this.$nextTick(() => {
-          let eventfixed = {
-            shezhi: 0,
-            screen: 0
-          };
-          eventfixed[s] = 1;
-          e.preventDefault();
-          this.$store.commit('setHeaderTable', this.tools.tablelable);
-          this.$store.commit('setEventfixed', eventfixed);
-          const h = document.documentElement.clientHeight;
-          const w = document.documentElement.clientWidth;
-          const dw = this.$refs.elementset.$el.offsetWidth;
-          const dh = this.$refs.elementset.$el.offsetHeight;
-          let positionx =
-            e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-          let positiony =
-            e.clientY + dh <= h - 10
-              ? e.clientY + 20
-              : e.clientY + 20 - (e.clientY + dh - h);
-          this.$store.commit('setPosition', {positionx, positiony});
-        });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
       assetStatClassName(param) {
         if (param.column.label == this.$t("config.model.assets")) {
           return "asset-state";
         }
         return "";
       },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       panel(obj) {
         this.bottomBox.showSubList = true;
         this.bottomBox.model = obj;
@@ -372,6 +340,10 @@
       },
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -398,12 +370,6 @@
           });
         }
       });
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     },
     watch: {
       'bottomBox.showSubList': function(n) {

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

@@ -13,13 +13,23 @@
         </div>
       </div>
     </div>
+    <!-- 自定义table列 -->
+    <transition name="el-zoom-in-top">
+      <element-set
+        v-if="tools.showCustomTableTitle"
+        @close="tools.showCustomTableTitle = false"
+        :custom-table-title.sync="tools.customTableTitle"
+        :original-table-title="tableTitle"
+        ref="customTableTitle"
+      ></element-set>
+    </transition>
     <el-table
       class="nz-table"
       :data="tableData"
       border
       ref="operationLogTable"
       :height="$tableHeight.normal"
-      v-loading="loading"
+      v-loading="tools.loading"
       v-scrollBar:el-table="'large'"
       :cell-class-name="messageStyle"
       style="width: 100%;"
@@ -27,7 +37,7 @@
     >
       <el-table-column
         :resizable="false"
-        v-for="(item, index) in tablelable"
+        v-for="(item, index) in tools.customTableTitle"
         v-if="item.show"
         :width="item.width"
         :key="`col-${index}`"
@@ -45,23 +55,16 @@
       </el-table-column>
       <el-table-column width="28">
         <template slot="header" slot-scope="scope">
-          <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
             <i class="nz-icon nz-icon-gear"></i>
           </span>
         </template>
         <template v-slot="scope">
-          <button v-if="scope.$index == 0" class="to-top" :style="{top: toTopBtnTop}" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
+          <button v-if="scope.$index == 0" class="to-top" :style="{top: tools.toTopBtnTop}" :class="{'to-top-is-hover': tools.tableHover}" v-show="tools.showTopBtn" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
         </template>
       </el-table-column>
     </el-table>
     <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
-    <element-set
-      v-clickoutside="elementsetHide"
-      :dropCol="dropCol"
-      @tablelable="tablelabelEmit"
-      :table-title="tableTitle"
-      ref="elementset"
-    ></element-set>
   </div>
 </template>
 <script>
@@ -70,16 +73,10 @@
     name: "oparetionlog",
     data() {
       return {
-        loading: false,
         tableId: 'operationLogTable', //需要分页的table的id，用于记录每页数量
-        showTopBtn: false,
-        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
-        tableHover: false, //控制滚动条和top按钮同时出现
 
         rightBox: { //弹出框相关
           show: false,
-          isEdit: false, //false查看，true编辑
-          title: ''
         },
         rightBoxResize: { //resize弹出框相关
           show: false,
@@ -96,6 +93,15 @@
           isAdd: false, //false，true：resize
           title: ''
         },
+        /*工具参数*/
+        tools: {
+          loading: false, //是否显示table加载动画
+          toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          tableHover: false, //控制滚动条和top按钮同时出现
+          showTopBtn: false, //显示To top按钮
+          showCustomTableTitle: false, //自定义列弹框是否显示
+          customTableTitle: [], //自定义列工具的数据
+        },
         pageObj: {
           pageNo: 1,
           pageSize: 50,
@@ -163,8 +169,6 @@
             show: false,
           },
         ],
-        tablelable: [],
-        dropCol: [],
         tableData: [],
         searchMsg: { //给搜索框子组件传递的信息
           zheze_none: true,
@@ -194,36 +198,6 @@
       }
     },
     methods: {
-      elementsetShow(s, e) {
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tablelable = data;
-      },
       messageStyle(e) {
         if (e.column.label == this.$t('config.operationlog.state')) {
           if (e.row.state == 'success') {
@@ -237,44 +211,15 @@
       getTableData: function () {
         this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
         this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
-        this.loading = true;
+        this.tools.loading = true;
         this.$get('sys/log/list', this.searchLabel).then(response => {
-          this.loading = false;
+          this.tools.loading = false;
           if (response.code === 200) {
-            // for (let i = 0; i < response.data.list.length; i++) {
-            //   response.data.list[i].status = response.data.list[i].status + "";
-            // }
             this.tableData = response.data.list;
             this.pageObj.total = response.data.total
           }
         })
       },
-      jumpTo(data, id) {
-        bus.$emit("menu-change", data);
-        this.$router.push({
-          path: "/" + data,
-          query: {
-            t: +new Date()
-          }
-        });
-      },
-      toEditReceiver: function (item) {
-        if (!item.isEdit) {
-          //如果不在编辑状态，那么其他项如果有改动，则还原改动，最后开始编辑
-          this.blurEditReceiver();
-          item.isEdit = true;
-        } else {
-          //如果已在编辑状态，判断name是否有变更，有变更则发请求
-          if (item.name != item.oldName) {
-            if (this.updateReceiverName(item) == 200) {
-              item.isEdit = false;
-            }
-          } else {
-            item.errorMessage = '';
-            item.isEdit = false;
-          }
-        }
-      },
       pageNo(val) {
         this.pageObj.pageNo = val;
         this.getTableData();
@@ -285,9 +230,9 @@
         this.getTableData();
       },
       search: function (searchObj) {
-        let orderBy='';
+        let orderBy = '';
         if(this.searchLabel.orderBy){
-          orderBy=this.searchLabel.orderBy
+          orderBy = this.searchLabel.orderBy
         }
         this.searchLabel = {};
         this.pageObj.pageNo = 1;
@@ -349,6 +294,10 @@
       }
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize && pageSize != 'undefined') {
@@ -362,25 +311,19 @@
         if (el._ps_) {
           el.addEventListener("ps-scroll-y", () => {
             if (el._ps_.scrollbarYTop > 50) {
-              this.showTopBtn = true;
+              this.tools.showTopBtn = true;
             } else {
-              this.showTopBtn = false;
+              this.tools.showTopBtn = false;
             }
           });
           el.addEventListener("mouseenter", () => {
-            this.tableHover = true;
+            this.tools.tableHover = true;
           });
           el.addEventListener("mouseleave", () => {
-            this.tableHover = false;
+            this.tools.tableHover = false;
           });
         }
       });
-      this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -19,10 +19,20 @@
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
+      <!-- 自定义table列 -->
+      <transition name="el-zoom-in-top">
+        <element-set
+          v-if="tools.showCustomTableTitle"
+          @close="tools.showCustomTableTitle = false"
+          :custom-table-title.sync="tools.customTableTitle"
+          :original-table-title="tableTitle"
+          ref="customTableTitle"
+        ></element-set>
+      </transition>
       <el-table :data="tableData" border v-show="bottomBox.mainResizeShow" :height="mainTableHeight" style="width: 100%;"
                 v-loading="tools.loading" ref="promTable" class="nz-table" v-scrollBar:el-table="'large'"
                 @sort-change="tableDataSort">
-        <el-table-column :resizable="false" v-for="(item, index) in tools.tablelable"
+        <el-table-column :resizable="false" v-for="(item, index) in tools.customTableTitle"
                          v-if="item.show"
                          :width="item.width"
                          :key="`col-${index}`"
@@ -57,7 +67,7 @@
         </el-table-column>
         <el-table-column width="28" :resizable="false">
           <template slot="header" slot-scope="scope">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
           </template>
@@ -77,14 +87,6 @@
     <transition name="right-box">
       <prom-server-box v-if="rightBox.show" :prom-server="promServer" @close="closeRightBox"></prom-server-box>
     </transition>
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :table-title="tableTitle"
-      :dropCol="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
   </div>
 
 </template>
@@ -120,10 +122,9 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
 
         tableId: 'promTable', //需要分页的table的id，用于记录每页数量
@@ -252,37 +253,6 @@
         });
         return detail;
       },
-      elementsetShow(s, e) {
-        this.tools.showElementSet = true;
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tools.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       edit(u) {
         this.promServer = JSON.parse(JSON.stringify(u));
         this.rightBox.show = true;
@@ -426,11 +396,15 @@
         this.getTableData();
       },
     },
-    mounted: function () {
+    mounted() {
       //初始化数据
       Promise.all([this.getDcData()]).then(response => {
         this.getTableData();
       });
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {
@@ -456,12 +430,6 @@
           });
         }
       });
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     },
 
     watch: {

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

@@ -13,6 +13,16 @@
         </div>
       </div>
     </div>
+    <!-- 自定义table列 -->
+    <transition name="el-zoom-in-top">
+      <element-set
+        v-if="tools.showCustomTableTitle"
+        @close="tools.showCustomTableTitle = false"
+        :custom-table-title.sync="tools.customTableTitle"
+        :original-table-title="tableTitle"
+        ref="customTableTitle"
+      ></element-set>
+    </transition>
     <el-table
       class="nz-table"
       :data="tableData"
@@ -20,13 +30,13 @@
       ref="terminalLogTable"
       :height="$tableHeight.normal"
       v-scrollBar:el-table="'large'"
-      v-loading="loading"
+      v-loading="tools.loading"
       :cell-class-name="messageStyle"
       style="width: 100%;"
       @sort-change="tableDataSort">
       <el-table-column
         :resizable="false"
-        v-for="(item, index) in tablelable"
+        v-for="(item, index) in tools.customTableTitle"
         v-if="item.show"
         :width="item.width"
         :key="`col-${index}`"
@@ -49,23 +59,16 @@
       </el-table-column>
       <el-table-column width="28">
         <template slot="header" slot-scope="scope">
-          <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+          <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
             <i class="nz-icon nz-icon-gear"></i>
           </span>
         </template>
         <template v-slot="scope">
-          <button v-if="scope.$index == 0" class="to-top" :style="{top: toTopBtnTop}" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
+          <button v-if="scope.$index == 0" class="to-top" :style="{top: tools.toTopBtnTop}" :class="{'to-top-is-hover': tools.tableHover}" v-show="tools.showTopBtn" @click="$toTop('ps', 0)"><i class="nz-icon nz-icon-top"></i></button>
         </template>
       </el-table-column>
     </el-table>
     <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
-    <element-set
-      v-clickoutside="elementsetHide"
-      :dropCol="dropCol"
-      @tablelable="tablelabelEmit"
-      :table-title="tableTitle"
-      ref="elementset"
-    ></element-set>
   </div>
 </template>
 <script>
@@ -74,16 +77,22 @@
     name: "terminallog",
     data() {
       return {
-        loading: false,
         tableId: 'terminalLogTable', //需要分页的table的id，用于记录每页数量
-        showTopBtn: false,
-        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
-        tableHover: false, //控制滚动条和top按钮同时出现
 
+        /*工具参数*/
+        tools: {
+          loading: false, //是否显示table加载动画
+          toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+          tableHover: false, //控制滚动条和top按钮同时出现
+          showTopBtn: false, //显示To top按钮
+          showCustomTableTitle: false, //自定义列弹框是否显示
+          customTableTitle: [], //自定义列工具的数据
+        },
         rightBox: { //弹出框相关
           show: false,
           isEdit: false, //false查看，true编辑
           title: ''
+          
         },
         rightBoxResize: { //resize弹出框相关
           show: false,
@@ -169,8 +178,6 @@
             width: 100
           }
         ],
-        tablelable: [],
-        dropCol: [],
         tableData: [],
         searchMsg: { //给搜索框子组件传递的信息
           zheze_none: true,
@@ -213,42 +220,12 @@
       }
     },
     methods: {
-      elementsetShow(s, e) {
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', {positionx, positiony});
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.$refs.elementset.elementsetHide();
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tablelable = data;
-      },
       getTableData: function () {
         this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
         this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
-        this.loading = true;
+        this.tools.loading = true;
         this.$get('terminal/log', this.searchLabel).then(response => {
-          this.loading = false;
+          this.tools.loading = false;
           if (response.code === 200) {
             for (let i = 0; i < response.data.list.length; i++) {
               response.data.list[i].status = response.data.list[i].status + "";
@@ -258,15 +235,6 @@
           }
         })
       },
-      jumpTo(data, id) {
-        bus.$emit("menu-change", data);
-        this.$router.push({
-          path: "/" + data,
-          query: {
-            t: +new Date()
-          }
-        });
-      },
       messageStyle(e) {
         if (e.column.label == this.$t('config.terminallog.status')) {
           if (e.row.status == '1') {
@@ -277,23 +245,6 @@
         }
         return '';
       },
-      toEditReceiver: function (item) {
-        if (!item.isEdit) {
-          //如果不在编辑状态，那么其他项如果有改动，则还原改动，最后开始编辑
-          this.blurEditReceiver();
-          item.isEdit = true;
-        } else {
-          //如果已在编辑状态，判断name是否有变更，有变更则发请求
-          if (item.name != item.oldName) {
-            if (this.updateReceiverName(item) == 200) {
-              item.isEdit = false;
-            }
-          } else {
-            item.errorMessage = '';
-            item.isEdit = false;
-          }
-        }
-      },
       pageNo(val) {
         this.pageObj.pageNo = val;
         this.getTableData();
@@ -360,14 +311,11 @@
         this.getTableData();
       },
     },
-    computed: {
-      isCurrentUser() {
-        return function(username) {
-          return localStorage.getItem('nz-username') == username;
-        }
-      }
-    },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize && pageSize != 'undefined') {
@@ -381,25 +329,19 @@
         if (el._ps_) {
           el.addEventListener("ps-scroll-y", () => {
             if (el._ps_.scrollbarYTop > 50) {
-              this.showTopBtn = true;
+              this.tools.showTopBtn = true;
             } else {
-              this.showTopBtn = false;
+              this.tools.showTopBtn = false;
             }
           });
           el.addEventListener("mouseenter", () => {
-            this.tableHover = true;
+            this.tools.tableHover = true;
           });
           el.addEventListener("mouseleave", () => {
-            this.tableHover = false;
+            this.tools.tableHover = false;
           });
         }
       });
-      this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
-      this.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.tableTitle;
     }
   }
 </script>

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

@@ -43,6 +43,16 @@
           </div>
           <div class="pagination-top pagination-top-hide display-none"></div>
         </div>
+        <!-- 自定义table列 -->
+        <transition name="el-zoom-in-top">
+          <element-set
+            v-if="tools.showCustomTableTitle"
+            @close="tools.showCustomTableTitle = false"
+            :custom-table-title.sync="tools.customTableTitle"
+            :original-table-title="tableTitle"
+            ref="customTableTitle"
+          ></element-set>
+        </transition>
         <el-table
           :data="endpointTableData"
           border
@@ -57,7 +67,7 @@
         >
           <el-table-column
             :resizable="false"
-            v-for="(item, index) in tools.tablelable"
+            v-for="(item, index) in tools.customTableTitle"
             v-if="item.show"
             :width="item.width"
             :key="`col-${index}`"
@@ -100,7 +110,7 @@
           </el-table-column>
           <el-table-column width="28" :resizable="false">
             <template slot="header" slot-scope="scope">
-            <span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
+            <span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear">
               <i class="nz-icon nz-icon-gear"></i>
             </span>
             </template>
@@ -117,21 +127,12 @@
     <template v-else-if="pageType == 'project'">
       <panel-tab from="project" :obj="currentProject" targetTab.sync="panel"></panel-tab>
     </template>
+
     <transition name="el-zoom-in-bottom">
       <bottom-box v-if="bottomBox.showSubList" :sub-resize-show="bottomBox.subResizeShow" :is-full-screen="bottomBox.isFullScreen"
                   :from="'endpoint'" :target-tab.sync="bottomBox.targetTab" :detail="bottomBox.endpointDetail" :obj="endpoint" :asset-detail="bottomBox.assetDetail"
                   @closeSubList="bottomBox.showSubList = false" @fullScreen="fullScreen" @exitFullScreen="exitFullScreen" @listResize="listResize" ></bottom-box>
     </transition>
-
-    <element-set
-      v-if="tools.showElementSet"
-      v-clickoutside="elementsetHide"
-      :table-title="endpointTableTitle"
-      :drop-col="tools.dropCol"
-      @tablelable="tablelabelEmit"
-      ref="elementset"
-    ></element-set>
-
     <transition name="right-box">
       <add-endpoint-box v-if="rightBox.addEndpoint.show" :current-project="currentProject" :current-module="currentModule" @close="closeAddEndpointRightBox" ref="addEndpointBox"></add-endpoint-box>
     </transition>
@@ -180,23 +181,17 @@
           loading: false, //是否显示table加载动画
           toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
           tableHover: false, //控制滚动条和top按钮同时出现
-          showElementSet: false, //自定义列弹框是否显示
           showTopBtn: false, //显示To top按钮
-          tablelable: [], //从缓存中加载的table header
+          showCustomTableTitle: false, //自定义列弹框是否显示
-          dropCol: [], //自定义列工具的数据
+          customTableTitle: [], //自定义列工具的数据
         },
 
 
         tableId: 'projectTable', //需要分页的table的id，用于记录每页数量
-
-        endpoint:{
-          project:null,
-          module:null,
-        },
         userData: [],
 
         endpoint: {id: '', host: '', port: '', param: '', path: '', asset: {}, project: {}, module: {}, moduleId: '', assetId: '', paramObj: []},
-        endpointTableTitle: [
+        tableTitle: [
           {
             label: this.$t("project.endpoint.endpointId"),
             prop: 'id',
@@ -249,7 +244,6 @@
           pageSize: 50,
           total:0
         },
-        endpoint: {},
 
         currentProjectTitle:'',
         moduleList: [],
@@ -294,36 +288,6 @@
         let vm = this;
         this.$bottomBoxWindow.listResize(vm, e);
       },
-      elementsetShow(s, e) {
-        var eventfixed = {
-          shezhi: 0,
-          screen: 0
-        };
-        eventfixed[s] = 1;
-        e.preventDefault();
-        this.$store.commit('setHeaderTable', this.tools.tablelable);
-        this.$store.commit('setEventfixed', eventfixed);
-        const h = document.documentElement.clientHeight;
-        const w = document.documentElement.clientWidth;
-        const dw = this.$refs.elementset.$el.offsetWidth;
-        const dh = this.$refs.elementset.$el.offsetHeight;
-        let positionx =
-          e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw;
-        let positiony =
-          e.clientY + dh <= h - 10
-            ? e.clientY + 20
-            : e.clientY + 20 - (e.clientY + dh - h);
-        this.$store.commit('setPosition', { positionx, positiony });
-      },
-      elementsetHide() {
-        //悬浮点击空白隐藏
-        this.tools.showElementSet = false;
-      },
-      tablelabelEmit(data) {
-        //获取子组件传过来的参数
-        this.$store.commit('setHeaderTable', data);
-        this.tools.tablelable = data;
-      },
       getEndpointTableData() {
         if(this.currentModule && this.currentModule.id) {
           this.pageType = 'endpoint';
@@ -493,9 +457,6 @@
         this.endpoint = Object.assign({}, endpoint);
         this.bottomBox.targetTab = 'assetDetail';
         this.bottomBox.showSubList = true;
-        /*this.viewAssetState=true;
-        this.$refs.assetEditUnit.getAssetData(id);
-        this.$refs.assetEditUnit.tabView=true;*/
       },
       query(endpoint) {
         this.endpoint = Object.assign({}, endpoint);
@@ -507,7 +468,6 @@
           if(row.state == 1){
             return 'up';
           }else{
-            // return 'down'+'['+this.getStateErrorMsg(row)+']';
             return `down:${this.getStateErrorMsg(row)}`
           }
         }
@@ -647,6 +607,10 @@
       this.getProjectList();
     },
     mounted() {
+      //初始化表头
+      this.tools.customTableTitle = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
+        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
+        : this.tableTitle;
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize) {
@@ -663,13 +627,6 @@
       window.onresize = function() {
         vm.$refs.leftScrollbar.update();
       };
-
-      this.tools.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.endpointTableTitle;
-      this.tools.dropCol = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)
-        ? JSON.parse(localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path))
-        : this.endpointTableTitle;
     },
     computed: {
       itemTip() {

nezha-fronted/src/main.js

@@ -34,7 +34,6 @@ import editEndpointBox from './components/common/rightBox/editEndpointBox'; //en
 import addEndpointBox from './components/common/rightBox/addEndpointBox'; //endpoint弹框组件
 import assetBox from "./components/common/rightBox/assetBox"; //资产添加组件
 import alertConfigBox from "./components/common/rightBox/alertConfigBox"; //告警规则弹框组件
-import dcConfigBox from "./components/common/popBox/dcConfig"; //idc配置弹框组件
 import panelBox from "./components/common/rightBox/panelBox"; //面板弹框组件
 import moduleListPop from "./components/page/asset/moduleListPop"; //面板弹框组件
 import cabinetConfigBox from "./components/common/popBox/cabinetConfig"; //面板弹框组件
@@ -55,7 +54,6 @@ Vue.component("edit-endpoint-box", editEndpointBox);
 Vue.component("add-endpoint-box", addEndpointBox);
 Vue.component("asset-box", assetBox);
 Vue.component("alert-config-box", alertConfigBox);
-Vue.component("idc-config-box", dcConfigBox);
 Vue.component("panel-box", panelBox);
 Vue.component("module-list-pop", moduleListPop);
 Vue.component("cabinet-config-box", cabinetConfigBox);

nezha-fronted/src/store/index.js

@@ -1,46 +1,23 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 
-Vue.use(Vuex)
+Vue.use(Vuex);
 const store = new Vuex.Store({
   state: {
-    assetForAlertList: 0, //asset页跳转alertList时传递的assetId
-
-    assetItemId:''  ,   //复选框ID
-    assetAllId:[]  ,   //复选框allID
-
-    dcList: 0, //监听此值，改变则刷新dc列表
     /* 监听对象变化，用于顶部菜单与底部内容的同步 */
     currentProject: {id: "", name: "", remark: ""},
-    currentModule: {id: ""},
-    currentAsset: {id: ""},
-    currentDcList: [],
     projectListChange: 0,
-    moduleListChange: 0,
-    endpointListChange: 0,
-    assetListChange: 0,
-    dcListChange: 0,
-    alertConfigListChange: 0,
 
-    eventfixed: {
-      shezhi: 0,
-      screen: 0
-    },
-    tablelable: [], //获取头部信息
-    position: {
-      event_positiony: 0,
-      event_positionx: -200
-    },
     showPanel:{
       id: 0,
       name: '',
       type: "dashboard"
     },
-    consoleShow:false,//是否显示console窗口
+    consoleShow: false,//是否显示console窗口
-    consoleCount:0,//当前console窗口数
+    consoleCount: 0,//当前console窗口数
-    isAddConsole:false,//是否增加窗口
+    isAddConsole: false,//是否增加窗口
-    consoleParam:{},//新开console窗口参数
+    consoleParam: {},//新开console窗口参数
-    linkData:[],//导航数据
+    linkData: [],//导航数据
   },
   getters: {
     getLinkData(state){
@@ -52,85 +29,46 @@ const store = new Vuex.Store({
     projectListChange(state) {
       state.projectListChange++;
     },
-    moduleListChange(state) {
-      state.moduleListChange++;
-    },
-    endpointListChange(state) {
-      state.endpointListChange++;
-    },
-    assetListChange(state) {
-      state.assetListChange++;
-    },
-    alertConfigListChange(state) {
-      state.alertConfigListChange++;
-    },
-    dcListChange(state) {
-      state.dcListChange++;
-    },
     currentProjectChange(state, project) {
       state.currentProject = project;
     },
-    currentDcListChange(state, dcList) {
-      state.currentDcList = dcList;
-    },
-    currentAssetChange(state, asset) {
-      state.currentAsset = asset;
-    },
 
     panelShowPanelChange(state, panel) { //用来panel页控制初始panel的
       state.showPanel.id = panel.id;
       state.showPanel.name = panel.name;
     },
 
-    setHeaderTable(state, data) { //设置table头部
+    openConsole(state) {//打开console，如果当前窗口数为0，则默认新建一个console
-      state.tablelable = data;
+      state.consoleShow = true;
-    },
+      if(state.consoleCount === 0){
-    assetItemIdChange(state,data){ //修改复选框
-      state.assetItemId = data
-    },
-    assetAllIdChange(state,data){ //修改复选框
-			state.assetAllId = data
-    },
-    setEventfixed(state, data) { //设置坐标
-      state.eventfixed = data;
-    },
-    setPosition(state, data) { //设置坐标
-      state.position = data;
-    },
-    assetForAlertListChange(state, data) { //asset跳转alertmsg时
-      state.assetForAlertList = data;
-    },
-    openConsole(state){//打开console，如果当前窗口数为0，则默认新建一个console
-      state.consoleShow=true;
-      if(state.consoleCount===0){
         state.consoleCount++;
         state.isAddConsole = true;
       }else {
         state.isAddConsole = false;
       }
     },
-    addConsole(state,data){//打开console，并新建一个console
+    addConsole(state,data) {//打开console，并新建一个console
-      state.consoleShow=true;
+      state.consoleShow = true;
       state.consoleCount++;
       state.isAddConsole = true;
       state.consoleParam = data;
     },
-    addConsoleNum(state){
+    addConsoleNum(state) {
       state.consoleCount++;
     },
-    removeConsole(state){//移除一个console，如果是最后一个，则关闭窗口，否则不关闭窗口
+    removeConsole(state) {//移除一个console，如果是最后一个，则关闭窗口，否则不关闭窗口
       state.consoleCount--;
-      if(state.consoleCount===0){
+      if(state.consoleCount === 0){
-        state.consoleShow=false;
+        state.consoleShow = false;
       }
     },
-    closeConsole(state){//关闭console窗口
+    closeConsole(state) {//关闭console窗口
-      state.consoleShow=false;
+      state.consoleShow = false;
       state.consoleCount = 0;
       state.consoleParam ={};
     },
-    minConsole(state){//最小化窗口
+    minConsole(state) {//最小化窗口
-      state.consoleShow=false;
+      state.consoleShow = false;
     },
     setLinkData(state, data) {
       state.linkData = data;