src/components/TableActions/TableActions.vue

@@ -71,18 +71,14 @@ const visibleActions = computed<ActionItem[]>(() =>
   props.actions.filter(item => !item.when || item.when(props.row))
 )
 
-// 按钮总数 ≤3 全部常驻, >3 才拆分前 visibleCount 个常驻 + 其余收纳
-const isCollapsing = computed(() => visibleActions.value.length > 3)
-
-// 常驻文字按钮 (前 N 个, N = isCollapsing ? visibleCount : 全部)
-const primaryActions = computed<ActionItem[]>(() =>
-  isCollapsing.value ? visibleActions.value.slice(0, props.visibleCount) : visibleActions.value
-)
-
-// 收进 ⋯ 的按钮 (第 visibleCount 个及之后, 仅 isCollapsing 时有值)
-const moreActions = computed<ActionItem[]>(() =>
-  isCollapsing.value ? visibleActions.value.slice(props.visibleCount) : []
-)
+// 拆分结果: 前 N 个常驻 + 其余收纳 (≤3 全常驻, >3 前 visibleCount 常驻)
+const layout = computed(() => {
+  const all = visibleActions.value
+  if (all.length > 3) {
+    return { primary: all.slice(0, props.visibleCount), more: all.slice(props.visibleCount) }
+  }
+  return { primary: all, more: [] as ActionItem[] }
+})
 
 // 执行操作 (处理二次确认)
 async function runAction(item: ActionItem) {
@@ -106,7 +102,7 @@ async function runAction(item: ActionItem) {
   <div class="rr-table-actions">
     <!-- 常驻文字按钮 -->
     <el-button
-      v-for="(item, i) in primaryActions"
+      v-for="(item, i) in layout.primary"
       :key="`p${i}`"
       text
       :type="resolveType(item) as any"
@@ -116,9 +112,9 @@ async function runAction(item: ActionItem) {
 
     <!-- 收纳下拉 (仅在按钮 >3 时渲染) -->
     <el-dropdown
-      v-if="moreActions.length"
+      v-if="layout.more.length"
       trigger="click"
-      @command="(cmd: number) => runAction(moreActions[cmd])"
+      @command="(cmd: number) => runAction(layout.more[cmd])"
     >
       <span class="rr-more-trigger">
         <el-icon><MoreFilled /></el-icon>
@@ -126,7 +122,7 @@ async function runAction(item: ActionItem) {
       <template #dropdown>
         <el-dropdown-menu>
           <el-dropdown-item
-            v-for="(item, i) in moreActions"
+            v-for="(item, i) in layout.more"
             :key="`m${i}`"
             :command="i"
             :divided="item.divided"
@@ -142,18 +138,27 @@ async function runAction(item: ActionItem) {
 .rr-table-actions {
   display: inline-flex;
   align-items: center;
-  gap: 4px;
+  gap: 0;
+  // 收紧 el-button text 的内边距, 默认 padding: 8px 15px 太松散
+  :deep(.el-button.is-text) {
+    padding: 0 4px;
+    margin: 0;
+    font-size: 13px;
+    height: auto;
+    min-height: 0;
+  }
 }
 .rr-more-trigger {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 26px;
-  height: 26px;
+  width: 22px;
+  height: 22px;
   border-radius: 4px;
   cursor: pointer;
   color: var(--ink-2, #475569);
-  font-size: 16px;
+  font-size: 15px;
+  margin-left: 2px;
   transition: all 0.15s;
   &:hover {
     background: var(--el-fill-color-light, #F4F4F5);