style(frontend): 表格操作列统一样式与确认框视觉收敛
- 新增 table-actions.css:操作列 flex 居中、间距交给 gap、破坏性动作前 加分组竖线、链接按钮悬停加深并加下划线(默认浅靛蓝在表格底色上对比度 不足);包装 span 改 flex,消除行内盒基线导致的约 1.7px 垂直错位 - 11 个列表页操作列套用统一容器与分隔线,列宽按动作自然宽度调整并居中 - 确认框不再传 type:warning(Element Plus 的实心黄圆图标与正文并排成 两列,标题行反被留空),图标改由全局样式画在标题行左侧,正文与标题 文字左对齐;图标为 CSS 伪元素,不进无障碍树 验证:pnpm type-check 绿 Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
1 parent
cc4c51359c
commit
cfd2a196f2
15 files changed
+299
-164
No files matched your search
@@ -337,10 +337,13 @@ onMounted(() => {
|
||||
<span class="cell-amount">{{ row.total_amount }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="130" fixed="right">
|
||||
<el-table-column label="操作" width="130" fixed="right" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button link type="primary" size="small" @click="openEdit(row)">编辑</el-button>
|
||||
<el-button link type="danger" size="small" @click="handleDelete(row)">删除</el-button>
|
||||
<div class="table-actions">
|
||||
<el-button link type="primary" size="small" @click="openEdit(row)">编辑</el-button>
|
||||
<span class="table-actions__divider" aria-hidden="true"></span>
|
||||
<el-button link type="danger" size="small" @click="handleDelete(row)">删除</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
Reference in new issue
Block a user