表格滚动优化

src/hooks/useTableCheck.ts

@@ -88,8 +88,25 @@ const useTableCheck = <T extends TableDataType<InputDataType>>(data: T, auto = t
     }
   }
   const nextRow = () => {
-    elTableRef?.value?.setCurrentRow(tableData.value[((current.value?.index || 0) + 1) % tableData.value.length])
-    elTableRef?.value?.scrollTo(0, (current.value?.index || 0) * 36)
+    const index = (current.value?.index || 0) + 1
+    elTableRef?.value?.setCurrentRow(tableData.value[index % tableData.value.length])
+    const tBodyDomWrap = elTableRef?.value?.$refs.bodyWrapper
+    if (tBodyDomWrap) {
+      if (index % tableData.value.length == 0) {
+        elTableRef?.value?.scrollTo({ left: 0, top: 0, behavior: 'smooth' })
+      } else {
+        const wrap = tBodyDomWrap.getElementsByClassName('el-scrollbar__wrap')[0]
+        const oHeight = wrap.offsetHeight
+        const sTop = wrap.scrollTop
+        const sHeight = wrap.scrollHeight
+        const targetRowAsHeight = 36 * ((current.value?.index || 0) + 1)
+        if (sHeight > oHeight && targetRowAsHeight - sTop > oHeight) {
+          const t = sHeight - targetRowAsHeight
+          elTableRef?.value?.scrollTo({ left: 0, top: sTop + 36, behavior: 'smooth' })
+        }
+      }
+    }
+    // elTableRef?.value?.scrollTo(0, (current.value?.index || 0) * 36)
   }
   const arrowDownToNextRow = (e: any) => {
     if (e.target.tagName === 'INPUT' || (e.target.className || '').includes('contenteditable-ele')) {

src/layout/main/LeftMenu.vue

@@ -1,6 +1,7 @@
 <template>
   <el-menu
     ref="menuRef"
+    :key="key"
     class="main-layout-left-menu"
     unique-opened
     :default-active="defaultActive"
@@ -19,7 +20,7 @@
 </template>
 
 <script setup lang="ts" name="MainLayoutLeftMenu">
-import { computed, ref, watch } from 'vue'
+import { computed, ref, watch, onActivated } from 'vue'
 import { useRoute } from 'vue-router'
 import { ElMenu } from 'element-plus'
 import useMainLayoutStore from '@/store/layout'
@@ -29,7 +30,10 @@ const route = useRoute()
 const mainLayoutStore = useMainLayoutStore()
 
 const menuRef = ref<InstanceType<typeof ElMenu> & { close: (index: string) => void }>()
-
+const key = ref('' + new Date().getTime())
+onActivated(() => {
+  key.value = '' + new Date().getTime()
+})
 const activeIndex = computed(() => {
   if (route.meta?.menu) {
     return route.meta.menuId