diff --git a/src/components/TableActions/TableActions.vue b/src/components/TableActions/TableActions.vue index 14835ca..c4627a2 100644 --- a/src/components/TableActions/TableActions.vue +++ b/src/components/TableActions/TableActions.vue @@ -71,18 +71,14 @@ const visibleActions = computed(() => 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(() => - isCollapsing.value ? visibleActions.value.slice(0, props.visibleCount) : visibleActions.value -) - -// 收进 ⋯ 的按钮 (第 visibleCount 个及之后, 仅 isCollapsing 时有值) -const moreActions = computed(() => - 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) {
3 时渲染) --> @@ -126,7 +122,7 @@ async function runAction(item: ActionItem) {