优化

2026-08-10 16:24:54 +08:00
parent e119b48662
commit 820432a381
52 changed files with 1015 additions and 705 deletions
@@ -59,6 +59,10 @@
 ## UI 与交互

 - 延续现有后台视觉体系：克制的企业级界面、清晰的信息层级和高密度但可扫描的数据展示。
+- 路由级页面标题和说明统一由 `AppLayout` 顶部 `page-heading` 根据路由 `meta.title`、`meta.description` 展示。标准列表页正文不得重复渲染 `PageToolbar`、页面标题或说明，只保留查询区与表格区。`QueryToolbar` 只承载筛选项及其内置查询、重置按钮，不把新增、导入、导出或批量操作放入其 `actions` 插槽；重新执行查询即刷新当前结果，标准列表页任何位置都不得再提供独立刷新按钮。新增、导入、导出和批量操作统一放入 `DataTable` 的 `toolbar-actions` 插槽并靠表格工具栏右侧展示。仅没有查询组件的实时工作台或详情页在业务确实需要主动重载时，才可保留刷新；仅详情页或工作台在路由明确设置 `showPageHeading: false` 时，才可在正文使用独立详情头。
+- 标准列表页的查询面板与表格面板使用 `ListPageLayout` 保持单一 `16px` 间距，不再叠加页面级 margin、空白操作区或额外容器间距。`DataTable` 必须位于连续的 `surface-panel table-panel` 中，使右侧业务按钮、列设置、表头和分页属于同一表格面板；不得使用 `toolbar-start` 重复显示列表标题、数量或说明，数量统一放在 `pagination-left`。当工具栏只有右侧操作和列设置时使用紧凑高度，不保留空白的左侧标题区域。
+- 操作按钮统一使用 Lucide 图标和固定语义：详情/查看 `Eye`、编辑 `Pencil`、更多 `MoreHorizontal`、新增 `Plus`、删除 `Trash2`、启停 `Power`、刷新 `RefreshCw`、导入 `FileUp`、导出/下载 `Download`、返回 `ArrowLeft`、保存 `Save`、复制 `Copy`。表格高频操作使用“图标 + 文案”，更多操作使用仅图标按钮并提供 `aria-label` 与悬停提示；同一语义不得在不同页面混用其他图标、纯文字按钮或手绘 SVG。危险操作继续使用明确文案、危险色和确认流程，不能只显示图标。
+- 表格单行操作不超过 3 个时全部直接展示“图标 + 文案”；从第 4 个操作开始才使用仅图标的 `MoreHorizontal` 更多菜单，并优先直接保留详情、编辑、下载等高频操作。进入更多菜单的启停、删除等危险操作仍须显示明确文案和危险语义，并沿用原确认流程；不得为了布局方便把仅有 1-3 个操作提前折叠到更多菜单。
 - 优先使用 Element Plus 与现有复用组件；图标使用 Lucide，不用表情符号充当功能图标。
 - 表格、筛选、抽屉和表单应按实际语义覆盖适用的加载、空数据、错误、禁用和无权限状态，不为不适用的组件机械增加状态。
 - 保持键盘可操作、可见焦点、表单标签和足够的颜色对比度；不要只用颜色表达状态。