From f5a8fe5f780176fba450292376d9f2c3471462fd Mon Sep 17 00:00:00 2001 From: ouyangxq <775153912@qq.com> Date: Tue, 27 Oct 2026 16:55:36 +0800 Subject: [PATCH] docs(admin): clarify finance cards and detail spacing --- Admin高密度界面规范.md | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/Admin高密度界面规范.md b/Admin高密度界面规范.md index 6d26b9c..0f0aa54 100644 --- a/Admin高密度界面规范.md +++ b/Admin高密度界面规范.md @@ -88,7 +88,9 @@ - 已接入标准列表的行操作采用纯文字：无描边、填充或装饰图标，400 字重，普通操作蓝色、危险操作红色、禁用灰色、悬停无下划线。`RowActions` 用 `text-actions`；手写按钮组用 `row-actions density-actions admin-text-actions`，危险语义通过 `data-tone="danger"` 或 `type="danger"` 显式指定。统一外观由 `adminTextActions.css` 维护，不再沿用早期国内仓描边行按钮。顶部、查询及弹框提交按钮按各自用途保留，不机械套用行操作外观；尚未接入的消费者在本轮明确范围内再调整。 - 列宽按实际编号、状态和按钮数量决定，核对长编号、最多按钮、加载与权限变化；不把样板操作列宽套给所有列表。数值列右对齐，单位优先放表头；保留横向滚动、列偏好、分页和行内编辑。 - 标准 DataTable 沿用默认灰白斑马纹，不由页面显式关闭；行底色复用 `--admin-row-stripe`，悬停行、当前行及悬停单元格由 Element 状态样式处理，父表底色不穿透子表。 +- 表格与分页交界只画一条底线：Element Plus 的 `el-table__inner-wrapper::before` 保留，紧邻该表格的 DataTable 分页不再叠加上边框；自定义结果区域仍保留原分页分隔线。不全局隐藏表格底线，避免空表和无分页表格缺边。 - `appearance="integrated"` 保留原组件组合能力，不再表示搜索与表格必须相连。样式维护在 DataTable 和公共 CSS，不为接入样式切换业务模式。 +- 详情内的充值申请、账户流水等连续表格同样使用 `workbench-table is-page-surface` 去掉 DataTable 外壳的重复边框、圆角和阴影，保留表格本体边线、横向滚动和分页。筛选放在 DataTable 的 `filters` 插槽时，接入 `appearance="integrated"`，由筛选容器独占边框与底色；内部 QueryToolbar 不再绘制第二层边框或阴影。优先复用这些公共入口，不在页面追加隐藏边框的覆盖规则。 #### 公共列表能力 @@ -119,6 +121,7 @@ Admin 仍使用 Element Plus。普通 `el-select` 由构建组件解析器统一 ### 费用、汇总与测量 - 汇总使用单行摘要或紧凑描述表。自动费用与其他费用保持各自业务口径，金额、单价、计费量、附加费和版本完整展示。 +- 客户资金账户详情采用已确认的六项紧凑金额卡片，复用公共 `workbench-metric is-compact` 外观；保留授信有效期、到期和负余额状态。导出流水与充值、扣款、授信操作集中在详情页头，流水区不再单独设置导出工具栏。结算单应收／应付详情同样使用三项紧凑金额卡片展示应收／应付、已收／已付、未结余额，到期日保留在基本信息中。以上为已确认的详情页例外，不推广到其他详情。 - 保留公式、计费依据和价格来源入口，不能为了减少行数合并不同口径的金额或重量。 - 测量各来源保留独立分组；展开时在表尾显示合计，折叠时在标题显示摘要，同一口径不在上下重复占位。 - 测量作业弹框采用用户确认的分区配色：申报与实测对比白色（`#fff`）、客户申报明细浅蓝（`#f7f9ff`）、平台实测箱规白色（`#fff`），保留细边框和 8px 圆角，不使用左侧强调色条，作为连续白底规则的局部例外。区块不得使用负外边距伸出正文；左右内边距由 `measurementDensity.css` 统一维护，通用密度规则不得将其清零。保持 1560px、92vh 居中作业弹框及原有业务分组，各区按当前确认配色呈现，不恢复已移除的绿色背景。 三个分区同级排列，客户申报不得嵌套在实测大框内。箱数、毛重、体积集中在“指标／客户申报／平台实测／差异（实测 − 申报）”表中，不在下方重复总数；未采集显示“未测量／待测量”，申报缺失显示“—”，相等显示“一致”。净重、材积重单独显示平台事实，不与申报毛重混比。 客户申报区保持只读；实际品名和预计托数放在“平台实测箱规”区，沿用原保存与权限规则。未采集时只保留主状态，有箱规和来源后显示采集来源；平台补充数据的口径说明通过提示展示。提交按钮旁显示当前订单状态、缺少测量或称重等实际阻断原因。 桌面布局中，对比区标题与客户、渠道、状态同排；申报区标题与原单据号码同排，标签和值横向排列；实测箱规标题、实际品名、预计托数及录入操作共享一行。长内容自然换行，不截断编号或缩小字号。提交阻断原因集中在固定底栏，正文不重复显示同一提示，业务状态、偏差和冲突提醒保留。 @@ -285,6 +288,12 @@ Admin 仍使用 Element Plus。普通 `el-select` 由构建组件解析器统一 详情主容器的 `workbench-panel.is-page-surface` 在屏幕展示时不再叠加 padding，即使同时有 `is-compact` 也由外层页面或业务分区提供唯一一层留白。独立预装／装柜清单详情和货柜内的清单页签按此规则接入；内部独立紧凑卡片仍为 14px，普通卡片仍为 20px。该规则排除 `AdminPage` 页根并仅用于屏幕，不覆盖页面原有 12px 或打印内距。 +财务详情通过 `financeDensity.css` 的 `finance-density-detail` 统一收敛：账户、费用来源、对账单和结算单的页头、摘要、正文及底栏在屏幕上不重复增加左右内边距，由外层 `AdminPage` 提供。嵌套 `AdminPage` 必须使用 `admin-workbench is-embedded`；区块纵向间距、金额卡片、描述表单元格和筛选控件的内部留白保留，打印内距不变。 + +国内／海外托盘、整柜业务、应收款统计和应收／应付结算单的顶部统计卡片独立置于列表工具栏与筛选区上方。卡片网格与紧随其后的 DataTable 工具栏之间外层 `gap` 为 `0`，留白由工具栏已有的上下 padding 与最小高度提供，不能再叠加 6px 或默认页面间距；卡片之间的网格间距独立保留。此规则仅适用于这类直接相邻结构，不清零普通业务分区或筛选区与表格之间的间距。 + +间距和边框核对必须包含公共组件编译后的 scoped 选择器、模块规则、断点及加载顺序。显式接入规则应有稳定的优先级，不能仅凭源码出现 `gap: 0` 或 `padding: 0` 就判断已生效；自动合同检查与实际截图核对分别报告，不用 `!important` 或负外边距掩盖重复容器。 + ### 公共样式接入 页面直接导入 `@/styles/adminWorkbench.css`，保留原有密度入口，并在实际页面根容器增加 `admin-workbench`。不依赖先打开样板页后残留的 CSS，不将主题放入全局入口，不修改 `:root`。导航、顶栏、页签由总控在各自容器显式接入，不给包含业务页面的 `.app-shell` 或 `.app-main` 添加主题类；业务页和 Teleport 浮层仍须自己接入。