feat: 表格批量操作去掉setTimeout&表格默认高度调整

frontend/src/components/pure/ms-table/base-table.vue

@@ -164,7 +164,7 @@
     </a-table>
     <div
       v-if="showBatchAction || attrs.showPagination"
-      class="mt-[16px] flex h-[32px] min-w-[1000px] flex-row flex-nowrap items-center"
+      class="mt-[16px] flex h-[32px] flex-row flex-nowrap items-center"
       :class="{ 'justify-between': showBatchAction }"
     >
       <div class="flex flex-grow">

frontend/src/components/pure/ms-table/batchAction.vue

@@ -58,8 +58,9 @@
   const moreAction = ref<BatchActionConfig['moreAction']>([]);
   // 存储所有的action
   const allAction = ref<BatchActionConfig['baseAction']>([]);
-  const lastVisibleIndex = ref<number | null>(null);
   const refResizeObserver = ref<ResizeObserver>();
+  // 控制是否重新计算
+  const computedStatus = ref(true);
 
   const titleClass = 'title';
   const dividerClass = 'divider';
@@ -74,6 +75,10 @@
     if (!refWrapper.value) {
       return;
     }
+    if (!computedStatus.value) {
+      computedStatus.value = true;
+      return;
+    }
     const wrapperWidth = getNodeWidth(refWrapper.value);
 
     const childNodeList = [].slice.call(refWrapper.value.children) as HTMLElement[];
@@ -105,15 +110,15 @@
         menuItemIndex++;
       }
       if (totalWidth > wrapperWidth) {
-        lastVisibleIndex.value = menuItemIndex - 1;
+        const value = menuItemIndex - 1;
+        baseAction.value = allAction.value.slice(0, value);
+        moreAction.value = allAction.value.slice(value);
+        computedStatus.value = false;
         return;
       }
     }
-    lastVisibleIndex.value = null;
-    setTimeout(() => {
-      baseAction.value = props.actionConfig?.baseAction || [];
-      moreAction.value = props.actionConfig?.moreAction || [];
-    }, 0);
+    moreAction.value = props.actionConfig?.moreAction || [];
+    baseAction.value = props.actionConfig?.baseAction || [];
   };
 
   watch(
@@ -130,15 +135,6 @@
     },
     { immediate: true }
   );
-  watch(
-    () => lastVisibleIndex.value,
-    (value) => {
-      if (value !== null) {
-        baseAction.value = allAction.value.slice(0, value);
-        moreAction.value = allAction.value.slice(value);
-      }
-    }
-  );
 
   onMounted(() => {
     refResizeObserver.value = new ResizeObserver((entries: ResizeObserverEntry[]) => {

frontend/src/components/pure/ms-table/useTable.ts

@@ -33,8 +33,8 @@ export default function useTableProps<T>(
     bordered: true, // 是否显示边框
     showPagination: true, // 是否显示分页
     size: 'default', // 表格大小
-    heightUsed: 294, // 表格所在的页面已经使用的高度
-    scroll: { x: 1400, y: appStore.innerHeight - 294 }, // 表格滚动配置
+    heightUsed: 286, // 表格所在的页面已经使用的高度
+    scroll: { x: 1400, y: appStore.innerHeight - 286 }, // 表格滚动配置
     loading: false, // 加载效果
     data: [], // 表格数据
     /**