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

nezha-fronted/src/components/page/config/operationlog.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
@@ -103,6 +105,9 @@
         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编辑
@@ -338,6 +343,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)