@agile-team/wl-skills-ui 1.9.0 → 1.9.1

package/CHANGELOG.md

@@ -4,6 +4,15 @@ All notable changes to **@agile-team/wl-skills-ui** will be documented in this f
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 
+## [1.9.1] - 2026-07-20
+
+### Fixed
+
+- 按《烟台华新数智化信息化改造项目 UI 规范 v1》纠正主色色阶：常规 `#002A8F`、悬停 `#1A3F9A`、点击 `#002681`、禁用 `#B2BFDD`，不再把 PPT 元数据中的 `#2254F4` 当作业务按钮主色。
+- 新增 Element Plus 主按钮四态强覆盖；BaseQuery/BaseToolbar 查询与主操作按钮的 hover 从旧 `primary-light-3` 改为客户规范 `primary-light-1`。
+- 所有 vendor 半透明主色效果统一读取 `--el-color-primary-rgb`，清除 SCSS 中旧亮蓝 RGB 和 fallback，避免 token 已改但阴影、选中态仍有色差。
+- 同步颜色规范、Design Token Skill、README 和发布产物；发布校验新增客户主色色阶与旧亮蓝残留检查。
+
 ## [1.9.0] - 2026-07-18
 
 ### Added

package/README.md

@@ -62,6 +62,7 @@ wl-skills-ui/
 ├── styles/                       # L1+L2+L3 SCSS 实现
 │   ├── tokens/                   # SCSS 变量映射层（$wk-* → CSS 变量）
 │   ├── element/                  # L1 Element Plus 控件对齐
+│   │   ├── _button.scss           # 主按钮四态强覆盖（设计规范色阶）
 │   │   ├── _table.scss
 │   │   ├── _form.scss
 │   │   ├── _dialog.scss
@@ -199,7 +200,7 @@ yarn add @agile-team/wl-skills-ui
 |---|---|---|
 | `element-plus` | **`2.2.6-prod.3`** | 集团 jh- 定制版；EP 2.3.0 起引入 `.el-input__wrapper`，与 jh-ui 3.x 不兼容 |
 | `@jhlc/jh-ui` | **`3.1.0`** | SCSS 皮肤包，`.com-text` label 包裹 + `.has-colon` 冒号注入（wl-skills-ui 已统一屏蔽表单冒号） |
-| `@agile-team/wl-skills-ui` | `^1.9.0` | 已对齐上述组合的 DOM 假设 |
+| `@agile-team/wl-skills-ui` | `^1.9.1` | 已对齐上述组合的 DOM 假设与客户主色色阶 |
 
 三种识别方式，任选其一：
 
@@ -213,7 +214,13 @@ yarn add @agile-team/wl-skills-ui
 
 ## 版本亮点
 
-当前 v1.9.0：
+当前 v1.9.1：
+
+- **客户主色纠偏**：严格按《烟台华新数智化信息化改造项目 UI 规范 v1》统一主色为 `#002A8F`，并同步完整深浅色阶。
+- **按钮四态强覆盖**：主按钮常规 `#002A8F`、悬停 `#1A3F9A`、点击 `#002681`、禁用 `#B2BFDD`；`html body` 高特异性和填充按钮 `!important` 抵御 Element Plus、jh-ui 与旧业务皮肤覆盖。
+- **单源防漂移**：主色半透明场景统一读取 `--el-color-primary-rgb`，发布校验会阻断 token、SCSS、按钮状态或文档重新漂移到旧亮蓝。
+
+上一版 v1.9.0：
 
 - **独立闭环**：不依赖 kit/design/bd 即可安装、审计、修复、复检、快照和回退；存在 kit 的 page-spec 时只复用页面模式与组件命名约定，不形成运行时硬依赖。
 - **CLI 真实一致**：统一入口正式支持 `audit/drift/exempt/snapshot`，未知命令非零退出，`audit --refresh-baseline` 可维护增量治理基线。
@@ -230,8 +237,8 @@ yarn add @agile-team/wl-skills-ui
 
 上一版 v1.8.15：
 
-- **jh-drag-row 上下分栏手柄覆盖**：新增 `styles/vendors/_jh-drag-row.scss`，补齐此前缺失的 `jh-drag-row`（上下/主从表）手柄覆盖，与 `_jh-drag-col.scss`（左右）同源风格。以本包主色 `#2254f4` 为准，用 `!important` 确定性层叠压过 common-core 组件 Props 默认值
-- **平台包职责澄清**：`@jhlc/jh-ui` 是纯 SCSS 包（零组件），所有 `jh-*`/`Base*`/`C_*` 组件来自 `@jhlc/common-core`。本包作为化妆层精准层叠覆盖二者视觉，不改平台层源码——L0 token 用 `:root body` 压过 jh-ui 编译产物的 `:root`（`#2254f4` > jh-ui `#4368ff`），L2 直接写目标属性 + `!important` 绕过组件 `var()` 引用。**项目装了本包后，一切以本包为准**
+- **jh-drag-row 上下分栏手柄覆盖**：新增 `styles/vendors/_jh-drag-row.scss`，补齐此前缺失的 `jh-drag-row`（上下/主从表）手柄覆盖，与 `_jh-drag-col.scss`（左右）同源风格。手柄颜色统一跟随 `--el-color-primary`，不再保留独立色值
+- **平台包职责澄清**：`@jhlc/jh-ui` 是纯 SCSS 包（零组件），所有 `jh-*`/`Base*`/`C_*` 组件来自 `@jhlc/common-core`。本包作为化妆层精准层叠覆盖二者视觉，不改平台层源码——L0 token 用 `:root body` 压过 jh-ui 编译产物的 `:root`，L2 直接写目标属性 + `!important` 绕过组件 `var()` 引用。**项目装了本包后，一切以本包为准**
 
 上一版 v1.8.14：
 
@@ -642,7 +649,7 @@ export const myRules = [
 | 字号 | [design/spec/typography.md](design/spec/typography.md) |
 | 间距 | [design/spec/spacing.md](design/spec/spacing.md)       |
 
-主色：`#4368ff` → `--el-color-primary`（与 Element Plus 默认蓝对齐）
+客户规范主色：`#002a8f` → `--el-color-primary`；业务代码只引用 token，不直接硬编码色值。
 
 ---
 

package/SKILL.md

@@ -282,7 +282,7 @@ npx wl-ui check --project [项目根目录]
 - background: #fb2323;
 + background: var(--el-color-danger);
 ```
-**已覆盖颜色**：`#409eff/#3a7afe/#4368ff`→primary，`#fb2323/#f56c6c`→danger，`#0cc859/#67c23a`→success，`#ffaf27/#e6a23c`→warning，`#ecf5ff`→primary-light-9
+**已覆盖颜色**：`#409eff/#3a7afe/#4368ff/#2254f4/#002a8f`→primary，`#fb2323/#f56c6c/#bb2d3f`→danger，`#0cc859/#67c23a/#2bb268`→success，`#ffaf27/#e6a23c/#ea9a13`→warning，`#ecf5ff/#e5eaf4`→primary-light-9
 
 #### R017 — 编号/工号/证件号列缺少 renderBadge【高危】
 **检测**：`columnsDef()` / `columns` 数组中，label 含“编号”“工号”“证件号”但没有 `renderBadge` / `defaultSlot`（脚本式列定义）

package/design/spec/color.md

@@ -2,14 +2,29 @@
 
 ## 品牌色系
 
-| Token                        | 值        | 用途                       |
-| ---------------------------- | --------- | -------------------------- |
-| `--el-color-primary`         | `#4368ff` | 主色调：按钮、链接、激活态 |
-| `--el-color-primary-light-9` | `#f0f3ff` | 主色浅底：Tag 背景         |
-| `--el-color-success`         | `#0cc859` | 成功/正常/启用状态         |
-| `--el-color-warning`         | `#ffaf27` | 警告/待处理状态            |
-| `--el-color-danger`          | `#FB2323` | 危险/失败/停用状态         |
-| `--el-color-info`            | `#909399` | 中性/辅助信息              |
+> 单一依据：《烟台华新数智化信息化改造项目 UI 规范 v1》“颜色-主色/功能色”页。
+
+| Token                         | 值              | 用途                         |
+| ----------------------------- | --------------- | ---------------------------- |
+| `--el-color-primary`          | `#002a8f`       | 主按钮常规、链接、选中态     |
+| `--el-color-primary-rgb`      | `0, 42, 143`    | 主色透明背景、阴影和选中底色 |
+| `--el-color-primary-light-1`  | `#1a3f9a`       | 主按钮悬停                   |
+| `--el-color-primary-light-2`  | `#3355a5`       | 柔和主题蓝                   |
+| `--el-color-primary-light-3`  | `#4d6ab1`       | 辅助高亮                     |
+| `--el-color-primary-light-4`  | `#667fbc`       | 辅助高亮                     |
+| `--el-color-primary-light-5`  | `#8094c7`       | 主色边框                     |
+| `--el-color-primary-light-6`  | `#99aad2`       | 浅色辅助                     |
+| `--el-color-primary-light-7`  | `#b2bfdd`       | 主按钮禁用                   |
+| `--el-color-primary-light-8`  | `#ccd4e9`       | 浅色辅助                     |
+| `--el-color-primary-light-9`  | `#e5eaf4`       | 浅色/白底悬浮                |
+| `--el-color-primary-dark-1`   | `#002681`       | 主按钮点击                   |
+| `--el-color-primary-dark-2`   | `#002272`       | 深色辅助                     |
+| `--el-color-primary-dark-3`   | `#001d64`       | 深色辅助                     |
+| `--el-color-primary-dark-4`   | `#001956`       | 最深品牌蓝                   |
+| `--el-color-success`          | `#2bb268`       | 成功/正常/启用状态           |
+| `--el-color-warning`          | `#ea9a13`       | 警告/待处理状态              |
+| `--el-color-danger`           | `#bb2d3f`       | 危险/失败/停用状态           |
+| `--el-color-info`             | `#909399`       | 中性/辅助信息                |
 
 ## 文本色系
 

package/design/tokens/base.css

@@ -1,18 +1,19 @@
 :root body {
-  --el-color-primary: #2254f4;
-    --el-color-primary-light-1: #3865f5;
-    --el-color-primary-light-2: #5178f6;
-    --el-color-primary-light-3: #7a98f8;
-    --el-color-primary-light-4: #91aaf9;
-    --el-color-primary-light-5: #a8bbfa;
-    --el-color-primary-light-6: #bfccfc;
-    --el-color-primary-light-7: #d3ddfd;
-    --el-color-primary-light-8: #e6ebfe;
-    --el-color-primary-light-9: #f2f5ff;
-    --el-color-primary-dark-1: #1b43c3;
-    --el-color-primary-dark-2: #1738a3;
-    --el-color-primary-dark-3: #102873;
-    --el-color-primary-dark-4: #0a1a4d;
+  --el-color-primary: #002a8f;
+  --el-color-primary-rgb: 0, 42, 143;
+  --el-color-primary-light-1: #1a3f9a;
+  --el-color-primary-light-2: #3355a5;
+  --el-color-primary-light-3: #4d6ab1;
+  --el-color-primary-light-4: #667fbc;
+  --el-color-primary-light-5: #8094c7;
+  --el-color-primary-light-6: #99aad2;
+  --el-color-primary-light-7: #b2bfdd;
+  --el-color-primary-light-8: #ccd4e9;
+  --el-color-primary-light-9: #e5eaf4;
+  --el-color-primary-dark-1: #002681;
+  --el-color-primary-dark-2: #002272;
+  --el-color-primary-dark-3: #001d64;
+  --el-color-primary-dark-4: #001956;
     --el-color-success: #2bb268;
     --el-color-success-light-1: #40ba77;
     --el-color-success-light-2: #55c286;

package/dist/tokens.css

@@ -1,18 +1,19 @@
 :root body {
-  --el-color-primary: #2254f4;
-    --el-color-primary-light-1: #3865f5;
-    --el-color-primary-light-2: #5178f6;
-    --el-color-primary-light-3: #7a98f8;
-    --el-color-primary-light-4: #91aaf9;
-    --el-color-primary-light-5: #a8bbfa;
-    --el-color-primary-light-6: #bfccfc;
-    --el-color-primary-light-7: #d3ddfd;
-    --el-color-primary-light-8: #e6ebfe;
-    --el-color-primary-light-9: #f2f5ff;
-    --el-color-primary-dark-1: #1b43c3;
-    --el-color-primary-dark-2: #1738a3;
-    --el-color-primary-dark-3: #102873;
-    --el-color-primary-dark-4: #0a1a4d;
+  --el-color-primary: #002a8f;
+  --el-color-primary-rgb: 0, 42, 143;
+  --el-color-primary-light-1: #1a3f9a;
+  --el-color-primary-light-2: #3355a5;
+  --el-color-primary-light-3: #4d6ab1;
+  --el-color-primary-light-4: #667fbc;
+  --el-color-primary-light-5: #8094c7;
+  --el-color-primary-light-6: #99aad2;
+  --el-color-primary-light-7: #b2bfdd;
+  --el-color-primary-light-8: #ccd4e9;
+  --el-color-primary-light-9: #e5eaf4;
+  --el-color-primary-dark-1: #002681;
+  --el-color-primary-dark-2: #002272;
+  --el-color-primary-dark-3: #001d64;
+  --el-color-primary-dark-4: #001956;
     --el-color-success: #2bb268;
     --el-color-success-light-1: #40ba77;
     --el-color-success-light-2: #55c286;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agile-team/wl-skills-ui",
-  "version": "1.9.0",
+  "version": "1.9.1",
   "description": "企业级 UI 风格对齐框架 — Vue + Element Plus 项目通用化妆/原生双模式（tokens / element / vendors / layouts / runtime / scanner / fixer / skills）",
   "type": "module",
   "main": "./es/index.js",

package/scanner/rules/_shared.mjs

@@ -118,7 +118,21 @@ export const TOKEN_MAP = {
   "#409eff": "var(--el-color-primary)",
   "#3a7afe": "var(--el-color-primary)",
   "#4368ff": "var(--el-color-primary)",
+  "#2254f4": "var(--el-color-primary)",
   "#002a8f": "var(--el-color-primary)",
+  "#1a3f9a": "var(--el-color-primary-light-1)",
+  "#3355a5": "var(--el-color-primary-light-2)",
+  "#4d6ab1": "var(--el-color-primary-light-3)",
+  "#667fbc": "var(--el-color-primary-light-4)",
+  "#8094c7": "var(--el-color-primary-light-5)",
+  "#99aad2": "var(--el-color-primary-light-6)",
+  "#b2bfdd": "var(--el-color-primary-light-7)",
+  "#ccd4e9": "var(--el-color-primary-light-8)",
+  "#e5eaf4": "var(--el-color-primary-light-9)",
+  "#002681": "var(--el-color-primary-dark-1)",
+  "#002272": "var(--el-color-primary-dark-2)",
+  "#001d64": "var(--el-color-primary-dark-3)",
+  "#001956": "var(--el-color-primary-dark-4)",
   "#1890ff": "var(--el-color-primary)",
   "#fb2323": "var(--el-color-danger)",
   "#f56c6c": "var(--el-color-danger)",
@@ -127,8 +141,10 @@ export const TOKEN_MAP = {
   "#0cc859": "var(--el-color-success)",
   "#67c23a": "var(--el-color-success)",
   "#52c41a": "var(--el-color-success)",
+  "#2bb268": "var(--el-color-success)",
   "#ffaf27": "var(--el-color-warning)",
   "#e6a23c": "var(--el-color-warning)",
   "#faad14": "var(--el-color-warning)",
+  "#ea9a13": "var(--el-color-warning)",
   "#ecf5ff": "var(--el-color-primary-light-9)",
 };

package/skills/runtime/design-tokens/SKILL.md

@@ -18,11 +18,14 @@ applyTo: "**/*.{vue,scss,css}"
 ### 品牌色
 
 ```css
---el-color-primary        /* #4368ff — 主色：按钮/链接/激活 */
---el-color-primary-light-9 /* #f0f3ff — 主色浅底：Tag背景 */
---el-color-success        /* #0cc859 — 成功/正常/启用 */
---el-color-warning        /* #ffaf27 — 警告/待处理 */
---el-color-danger         /* #FB2323 — 危险/失败/停用 */
+--el-color-primary         /* #002a8f — 主按钮常规/链接/选中 */
+--el-color-primary-light-1 /* #1a3f9a — 主按钮悬停 */
+--el-color-primary-dark-1  /* #002681 — 主按钮点击 */
+--el-color-primary-light-7 /* #b2bfdd — 主按钮禁用 */
+--el-color-primary-light-9 /* #e5eaf4 — 主色浅底/Tag背景 */
+--el-color-success         /* #2bb268 — 成功/正常/启用 */
+--el-color-warning         /* #ea9a13 — 警告/待处理 */
+--el-color-danger          /* #bb2d3f — 危险/失败/停用 */
 --el-color-info           /* #909399 — 中性/辅助 */
 ```
 
@@ -81,7 +84,7 @@ npx wl-ui fix --target src
 
 | hex                           | → CSS Token                       |
 | ----------------------------- | --------------------------------- |
-| `#409eff` `#3a7afe` `#4368ff` | `var(--el-color-primary)`         |
+| `#409eff` `#3a7afe` `#4368ff` `#2254f4` `#002a8f` | `var(--el-color-primary)`         |
 | `#fb2323` `#f56c6c`           | `var(--el-color-danger)`          |
 | `#0cc859` `#67c23a`           | `var(--el-color-success)`         |
 | `#ffaf27` `#e6a23c`           | `var(--el-color-warning)`         |

package/standards/ui/02-button.md

@@ -8,6 +8,15 @@
 
 ### 类型规则
 
+主按钮色值严格遵循客户 UI 规范，禁止使用 `#2254F4`、`#4368FF` 或 Element Plus 默认蓝替代：
+
+| 状态 | Token | 规范色值 |
+|---|---|---|
+| 常规 | `--el-color-primary` | `#002A8F` |
+| hover / focus | `--el-color-primary-light-1` | `#1A3F9A` |
+| active / 点击 | `--el-color-primary-dark-1` | `#002681` |
+| disabled | `--el-color-primary-light-7` | `#B2BFDD` |
+
 | 操作语义   | type        | plain  | 说明           |
 |----------|-------------|--------|----------------|
 | 新增/添加 | `primary`   | false  | 蓝色填充        |

package/styles/element/_button.scss

@@ -0,0 +1,39 @@
+// Element Plus 主按钮 — 严格对齐《烟台华新数智化信息化改造项目 UI 规范 v1》
+// 常规 #002A8F / 悬停 #1A3F9A / 点击 #002681 / 禁用 #B2BFDD。
+// 使用 html body 提升 token 覆盖特异性；填充按钮同时以 !important 抵御 jh-ui/业务旧皮肤硬编码。
+
+html body .el-button--primary {
+  --el-button-bg-color: var(--el-color-primary);
+  --el-button-border-color: var(--el-color-primary);
+  --el-button-hover-bg-color: var(--el-color-primary-light-1);
+  --el-button-hover-border-color: var(--el-color-primary-light-1);
+  --el-button-active-color: var(--el-color-primary-dark-1);
+  --el-button-active-bg-color: var(--el-color-primary-dark-1);
+  --el-button-active-border-color: var(--el-color-primary-dark-1);
+  --el-button-disabled-bg-color: var(--el-color-primary-light-7);
+  --el-button-disabled-border-color: var(--el-color-primary-light-7);
+  --el-button-outline-color: var(--el-color-primary-light-5);
+}
+
+html body
+  .el-button.el-button--primary:not(.is-link):not(.is-text):not(.is-plain):not(.is-disabled) {
+  background-color: var(--el-color-primary) !important;
+  border-color: var(--el-color-primary) !important;
+
+  &:hover,
+  &:focus {
+    background-color: var(--el-color-primary-light-1) !important;
+    border-color: var(--el-color-primary-light-1) !important;
+  }
+
+  &:active {
+    background-color: var(--el-color-primary-dark-1) !important;
+    border-color: var(--el-color-primary-dark-1) !important;
+  }
+}
+
+html body
+  .el-button.el-button--primary.is-disabled:not(.is-link):not(.is-text):not(.is-plain) {
+  background-color: var(--el-color-primary-light-7) !important;
+  border-color: var(--el-color-primary-light-7) !important;
+}

package/styles/element/_upload.scss

@@ -8,8 +8,8 @@ html body .el-upload {
 
   .el-upload-dragger:hover,
   .el-upload-dragger.is-dragover {
-    border-color: var(--el-color-primary, #2254f4);
-    background: var(--el-color-primary-light-9, #f2f5ff);
+    border-color: var(--el-color-primary, #002a8f);
+    background: var(--el-color-primary-light-9, #e5eaf4);
   }
 
   .el-upload__tip {

package/styles/element/index.scss

@@ -1,6 +1,7 @@
 // styles/element/index.scss — Element Plus 覆盖层汇总
 // 前置：design/tokens/base.css 必须最先在 index.html 中加载
 
+@forward './button';
 @forward './pagination';
 @forward './form';
 @forward './table';

package/styles/presets/security.scss

@@ -13,20 +13,21 @@
 @forward '../vendors/index';
 
 :root body {
-  --el-color-primary: #2254f4;
-    --el-color-primary-light-1: #3865f5;
-    --el-color-primary-light-2: #5178f6;
-    --el-color-primary-light-3: #7a98f8;
-    --el-color-primary-light-4: #91aaf9;
-    --el-color-primary-light-5: #a8bbfa;
-    --el-color-primary-light-6: #bfccfc;
-    --el-color-primary-light-7: #d3ddfd;
-    --el-color-primary-light-8: #e6ebfe;
-    --el-color-primary-light-9: #f2f5ff;
-    --el-color-primary-dark-1: #1b43c3;
-    --el-color-primary-dark-2: #1738a3;
-    --el-color-primary-dark-3: #102873;
-    --el-color-primary-dark-4: #0a1a4d;
+  --el-color-primary: #002a8f;
+  --el-color-primary-rgb: 0, 42, 143;
+  --el-color-primary-light-1: #1a3f9a;
+  --el-color-primary-light-2: #3355a5;
+  --el-color-primary-light-3: #4d6ab1;
+  --el-color-primary-light-4: #667fbc;
+  --el-color-primary-light-5: #8094c7;
+  --el-color-primary-light-6: #99aad2;
+  --el-color-primary-light-7: #b2bfdd;
+  --el-color-primary-light-8: #ccd4e9;
+  --el-color-primary-light-9: #e5eaf4;
+  --el-color-primary-dark-1: #002681;
+  --el-color-primary-dark-2: #002272;
+  --el-color-primary-dark-3: #001d64;
+  --el-color-primary-dark-4: #001956;
 
   --el-color-danger: #bb2d3f;
   --el-color-danger-light-3: #d16b78;

package/styles/tokens/index.scss

@@ -85,20 +85,21 @@ $wk-sidebar-width: var(--el-sidebar-width) !default;
 // 选择器 :root body 特异性 (0,1,1) > Element Plus 的 :root (0,1,0)，
 // 保证无论 CSS 加载顺序如何，我们的变量始终优先。
 :root body {
-  --el-color-primary: #2254f4;
-  --el-color-primary-light-1: #3865f5;
-  --el-color-primary-light-2: #5178f6;
-  --el-color-primary-light-3: #7a98f8;
-  --el-color-primary-light-4: #91aaf9;
-  --el-color-primary-light-5: #a8bbfa;
-  --el-color-primary-light-6: #bfccfc;
-  --el-color-primary-light-7: #d3ddfd;
-  --el-color-primary-light-8: #e6ebfe;
-  --el-color-primary-light-9: #f2f5ff;
-  --el-color-primary-dark-1: #1b43c3;
-  --el-color-primary-dark-2: #1738a3;
-  --el-color-primary-dark-3: #102873;
-  --el-color-primary-dark-4: #0a1a4d;
+  --el-color-primary: #002a8f;
+  --el-color-primary-rgb: 0, 42, 143;
+  --el-color-primary-light-1: #1a3f9a;
+  --el-color-primary-light-2: #3355a5;
+  --el-color-primary-light-3: #4d6ab1;
+  --el-color-primary-light-4: #667fbc;
+  --el-color-primary-light-5: #8094c7;
+  --el-color-primary-light-6: #99aad2;
+  --el-color-primary-light-7: #b2bfdd;
+  --el-color-primary-light-8: #ccd4e9;
+  --el-color-primary-light-9: #e5eaf4;
+  --el-color-primary-dark-1: #002681;
+  --el-color-primary-dark-2: #002272;
+  --el-color-primary-dark-3: #001d64;
+  --el-color-primary-dark-4: #001956;
   --el-color-success: #2bb268;
   --el-color-success-light-1: #40ba77;
   --el-color-success-light-2: #55c286;

package/styles/vendors/_ag-grid.scss

@@ -12,9 +12,9 @@
   --ag-header-foreground-color: #374151;
   --ag-border-color: rgba(0, 0, 0, 0.06);
     --ag-row-border-color: rgba(0, 0, 0, 0.06);
-    --ag-row-hover-color: rgba(34, 84, 244, 0.06);
-    --ag-selected-row-background-color: rgba(34, 84, 244, 0.10);
-    --ag-range-selection-border-color: rgba(34, 84, 244, 0.4);
+    --ag-row-hover-color: rgba(var(--el-color-primary-rgb), 0.06);
+    --ag-selected-row-background-color: rgba(var(--el-color-primary-rgb), 0.10);
+    --ag-range-selection-border-color: rgba(var(--el-color-primary-rgb), 0.4);
   --ag-font-size: 13px;
   --ag-font-family: inherit;
   --ag-row-height: 26px;
@@ -98,11 +98,11 @@
 
 .ag-row:hover,
 .ag-row.ag-row-hover {
-  background-color: rgba(34, 84, 244, 0.06) !important;
+  background-color: rgba(var(--el-color-primary-rgb), 0.06) !important;
 }
 
 .ag-row.ag-row-selected {
-  background-color: rgba(34, 84, 244, 0.10) !important;
+  background-color: rgba(var(--el-color-primary-rgb), 0.10) !important;
 }
 
 // ── 单元格 ────────────────────────────────────────────────────────────────────
@@ -266,9 +266,9 @@
   height: 12px;
   // 三个点用 box-shadow 模拟
   width: 36px;
-  background: radial-gradient(circle at 6px 6px, #2254f4 3.5px, transparent 3.5px),
-      radial-gradient(circle at 18px 6px, #2254f4 3.5px, transparent 3.5px),
-      radial-gradient(circle at 30px 6px, #2254f4 3.5px, transparent 3.5px);
+  background: radial-gradient(circle at 6px 6px, var(--el-color-primary) 3.5px, transparent 3.5px),
+      radial-gradient(circle at 18px 6px, var(--el-color-primary) 3.5px, transparent 3.5px),
+      radial-gradient(circle at 30px 6px, var(--el-color-primary) 3.5px, transparent 3.5px);
   animation: ag-dot-bounce 1.2s ease-in-out infinite;
   opacity: 0.7;
 }

package/styles/vendors/_base-components.scss

@@ -38,7 +38,7 @@
   outline: none;
   border: none;
   background: transparent;
-  color: var(--el-color-primary-light-2, #5178f6);
+  color: var(--el-color-primary-light-2, #3355a5);
   transition: background-color 0.13s ease, color 0.13s ease;
   flex-shrink: 0;
 
@@ -49,7 +49,7 @@
   &.jh-op-view {
     &:hover:not(:disabled) {
         color: var(--el-color-primary);
-        background: rgba(34, 84, 244, 0.09);
+        background: rgba(var(--el-color-primary-rgb), 0.09);
       }
   }
   // 编辑 — hover 翠绿
@@ -70,7 +70,7 @@
   &.jh-op-log {
     &:hover:not(:disabled) {
         color: var(--el-color-primary);
-        background: rgba(34, 84, 244, 0.09);
+        background: rgba(var(--el-color-primary-rgb), 0.09);
       }
   }
   // 审核 — hover 翠绿
@@ -83,8 +83,8 @@
   // 提交 — hover 主色
   &.jh-op-send {
     &:hover:not(:disabled) {
-        color: var(--el-color-primary, #2254f4);
-        background: rgba(34, 84, 244, 0.09);
+        color: var(--el-color-primary, #002a8f);
+        background: rgba(var(--el-color-primary-rgb), 0.09);
       }
   }
   // 保存（内联表格用）— hover 翠绿
@@ -139,8 +139,8 @@
 
   svg { width: 12px; height: 12px; flex-shrink: 0; }
   &:hover:not(:disabled) {
-    background: rgba(34, 84, 244, 0.10);
-      color: var(--el-color-primary, #2254f4);
+    background: rgba(var(--el-color-primary-rgb), 0.10);
+      color: var(--el-color-primary, #002a8f);
   }
   &:active:not(:disabled) { opacity: 0.65; }
   &:disabled {
@@ -163,7 +163,7 @@
   border-radius: 4px;
   border: none;
   background: transparent;
-  color: var(--el-color-primary, #2254f4);
+  color: var(--el-color-primary, #002a8f);
   font-size: 12px;
   font-weight: 500;
   cursor: pointer;
@@ -174,8 +174,8 @@
   flex-shrink: 0;
 
   &:hover:not(:disabled) {
-    background: rgba(34, 84, 244, 0.08);
-      color: var(--el-color-primary, #2254f4);
+    background: rgba(var(--el-color-primary-rgb), 0.08);
+      color: var(--el-color-primary, #002a8f);
   }
   &:active:not(:disabled) { opacity: 0.55; }
   &:disabled {
@@ -248,14 +248,14 @@
 .jh-riskno-badge {
   display: inline-block;
   padding: 2px 6px;
-  background: rgba(34, 84, 244, 0.08);
+  background: rgba(var(--el-color-primary-rgb), 0.08);
     color: var(--el-color-primary);
   border-radius: 4px;
   font-family: 'SFMono-Regular', 'Consolas', 'Monaco', monospace;
   font-size: 11.5px;
   font-weight: 600;
   letter-spacing: 0.03em;
-  border: 1px solid rgba(34, 84, 244, 0.18);
+  border: 1px solid rgba(var(--el-color-primary-rgb), 0.18);
   white-space: nowrap;
   max-width: 100%;
   overflow: hidden;
@@ -308,12 +308,12 @@
     }
 
     &--info {
-      background: rgba(34, 84, 244, 0.10);
+      background: rgba(var(--el-color-primary-rgb), 0.10);
       color: var(--el-color-primary);
     }
 
     &--default {
-      background: rgba(34, 84, 244, 0.10);
+      background: rgba(var(--el-color-primary-rgb), 0.10);
       color: var(--el-color-primary);
     }
 }
@@ -328,7 +328,7 @@
   transition: background-color 0.15s, color 0.15s;
 
   &:not(.el-button--danger):hover {
-    background-color: rgba(34, 84, 244, 0.08) !important;
+    background-color: rgba(var(--el-color-primary-rgb), 0.08) !important;
     color: var(--el-color-primary) !important;
   }
 }
@@ -401,7 +401,7 @@
       &:hover {
         border-color: var(--el-color-primary);
         color: var(--el-color-primary);
-        background: rgba(34, 84, 244, 0.04);
+        background: rgba(var(--el-color-primary-rgb), 0.04);
       }
     }
   }
@@ -437,7 +437,7 @@
       &:hover {
         border-color: var(--el-color-primary) !important;
         color: var(--el-color-primary) !important;
-        background: rgba(34, 84, 244, 0.04) !important;
+        background: rgba(var(--el-color-primary-rgb), 0.04) !important;
       }
     }
   }
@@ -460,7 +460,7 @@
     }
     &:focus {
       border-color: var(--el-color-primary) !important;
-      box-shadow: 0 0 0 2px rgba(34, 84, 244, 0.12) !important;
+      box-shadow: 0 0 0 2px rgba(var(--el-color-primary-rgb), 0.12) !important;
     }
   }
 
@@ -493,7 +493,7 @@
 .el-date-editor.el-input__wrapper.is-focus,
 .el-date-editor.el-input__wrapper:focus-within,
 .el-textarea__inner:focus {
-  box-shadow: 0 0 0 1.5px var(--el-color-primary, #2254f4) inset !important;
+  box-shadow: 0 0 0 1.5px var(--el-color-primary, #002a8f) inset !important;
 }
 
 .el-form-item__label,

package/styles/vendors/_base-query-toolbar.scss

@@ -95,15 +95,15 @@
     line-height: 1 !important;
     padding: 0 10px !important;
     font-size: 12px !important;
-    background-color: var(--el-color-primary, #2254f4) !important;
-      border-color: var(--el-color-primary, #2254f4) !important;
+    background-color: var(--el-color-primary, #002a8f) !important;
+      border-color: var(--el-color-primary, #002a8f) !important;
     color: #ffffff !important;
     transition: background-color 0.15s, box-shadow 0.15s;
 
     &:hover {
-      background-color: var(--el-color-primary-light-3, #7a98f8) !important;
-        border-color: var(--el-color-primary-light-3, #7a98f8) !important;
-      box-shadow: 0 2px 8px rgba(34, 84, 244, 0.25);
+      background-color: var(--el-color-primary-light-1, #1a3f9a) !important;
+        border-color: var(--el-color-primary-light-1, #1a3f9a) !important;
+      box-shadow: 0 2px 8px rgba(var(--el-color-primary-rgb), 0.25);
     }
     &:active { opacity: 0.85; }
   }
@@ -123,7 +123,7 @@
     &:hover {
       color: var(--el-color-primary) !important;
       border-color: var(--el-color-primary-light-5) !important;
-      background-color: rgba(34, 84, 244, 0.04) !important;
+      background-color: rgba(var(--el-color-primary-rgb), 0.04) !important;
     }
   }
 }
@@ -178,14 +178,14 @@
 
     // ── 主操作：填充蓝（新增/新建/申请）─────────────────────────────────
     &.el-button--primary {
-      background-color: var(--el-color-primary, #2254f4) !important;
-        border-color: var(--el-color-primary, #2254f4) !important;
+      background-color: var(--el-color-primary, #002a8f) !important;
+        border-color: var(--el-color-primary, #002a8f) !important;
       color: #ffffff !important;
 
       &:hover {
-        background-color: var(--el-color-primary-light-3, #7a98f8) !important;
-          border-color: var(--el-color-primary-light-3, #7a98f8) !important;
-        box-shadow: 0 2px 8px rgba(34, 84, 244, 0.28);
+        background-color: var(--el-color-primary-light-1, #1a3f9a) !important;
+          border-color: var(--el-color-primary-light-1, #1a3f9a) !important;
+        box-shadow: 0 2px 8px rgba(var(--el-color-primary-rgb), 0.28);
       }
       &:active { opacity: 0.85; }
     }
@@ -225,7 +225,7 @@
       &:hover {
         color: var(--el-color-primary) !important;
         border-color: var(--el-color-primary-light-5) !important;
-        background-color: rgba(34, 84, 244, 0.04) !important;
+        background-color: rgba(var(--el-color-primary-rgb), 0.04) !important;
       }
     }
 
@@ -312,8 +312,8 @@
 
 .el-dropdown-menu .el-dropdown-menu__item:hover,
 .el-dropdown-menu .el-dropdown-menu__item:focus {
-  color: var(--el-color-primary, #2254f4) !important;
-  background-color: rgba(34, 84, 244, 0.08) !important;
+  color: var(--el-color-primary, #002a8f) !important;
+  background-color: rgba(var(--el-color-primary-rgb), 0.08) !important;
 }
 
 .el-dropdown-menu .el-dropdown-menu__item .el-icon,

package/styles/vendors/_jh-drag-col.scss

@@ -38,10 +38,10 @@ html .drag-col-container > .slider-col {
   &:hover {
     background: linear-gradient(
       to right,
-      rgba(34, 84, 244, 0.06) 3px,
+      rgba(var(--el-color-primary-rgb), 0.06) 3px,
       var(--el-color-primary) 3px,
       var(--el-color-primary) 7px,
-      rgba(34, 84, 244, 0.06) 7px
+      rgba(var(--el-color-primary-rgb), 0.06) 7px
     ) !important;
 
     &::after {
@@ -54,10 +54,10 @@ html .drag-col-container > .slider-col {
   &:active {
     background: linear-gradient(
       to right,
-      rgba(34, 84, 244, 0.1) 2.5px,
+      rgba(var(--el-color-primary-rgb), 0.1) 2.5px,
       var(--el-color-primary) 2.5px,
       var(--el-color-primary) 7.5px,
-      rgba(34, 84, 244, 0.1) 7.5px
+      rgba(var(--el-color-primary-rgb), 0.1) 7.5px
     ) !important;
   }
 }

package/styles/vendors/_jh-drag-row.scss

@@ -47,10 +47,10 @@ html .drager_row > .slider_row {
   &:hover {
     background: linear-gradient(
       to bottom,
-      rgba(34, 84, 244, 0.06) 3px,
+      rgba(var(--el-color-primary-rgb), 0.06) 3px,
       var(--el-color-primary) 3px,
       var(--el-color-primary) 7px,
-      rgba(34, 84, 244, 0.06) 7px
+      rgba(var(--el-color-primary-rgb), 0.06) 7px
     ) !important;
 
     &::after {
@@ -63,10 +63,10 @@ html .drager_row > .slider_row {
   &:active {
     background: linear-gradient(
       to bottom,
-      rgba(34, 84, 244, 0.1) 2.5px,
+      rgba(var(--el-color-primary-rgb), 0.1) 2.5px,
       var(--el-color-primary) 2.5px,
       var(--el-color-primary) 7.5px,
-      rgba(34, 84, 244, 0.1) 7.5px
+      rgba(var(--el-color-primary-rgb), 0.1) 7.5px
     ) !important;
   }
 }

package/styles/vendors/_jh-pagination.scss

@@ -17,7 +17,7 @@
 
     &:hover {
       color: var(--el-color-primary) !important;
-      background-color: rgba(34, 84, 244, 0.06) !important;
+      background-color: rgba(var(--el-color-primary-rgb), 0.06) !important;
     }
 
     // 当前页 → 品牌蓝填充
@@ -49,7 +49,7 @@
 
     &:hover:not(:disabled) {
       color: var(--el-color-primary) !important;
-      background-color: rgba(34, 84, 244, 0.06) !important;
+      background-color: rgba(var(--el-color-primary-rgb), 0.06) !important;
     }
 
     &:disabled { opacity: 0.4; cursor: not-allowed; }

package/styles/vendors/_jh-tree.scss

@@ -89,7 +89,7 @@
 
   // ── Hover（非选中行）──────────────────────────────────────────────────────
   &:hover {
-    background-color: rgba(34, 84, 244, 0.07) !important;
+    background-color: rgba(var(--el-color-primary-rgb), 0.07) !important;
 
     &::before { transform: translateY(-50%) scale(1); opacity: 0.55; }
 
@@ -113,7 +113,7 @@
 
 // ── 选中状态 ──────────────────────────────────────────────────────────────────
 .drag-left .el-tree-node.is-current > .el-tree-node__content {
-  background-color: rgba(34, 84, 244, 0.10) !important;
+  background-color: rgba(var(--el-color-primary-rgb), 0.10) !important;
   box-shadow: inset 3px 0 0 var(--el-color-primary) !important;
   font-weight: 500;
   color: var(--el-color-primary) !important;
@@ -147,7 +147,7 @@
 
   // hover 时加深一点
     &:hover {
-      background-color: rgba(34, 84, 244, 0.15) !important;
+      background-color: rgba(var(--el-color-primary-rgb), 0.15) !important;
     }
 }
 

package/styles/vendors/_jh-ui.scss

@@ -107,8 +107,8 @@ html body .el-select .el-input > .el-input__inner {
 .el-select .el-input.is-focus > .el-input__inner,
 .el-date-editor.is-focus > .el-input__inner,
 .el-date-editor .el-input.is-focus > .el-input__inner {
-  border-color: var(--el-color-primary, #2254f4) !important;
-  box-shadow: 0 0 0 1px var(--el-color-primary, #2254f4) inset;
+  border-color: var(--el-color-primary, #002a8f) !important;
+  box-shadow: 0 0 0 1px var(--el-color-primary, #002a8f) inset;
 }
 
 // 4) error 红色边框（兼容 EP 2.2.x DOM；

package/styles/vendors/_portal.scss

@@ -8,8 +8,8 @@
 // 主背景：双径向渐变替换纯灰
 html body .portal-main {
   background:
-    radial-gradient(ellipse at 15% 0%, rgba(34, 84, 244, 0.09) 0%, transparent 45%),
-      radial-gradient(ellipse at 85% 85%, rgba(122, 152, 248, 0.07) 0%, transparent 45%),
+    radial-gradient(ellipse at 15% 0%, rgba(var(--el-color-primary-rgb), 0.09) 0%, transparent 45%),
+      radial-gradient(ellipse at 85% 85%, rgba(var(--el-color-primary-rgb), 0.05) 0%, transparent 45%),
     #eef0f8 !important;
 }
 
@@ -18,13 +18,13 @@ html body .portal-header {
   background: rgba(255, 255, 255, 0.88) !important;
   backdrop-filter: blur(12px) !important;
   -webkit-backdrop-filter: blur(12px) !important;
-  box-shadow: 0 1px 16px rgba(34, 84, 244, 0.08) !important;
-    border-bottom: 1px solid rgba(34, 84, 244, 0.07) !important;
+  box-shadow: 0 1px 16px rgba(var(--el-color-primary-rgb), 0.08) !important;
+    border-bottom: 1px solid rgba(var(--el-color-primary-rgb), 0.07) !important;
 }
 
 // 平台标题：蓝紫渐变文字
 html body .portal-text {
-  background: linear-gradient(135deg, #2254f4 0%, #7a98f8 100%) !important;
+  background: linear-gradient(135deg, var(--el-color-primary) 0%, var(--el-color-primary-light-3) 100%) !important;
   -webkit-background-clip: text !important;
   -webkit-text-fill-color: transparent !important;
   background-clip: text !important;
@@ -35,7 +35,7 @@ html body .portal-text {
 html body .portal-bg {
   border-radius: 14px !important;
   overflow: hidden !important;
-  box-shadow: 0 8px 32px rgba(34, 84, 244, 0.12) !important;
+  box-shadow: 0 8px 32px rgba(var(--el-color-primary-rgb), 0.12) !important;
 }
 
 // 综合待办卡片：玻璃质感
@@ -44,21 +44,21 @@ html body .portal-zh {
   backdrop-filter: blur(20px) !important;
   -webkit-backdrop-filter: blur(20px) !important;
   border-radius: 14px !important;
-  border: 1px solid rgba(34, 84, 244, 0.12) !important;
-    box-shadow: 0 8px 32px rgba(34, 84, 244, 0.1) !important;
+  border: 1px solid rgba(var(--el-color-primary-rgb), 0.12) !important;
+    box-shadow: 0 8px 32px rgba(var(--el-color-primary-rgb), 0.1) !important;
   overflow: hidden !important;
 }
 
 // 通知待办 Tab 激活下划线
 html body .portal-tabs .el-tabs__active-bar {
-  background: linear-gradient(90deg, #2254f4 0%, #7a98f8 100%) !important;
+  background: linear-gradient(90deg, var(--el-color-primary) 0%, var(--el-color-primary-light-3) 100%) !important;
 }
 html body .portal-tabs .el-tabs__item.is-active {
-  color: #2254f4 !important;
+  color: var(--el-color-primary) !important;
   font-weight: 600 !important;
 }
 html body .portal-tabs .el-tabs__item:hover {
-  color: #2254f4 !important;
+  color: var(--el-color-primary) !important;
 }
 
 // 子系统区域卡片：玻璃质感
@@ -68,8 +68,8 @@ html body .portal-mainMiddle {
   backdrop-filter: blur(20px) !important;
   -webkit-backdrop-filter: blur(20px) !important;
   border-radius: 14px !important;
-  border: 1px solid rgba(34, 84, 244, 0.12) !important;
-    box-shadow: 0 8px 32px rgba(34, 84, 244, 0.1) !important;
+  border: 1px solid rgba(var(--el-color-primary-rgb), 0.12) !important;
+    box-shadow: 0 8px 32px rgba(var(--el-color-primary-rgb), 0.1) !important;
   overflow: hidden !important;
 }
 
@@ -83,14 +83,14 @@ html body .portal-childrenSystem {
   }
 
   &:hover .children-name {
-    color: var(--el-color-primary, #2254f4) !important;
+    color: var(--el-color-primary, #002a8f) !important;
     font-weight: 600 !important;
   }
 }
 
 // 区块标题左竖线：蓝紫渐变
 html body .portal-line {
-  background: linear-gradient(180deg, #2254f4 0%, #7a98f8 100%) !important;
+  background: linear-gradient(180deg, var(--el-color-primary) 0%, var(--el-color-primary-light-3) 100%) !important;
   border-radius: 2px !important;
 }
 
@@ -102,7 +102,7 @@ html body .portal-font {
 
 // 消息数量角标：主色背景
 html body .portal-tabs-label .num {
-  background: var(--el-color-primary, #2254f4) !important;
+  background: var(--el-color-primary, #002a8f) !important;
   color: #fff !important;
   border-radius: 10px !important;
   font-weight: 600 !important;
@@ -110,5 +110,5 @@ html body .portal-tabs-label .num {
 
 // 消息行 hover
 html body .portal-tabs-row:hover {
-  color: var(--el-color-primary, #2254f4) !important;
+  color: var(--el-color-primary, #002a8f) !important;
 }