style(ui): 全站 el-tag 状态语义统一为纯文本样式

- 按用户要求,将全站所有状态语义的 el-tag 加入 class="status-text"
- 覆盖范围包括业务状态、启用停用、工作流状态、是否封存等多达 35 余处文件
- 保留 el-tag 的 :type 绑定,仅通过样式隐藏背景边框及圆点,变为纯文本呈现
- 修正 .status-text 的 font-size、line-height、height、vertical-align,确保字体和单元格普通文本完全对齐
- 例外保留原样式的标签类型有类型标签、值类字段等,未受影响
- 更新 element-ui.scss 添加 .el-tag.status-text 的全局统一样式
- 相关模板中均添加了 class="status-text",保证样式一致自动生效
This commit is contained in:
2026-08-25 11:56:16 +08:00
parent 01c3bb5b57
commit 2bd9d8c047
43 changed files with 85 additions and 64 deletions
+3 -3
View File
@@ -41,10 +41,10 @@
### 业务状态标签文字化:全局 `.status-text` 工具类
- 需求:全站"调度状态/运单状态/审批状态"等用 `el-tag` 展示的字段,统一改为**普通文字,不带颜色、不显示 tag 背景/边框/圆点**。
- 实现:`element-ui.scss` 末尾 `.el-tag.status-text { background:transparent!important; border-color:transparent!important; color:var(--el-text-color-regular)!important; padding:0; margin:0; font-weight:normal!important }`,并隐藏 `&::before` 圆点。`el-tag``:type` 继续保留在模板中(无需改动),但颜色已被全局 CSS 强制覆盖为正文色
- 实现:`element-ui.scss` 末尾 `.el-tag.status-text { background:transparent!important; border-color:transparent!important; color:var(--el-text-color-regular)!important; padding:0; margin:0; font-weight:normal!important; font-size:inherit!important; height:auto!important; vertical-align:baseline; line-height:inherit }`,并隐藏 `&::before` 圆点。`el-tag``:type` 继续保留在模板中(无需改动),但颜色/字号/行高已被全局 CSS 强制覆盖为与单元格普通文本一致
- 用法:业务状态 `el-tag``class="status-text"`
- 已覆盖:`business-crud-page.vue`#status/#businessStatus/#approvalStatus 插槽 + 运输计划详情头 + 运单详情头 + 调度弹窗头)、`master-order.vue`/`master-order-detail.vue`/`master-order-dispatch.vue` 的 businessStatus、`loading-manage.vue` 详情弹窗、结算三处 approvalStatus、`process-config.vue` 流程状态、`credit-score-quantification.vue` 状态列
- 例外:`loading-manage.vue` 列表状态列本就`<span class="loading-manage-page__status is-${status}">` 文字化(先例),不动"类型标签"transport-flow-tag、transportTypeName`type="primary"`)非状态语义,保持 tag 样式
- **全站统一完成(2026-08-25**:所有"状态语义"的 el-tag 均已加 `class="status-text"` 转纯文本,含:business-crud-page#status/#businessStatus/#approvalStatus + 调度弹窗头)、master-order 系列、loading-manage 详情、结算(settlement-adjustment/pre-settlement/formal-settlement/formal-settlement-table-panel/transport-reconciliation-editor 匹配结果·状态)、paymentinvoice-application/bill-payment-table/receipt-flow/receipt-claim-record/invoice-receipt/payment-application 审批·认领状态)、contract-manage(合同阶段 + 审批)、temporary-credit-limit、process-config、credit-score-quantification、flowmanager/follow 激活·挂起)、workstart 激活·挂起 / send 完成)、transportCapacityvehicle 启用·认证 / driver / ship 启用)、baserailway-station/airport-master/currency/customer-type/fee-item/port-terminal 启用停用)、systemdept/authority apikey·ratelimit 启用禁用 / authlock lockStatus / dict·dictbiz 是否封存 / codesetting 否是)、resourcesms/oss statusName)、customer-archive(审批 + 启用停用)、transit/risk-disposalcolumn.tag/field.tag
- 例外(刻意保留 tag 样式,非状态语义)`loading-manage.vue` 列表状态列用 `<span class="loading-manage-page__status is-${status}">`(先例);"类型标签"——transport-flow-tag、transportTypeName、business-crud-page:3252 运输方式、loading-manage:399 运输方式 warning、authlock lockType(锁类型)、vehicle-ledger plateColor/businessRelation、cron-editor、以及 categoryName/version/code/tenantId/roleName/deptName/apiKey/remoteIp/env/tableName/method/recordLevel/pattern/modelTable/fileSize/node.tags 等"值/标签/提示"类。注:customer-archive 准入类型原在例外中,2026-08-25 用户要求也转纯文本(已加 status-text
## 关键文件
- 分组白卡:`src/components/section-card/main.vue`