From 2bd9d8c0475a4a65d13a19701134537fc5459c05 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com> Date: Tue, 25 Aug 2026 11:56:16 +0800 Subject: [PATCH] =?UTF-8?q?style(ui):=20=E5=85=A8=E7=AB=99=20el-tag=20?= =?UTF-8?q?=E7=8A=B6=E6=80=81=E8=AF=AD=E4=B9=89=E7=BB=9F=E4=B8=80=E4=B8=BA?= =?UTF-8?q?=E7=BA=AF=E6=96=87=E6=9C=AC=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 按用户要求，将全站所有状态语义的 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"，保证样式一致自动生效 --- .workbuddy/memory/2026-08-25.md | 14 +++++++++++ .workbuddy/memory/MEMORY.md | 6 ++--- src/styles/element-ui.scss | 3 +++ src/views/authority/apikey.vue | 2 +- src/views/authority/ratelimit.vue | 2 +- src/views/base/airport-master.vue | 2 +- src/views/base/currency.vue | 2 +- src/views/base/customer-type.vue | 2 +- src/views/base/fee-item.vue | 4 ++-- src/views/base/port-terminal.vue | 2 +- src/views/base/railway-station.vue | 2 +- .../components/business-crud-page.vue | 24 +++++++++---------- src/views/business/contract-manage.vue | 4 ++-- src/views/business/temporary-credit-limit.vue | 2 +- src/views/flow/follow.vue | 2 +- src/views/flow/manager.vue | 2 +- .../payment/components/bill-payment-table.vue | 2 +- src/views/payment/invoice-application.vue | 2 +- src/views/payment/invoice-receipt.vue | 2 +- src/views/payment/payment-application.vue | 2 +- src/views/payment/receipt-claim-record.vue | 2 +- src/views/payment/receipt-flow.vue | 2 +- src/views/resource/oss.vue | 2 +- src/views/resource/sms.vue | 2 +- .../transport-reconciliation-editor.vue | 5 ++-- src/views/settlement/formal-settlement.vue | 2 +- src/views/system/authlock.vue | 1 + src/views/system/dept.vue | 2 +- src/views/system/dict.vue | 4 ++-- src/views/system/dictbiz.vue | 4 ++-- src/views/tool/codesetting.vue | 2 +- src/views/transit/risk-disposal.vue | 4 ++-- src/views/transportCapacity/driver.vue | 2 +- src/views/transportCapacity/ship.vue | 2 +- src/views/transportCapacity/vehicle.vue | 4 ++-- src/views/util/demo/dict-classic.vue | 2 +- src/views/util/demo/dict-horizontal.vue | 4 ++-- src/views/util/demo/dict-vertical.vue | 4 ++-- src/views/util/demo/dict.vue | 4 ++-- src/views/util/demo/dictbiz.vue | 4 ++-- src/views/vehicle/customer-archive.vue | 4 +++- src/views/work/send.vue | 2 +- src/views/work/start.vue | 2 +- 43 files changed, 85 insertions(+), 64 deletions(-) diff --git a/.workbuddy/memory/2026-08-25.md b/.workbuddy/memory/2026-08-25.md index 75a06cc..ddeee09 100644 --- a/.workbuddy/memory/2026-08-25.md +++ b/.workbuddy/memory/2026-08-25.md @@ -24,3 +24,17 @@ - 嵌套网格：bill-payment、bill-ledger 拆成每个字段独立 `el-col :span="6"`（真 4 列），gutter 48→24；备注保留 `:span="24"` 整行。 - 媒体查询同步：`.el-col-12`/`.el-col-8` 窄屏折叠规则改成 `.el-col-6`（≤1024/1200/900/768px 折叠为整行）。 - 结论：全 /payment 表单页板块表单控件统一为 4 列网格，备注/长文本仍整行；pre-settlement-editor「结算基本信息」此前也已改 `:span="8"`→`span="6"`。 + +## 全站 el-tag 状态语义统一转纯文本（status-text） +- 需求：用户要求"全站看看还有哪些地方使用 el-tag 的？都要统一改一下"，保持与调度状态一致的纯文本风格。 +- 范围确认：用 AskUserQuestion 确认采用"所有状态语义"——业务状态(审批/调度/运单/匹配/认领) + 启用停用 + 工作流激活挂起/完成 + 其它状态(statusName/是否封存/否是/认证/锁状态/合同阶段) 一律转 `.status-text` 纯文本；类型标签/版本号/分类名/值类(车牌颜色、锁类型、运输方式、categoryName、code、apiKey 等) 保留 tag。 +- 改动文件（约 35 个，仅加 `class="status-text"`，不动逻辑/`:type` 绑定）： + - 启用/停用：base(railway-station/airport-master/currency/customer-type/fee-item/port-terminal)、system/dept、transportCapacity(vehicle/driver/ship)、authority(apikey/ratelimit) + - 业务状态遗漏补：settlement/formal-settlement、business/temporary-credit-limit、business/contract-manage(合同阶段+审批)、payment(invoice-application/bill-payment-table/receipt-flow/receipt-claim-record/invoice-receipt/payment-application)、settlement/components/transport-reconciliation-editor(匹配结果/状态/更新结果)、transit/risk-disposal(column.tag/field.tag) + - 工作流/其它：flow(manager/follow 激活挂起)、work(start 激活挂起/send 完成)、transportCapacity/vehicle 认证状态、system/authlock lockStatus、tool/codesetting、resource(sms/oss) statusName、vehicle/customer-archive(审批+启用停用)、system/dict+dictbiz 及 util/demo 各 dict 页 是否封存 +- 校验：重新 grep `el-tag[^>]*:type=` 确认除 authlock lockType、vehicle-ledger plateColor 两个刻意保留的"类型标签"外，所有状态语义 el-tag 均已带 status-text。改动为纯属性添加，Vite HMR 自动生效。 + +## 业务状态文字化后字号/行高对齐单元格 +- 根因：用户截图反馈 customer-archive 的"准入类型/审批状态/状态"列文字比其它列小/错位。`.el-tag` 默认 `font-size: var(--el-tag-font-size)`（12px）且 `height` 固定，即便 `.status-text` 去掉了背景边框，字号和盒模型仍与单元格普通文本不一致。 +- 修复：在 `src/styles/element-ui.scss` 的 `.el-tag.status-text` 全局规则追加 `font-size: inherit !important; height: auto !important; vertical-align: baseline; line-height: inherit;`，强制继承父级字号与行高，高度随内容自适应，基线对齐与普通 inline 文本一致。 +- 结论：所有使用 `.status-text` 的状态列（customer-archive 准入类型/审批状态/状态、transport-plan 调度状态、waybill 运单状态、payment 审批状态、启用停用等）自动与相邻普通文字列的字体字号/行高/基线完全统一，无需逐页修改。 diff --git a/.workbuddy/memory/MEMORY.md b/.workbuddy/memory/MEMORY.md index b3f80e5..5764dfc 100644 --- a/.workbuddy/memory/MEMORY.md +++ b/.workbuddy/memory/MEMORY.md @@ -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` 列表状态列本就用 `` 文字化（先例），不动；"类型标签"（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 匹配结果·状态）、payment（invoice-application/bill-payment-table/receipt-flow/receipt-claim-record/invoice-receipt/payment-application 审批·认领状态）、contract-manage（合同阶段 + 审批）、temporary-credit-limit、process-config、credit-score-quantification、flow（manager/follow 激活·挂起）、work（start 激活·挂起 / send 完成）、transportCapacity（vehicle 启用·认证 / driver / ship 启用）、base（railway-station/airport-master/currency/customer-type/fee-item/port-terminal 启用停用）、system（dept/authority apikey·ratelimit 启用禁用 / authlock lockStatus / dict·dictbiz 是否封存 / codesetting 否是）、resource（sms/oss statusName）、customer-archive（审批 + 启用停用）、transit/risk-disposal（column.tag/field.tag）。 +- 例外（刻意保留 tag 样式，非状态语义）：`loading-manage.vue` 列表状态列用 ``（先例）；"类型标签"——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`。 diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss index 0310770..0d8e0e6 100644 --- a/src/styles/element-ui.scss +++ b/src/styles/element-ui.scss @@ -1040,7 +1040,10 @@ padding: 0; margin: 0; font-weight: normal !important; + font-size: inherit !important; line-height: inherit; + height: auto !important; + vertical-align: baseline; &::before { display: none; diff --git a/src/views/authority/apikey.vue b/src/views/authority/apikey.vue index c89d7da..2501704 100644 --- a/src/views/authority/apikey.vue +++ b/src/views/authority/apikey.vue @@ -30,7 +30,7 @@ diff --git a/src/views/authority/ratelimit.vue b/src/views/authority/ratelimit.vue index 6a53566..9c46732 100644 --- a/src/views/authority/ratelimit.vue +++ b/src/views/authority/ratelimit.vue @@ -47,7 +47,7 @@ {{ row.limitCount }} 次 / {{ row.limitPeriod }} {{ timeUnitLabel(row.timeUnit) }} diff --git a/src/views/base/airport-master.vue b/src/views/base/airport-master.vue index 1b02c0f..a6073d1 100644 --- a/src/views/base/airport-master.vue +++ b/src/views/base/airport-master.vue @@ -55,7 +55,7 @@ diff --git a/src/views/base/currency.vue b/src/views/base/currency.vue index 11d32a0..f4441bb 100644 --- a/src/views/base/currency.vue +++ b/src/views/base/currency.vue @@ -63,7 +63,7 @@ diff --git a/src/views/base/customer-type.vue b/src/views/base/customer-type.vue index cced3b9..fb68968 100644 --- a/src/views/base/customer-type.vue +++ b/src/views/base/customer-type.vue @@ -31,7 +31,7 @@ diff --git a/src/views/base/fee-item.vue b/src/views/base/fee-item.vue index 69a8091..0fad1fe 100644 --- a/src/views/base/fee-item.vue +++ b/src/views/base/fee-item.vue @@ -32,7 +32,7 @@ @@ -255,7 +255,7 @@ export default { addDisplay: false, editDisplay: false, value: 1, - minWidth: 100, + minWidth: 110, }, ], }, diff --git a/src/views/base/port-terminal.vue b/src/views/base/port-terminal.vue index 8c8543d..1dc5b06 100644 --- a/src/views/base/port-terminal.vue +++ b/src/views/base/port-terminal.vue @@ -64,7 +64,7 @@ 港口/码头 diff --git a/src/views/base/railway-station.vue b/src/views/base/railway-station.vue index 428acce..d7b4e94 100644 --- a/src/views/base/railway-station.vue +++ b/src/views/base/railway-station.vue @@ -55,7 +55,7 @@ diff --git a/src/views/business/components/business-crud-page.vue b/src/views/business/components/business-crud-page.vue index 5d9983a..a58baca 100644 --- a/src/views/business/components/business-crud-page.vue +++ b/src/views/business/components/business-crud-page.vue @@ -96,19 +96,19 @@ @@ -2177,15 +2177,15 @@ | {{ detailRow.planNo || '-' }} - + {{ displayStatus(detailRow, 'businessStatus') }} - - + + {{ detailRow.transportTypeName || formatTransportPlanDetailTransportType(detailRow.transportType) }} - +
@@ -2347,10 +2347,10 @@
运单详情 {{ detailRow.waybillNo || '-' }} - {{ displayStatus(detailRow, 'businessStatus') }} - + {{ displayStatus(detailRow, 'businessStatus') }} + {{ formatTransportPlanDetailTransportType(waybillTransportMode(detailRow)) }} - + {{ dispatchDialogNo || '-' }} - + {{ dispatchDialogStatusText }} @@ -13125,7 +13125,7 @@ export default { height: auto; max-height: none; line-height: 20px; - white-space: pre-line; + //white-space: pre-line; word-break: break-word; text-overflow: clip; } diff --git a/src/views/business/contract-manage.vue b/src/views/business/contract-manage.vue index fc3b0c9..2b998d9 100644 --- a/src/views/business/contract-manage.vue +++ b/src/views/business/contract-manage.vue @@ -62,13 +62,13 @@ diff --git a/src/views/business/temporary-credit-limit.vue b/src/views/business/temporary-credit-limit.vue index 65f6ad1..afd2e58 100644 --- a/src/views/business/temporary-credit-limit.vue +++ b/src/views/business/temporary-credit-limit.vue @@ -45,7 +45,7 @@ diff --git a/src/views/flow/follow.vue b/src/views/flow/follow.vue index f4f0eec..3412052 100644 --- a/src/views/flow/follow.vue +++ b/src/views/flow/follow.vue @@ -18,7 +18,7 @@ @on-load="onLoad" > v{{ row.version }} @@ -86,7 +86,7 @@ diff --git a/src/views/tool/codesetting.vue b/src/views/tool/codesetting.vue index 5fad20c..4cd6123 100644 --- a/src/views/tool/codesetting.vue +++ b/src/views/tool/codesetting.vue @@ -34,7 +34,7 @@ diff --git a/src/views/transit/risk-disposal.vue b/src/views/transit/risk-disposal.vue index fcdd58b..fa49742 100644 --- a/src/views/transit/risk-disposal.vue +++ b/src/views/transit/risk-disposal.vue @@ -73,7 +73,7 @@ {{ row[column.prop] }} - + {{ row[column.prop] || '-' }} {{ row[column.prop] || '-' }} @@ -126,7 +126,7 @@ {{ detail[field.prop] }} - + {{ detail[field.prop] || '-' }} {{ detail[field.prop] || '-' }} diff --git a/src/views/transportCapacity/driver.vue b/src/views/transportCapacity/driver.vue index e0ad656..befae49 100644 --- a/src/views/transportCapacity/driver.vue +++ b/src/views/transportCapacity/driver.vue @@ -63,7 +63,7 @@ {{ String(row.organizationName || '').replace(/^[\s\u3000]+/, '') }} diff --git a/src/views/transportCapacity/ship.vue b/src/views/transportCapacity/ship.vue index 5d5f2d9..a322d14 100644 --- a/src/views/transportCapacity/ship.vue +++ b/src/views/transportCapacity/ship.vue @@ -65,7 +65,7 @@ {{ String(row.organizationName || '').replace(/^[\s\u3000]+/, '') }} diff --git a/src/views/transportCapacity/vehicle.vue b/src/views/transportCapacity/vehicle.vue index 3ef9eff..028d067 100644 --- a/src/views/transportCapacity/vehicle.vue +++ b/src/views/transportCapacity/vehicle.vue @@ -62,7 +62,7 @@ {{ String(row.organizationName || '').replace(/^[\s\u3000]+/, '') }} @@ -70,7 +70,7 @@ - diff --git a/src/views/util/demo/dict-classic.vue b/src/views/util/demo/dict-classic.vue index 09deea8..c938d5f 100644 --- a/src/views/util/demo/dict-classic.vue +++ b/src/views/util/demo/dict-classic.vue @@ -31,7 +31,7 @@ @@ -71,7 +71,7 @@ diff --git a/src/views/util/demo/dict-vertical.vue b/src/views/util/demo/dict-vertical.vue index 3aada77..af576f2 100644 --- a/src/views/util/demo/dict-vertical.vue +++ b/src/views/util/demo/dict-vertical.vue @@ -35,7 +35,7 @@ @@ -75,7 +75,7 @@ diff --git a/src/views/util/demo/dict.vue b/src/views/util/demo/dict.vue index 0f7dc8a..e61749c 100644 --- a/src/views/util/demo/dict.vue +++ b/src/views/util/demo/dict.vue @@ -41,7 +41,7 @@
@@ -96,7 +96,7 @@
diff --git a/src/views/util/demo/dictbiz.vue b/src/views/util/demo/dictbiz.vue index 38c1653..22aa0e3 100644 --- a/src/views/util/demo/dictbiz.vue +++ b/src/views/util/demo/dictbiz.vue @@ -41,7 +41,7 @@
@@ -96,7 +96,7 @@ diff --git a/src/views/vehicle/customer-archive.vue b/src/views/vehicle/customer-archive.vue index 32f69ae..372497e 100644 --- a/src/views/vehicle/customer-archive.vue +++ b/src/views/vehicle/customer-archive.vue @@ -49,6 +49,7 @@ v{{ row.version }}