perf: 调整列表页表格的高度,调整panel顶部工具栏左侧位置

nezha-fronted/src/assets/stylus/main.scss

@@ -144,6 +144,11 @@ li{
   line-height: 16px;
   position: relative;
 }
+.to-top.nz-btn {
+  position: fixed;
+  bottom: 26px;
+  right: 20px;
+}
 .nz-btn-metricbtn{
   height: 32px;
 }

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

@@ -8,7 +8,7 @@
     text-align: center
   }
   .list-width{
-    width:98%;
+    width: calc(100% - 14px);
     overflow-x:hidden;/*避免鼠标第一次放到曲线时，x轴出现滚动条后消失*/
   }
 </style>

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

@@ -60,7 +60,7 @@ export default {
     float: left;
   }
   .pagination {
-    padding-top: 16px;
+    padding-top: 14px;
     text-align: center;
   }
 

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

@@ -34,7 +34,7 @@
         :data="tableData"
         border
         tooltip-effect="light"
-        height="calc(100% - 138px)"
+        height="calc(100% - 125px)"
         v-scrollBar:el-table
         style="width: 100%;">
         <el-table-column

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

@@ -26,7 +26,7 @@
         :data="tableData"
         border
         tooltip-effect="light"
-        height="calc(100% - 138px)"
+        height="calc(100% - 125px)"
         v-scrollBar:el-table
         style="width: 100%;">
         <el-table-column

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

@@ -50,7 +50,7 @@
 
       <el-table
         class="nz-table"
-        height="calc(100% - 138px)"
+        height="calc(100% - 125px)"
         style="width: 100%;"
         :data="tableData"
         v-scrollBar:el-table
@@ -179,6 +179,7 @@
         </el-table-column>
       </el-table>
       <Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
+      <!--<button class="to-top nz-btn nz-btn-size-normal nz-btn-style-light">TOP</button>-->
     </div>
 
     <!--<asset-add-unit :add-unit-show='addUnitShow' @refreshData="flushData" ref="assetAddUnit"
@@ -757,12 +758,13 @@
       this.getIDCOptionData();
     },
     mounted() {
-      setTimeout(()=>{
+      this.$nextTick(() => {
+        //左侧dc列表初始选中状态
         if (this.$store.state.assetData.selectedData.length > 0) {
           this.checkList = [];
           this.checkList = this.$store.state.assetData.selectedData;
         }
-      }, 50);
+      });
       let localStorageTitle=localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path);
       this.tablelable = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
       this.dropCol = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
@@ -786,6 +788,3 @@
     border: 1px solid #1166bb;
   }
 </style>
-<style lang="scss">
-
-</style>

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

@@ -34,7 +34,7 @@
         class="nz-table"
         :data="tableData"
         border
-        height="calc(100% - 138px)"
+        height="calc(100% - 125px)"
         v-scrollBar:el-table
         style="width: 100%;">
         <el-table-column

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

@@ -161,7 +161,7 @@
           :data="cabinetDatas"
           border
           v-scrollBar:el-table
-          height="calc(100% - 138px)"
+          height="calc(100% - 125px)"
           style="width: 100%;">
           <el-table-column
             :resizable="false"

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

@@ -30,7 +30,7 @@
           </div>
         </div>
       </div>
-      <el-table :data="tableData" border height="calc(100% - 138px)" style="width: 100%;" class="nz-table" v-scrollBar:el-table>
+      <el-table :data="tableData" border height="calc(100% - 125px)" style="width: 100%;" class="nz-table" v-scrollBar:el-table>
         <el-table-column :resizable="false" v-for="(item, index) in tablelable" v-if="item.show" :width="item.width"
                          :key="`col-${index}`" :label="item.label">
           <template slot-scope="scope" :column="item">

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

@@ -622,20 +622,21 @@
   }
 
   .panel-dropdown-title {
-    line-height:25px;
+    line-height:24px;
     padding-left:5px;
     margin-left:10px;
+    margin-top: 3px;
     text-align:left;
     border-radius:4px;
     width:120px;
-    height:25px;
+    height:24px;
     border:solid 1px  #d8dce1;
     white-space: nowrap;
     overflow-x: hidden;
     text-overflow: ellipsis;
   }
   .panel-list-title {
-    min-height:25px;
+    min-height:24px;
     width:100px;
     white-space: nowrap;
     overflow-x: hidden;
@@ -675,7 +676,7 @@
   .table-list {
     margin-top: 6px;
     overflow-y: auto;
-    height: calc(100% - 120px);
+    height: calc(100% - 92px);
   }
 
   .box-content {

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

@@ -119,7 +119,7 @@
         :data="endpointTableData"
         border
         class="nz-table"
-        height="calc(100% - 138px)"
+        height="calc(100% - 125px)"
         v-scrollBar:el-table
         style="width: 100%;">
         <el-table-column
@@ -215,7 +215,7 @@
         v-scrollBar:el-table
         class="nz-table"
         :header-cell-class-name="cellClass"
-        height="calc(100% - 110px)"
+        height="calc(100% - 92px)"
         @selection-change="selectChange"
         ref="metricInfoTab"
         style="width: 100%;">

nezha-fronted/src/main.js

@@ -86,7 +86,7 @@ Vue.directive("scrollBar", {
       !el && console.warn("未发现className为el-table__body-wrapper的dom");
 
       // 启用x轴后不让原生滚动条出来作乱
-      vnode.context.$nextTick(() => {
+      /*vnode.context.$nextTick(() => {
         el.classList.add("ps");
         el.addEventListener("ps-scroll-y", () =>
           el.classList.add("ps")
@@ -94,7 +94,7 @@ Vue.directive("scrollBar", {
         el.addEventListener("ps-scroll-x", () =>
           el.classList.add("ps")
         );
-      });
+      });*/
     }
     const rules = ["fixed", "absolute", "relative"];
     if (!rules.includes(window.getComputedStyle(el, null).position)) {