direv/admin_new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

admin_new P0+P1 全批次合并 (84 commits) #2

Merged
direv merged 85 commits from develop into main 2026-08-07 11:27:17 +08:00
Conversation 0 Commits 85 Files Changed 94 +25 -20
1 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 63b32e999f - Show all commits

45
src/components/TableActions/TableActions.vue
View File

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