优化
This commit is contained in:
@@ -54,6 +54,8 @@
|
||||
|
||||
整页主体是一块连续白底,不再额外套一圈边框、圆角和阴影。包住主要列表的 `workbench-table`/`workbench-toolbar` 或整页详情 `workbench-panel` 显式增加 `is-page-surface`;内部指标、图表、并列独立面板继续保留细边框,表格单元格、表头和操作分隔线也保留。不能通过清除全部 `border` 把卡片、控件和表格边界一起抹掉。
|
||||
|
||||
详情主容器的 `workbench-panel.is-page-surface` 在屏幕展示时不再叠加 padding,即使同时有 `is-compact` 也由外层页面或业务分区提供唯一一层留白。独立预装/装柜清单详情和货柜内的清单页签按此规则接入;内部独立紧凑卡片仍为 14px,普通卡片仍为 20px。该规则排除 `AdminPage` 页根并仅用于屏幕,不覆盖页面原有 12px 或打印内距。
|
||||
|
||||
主列表不要叠加“重复路由标题行 → 分类页签行 → 按钮行”。有同级分类/状态页签时,将原页签移入 DataTable 的 `toolbar-start`,原按钮留在 `toolbar-actions`/`toolbar-end`,筛选留在 `filters`;页签使用 `workbench-list-tabs` 清除重复外框和内边距。无页签时保留紧凑标题与按钮行。真实业务子分区、统计数量、加载失败与当前范围继续保留,不因减高消失。工具栏与筛选共用 `--workbench-list-inset`,页面不再额外增加左右偏移;表格单元格仍由原密度规范管理。
|
||||
|
||||
## 信息层级与渐进披露
|
||||
@@ -108,7 +110,7 @@ import '@/styles/adminWorkbench.css'
|
||||
| 面板与提示 | `workbench-panel`、`workbench-notice`、`workbench-skeleton`;紧凑/自带头部面板使用 `is-compact`/`is-flush` |
|
||||
| 图表与空态 | `workbench-chart`、`workbench-chart-heading`、`workbench-chart-title`、`workbench-chart-actions`、`workbench-chart-canvas`、`workbench-chart-empty`、`workbench-chart-empty-icon` |
|
||||
| 标准列表 | **外层 `div.workbench-table` 包裹 DataTable**,统一外框、表头、边框、行悬停和分页强调;不修改业务列宽或行密度 |
|
||||
| 整页主要内容 | 主要列表的 `workbench-table`/`workbench-toolbar`、整页详情的 `workbench-panel` 增加 `is-page-surface`,去掉整页外框、圆角和阴影;主表顶部同时使用公共紧凑高度与左右边界,内部卡片与子表格不自动套用 |
|
||||
| 整页主要内容 | 主要列表的 `workbench-table`/`workbench-toolbar`、整页详情的 `workbench-panel` 增加 `is-page-surface`,去掉整页外框、圆角和阴影;详情主容器的屏幕 padding 为 0,保留页面根及内部卡片内距;主表顶部同时使用公共紧凑高度与左右边界,子表格不自动套用 |
|
||||
| 嵌入完整页面 | 仅在嵌入调用上加 `is-embedded`,清除内层 AdminPage 的重复内距;独立路由不加 |
|
||||
| 独立查询区 | QueryToolbar 自身添加 `workbench-query`,保留原控件宽高、内边距及换行;位于 DataTable 集成筛选区时保持连续表面,不重复套卡片 |
|
||||
| 列表页签与操作 | 页签放 `toolbar-start` 并加 `workbench-list-tabs`,按钮保留原操作插槽;标准主表统一 48px 最小工具栏、32px 控件,无需销量页专属紧凑类。保留自动换行与键盘切换,嵌套表格、详情和弹框不继承该布局 |
|
||||
|
||||
Reference in New Issue
Block a user