perf: to-top按钮随滚动条出现/消失

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

@@ -79,10 +79,12 @@
               <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>
+          </template>
         </el-table-column>
       </el-table>
       <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
-      <button class="to-top" v-show="showTopBtn" @click="$toTop"><i class="nz-icon nz-icon-top"></i></button>
     </div>
     </left-menu>
     <element-set
@@ -104,6 +106,10 @@
       return {
         tableId: 'modelTable', //需要分页的table的id，用于记录每页数量
         showTopBtn: false,
+
+        toTopBtnTop: this.$tableHeight.toTopBtnTop, //to-top按钮的top属性
+        tableHover: false, //控制滚动条和top按钮同时出现
+
         model: {
           id: '',
           name: '',
@@ -319,6 +325,12 @@
               this.showTopBtn = false;
             }
           });
+          el.addEventListener("mouseenter", () => {
+            this.tableHover = true;
+          });
+          el.addEventListener("mouseleave", () => {
+            this.tableHover = false;
+          });
         }
       });
       this.tablelable = localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path)