@agile-team/wl-skills-ui 1.6.10 → 1.6.13

package/CHANGELOG.md

@@ -4,6 +4,27 @@ 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.6.13] - 2026-05-12
+
+### Fixed
+
+- 补强表单输入、选择、日期和文本域的 focus 品牌色边框兼容规则，确保普通 focus 态稳定生效。
+- 补强 Element Plus 必填星号红色显示规则，兼容未显式配置 asterisk 方向的表单场景。
+
+## [1.6.12] - 2026-05-12
+
+### Fixed
+
+- 修复表单 label 单行省略样式覆盖后，必填星号、错误 label、错误提示和错误边框红色态不明显的问题。
+
+## [1.6.11] - 2026-05-11
+
+### Changed
+
+- 优化 BaseToolbar 下拉/分裂按钮组样式，统一高度、圆角、间距和下拉菜单 hover 可读性。
+- 优化 AG Grid 操作列内 `jh-op-*` 操作按钮，取消 active 缩放并提升选中行可读性。
+- 补齐输入控件 focus 品牌色边框、统一圆角、长表单 label 单行省略和弹窗图标居中尺寸规则。
+
 ## [1.6.10] - 2026-05-11
 
 ### Removed

package/README.md

@@ -193,8 +193,13 @@ yarn add @agile-team/wl-skills-ui
 
 ## 版本亮点
 
-当前 v1.6.10 版本继续强化“统一规则源 + 单一事实源 + 项目集群封装必覆盖 + UI 细节精准修复”的闭环，并彻底剔除旧前缀：
+当前 v1.6.13 版本继续强化“统一规则源 + 单一事实源 + 项目集群封装必覆盖 + UI 细节精准修复”的闭环，并补齐销售报价页暴露出的通用 UI 细节：
 
+- 补强输入、选择、日期、文本域 focus 品牌色边框和必填星号红色显示规则，兼容 Element Plus 定制版本差异
+- 修复表单必填星号、错误 label、错误提示和错误边框红色态，避免校验反馈被通用 label/input 样式覆盖
+- 优化 BaseToolbar 下拉/分裂按钮组，让“主动作 + 下拉动作”按一个动作组展示，避免视觉割裂
+- 优化 AG Grid 操作列 `jh-op-*` 图标/胶囊/文字按钮，取消按压缩放抖动，并提升选中行下的可读性
+- 补齐输入控件 focus 品牌色边框、统一圆角、长 label 单行省略和自定义弹窗图标居中尺寸规则
 - 全量移除旧 `wk-` 前缀命名（包名 / CLI / 快照目录 / 豁免配置 / MCP 工具名），不再兼容（详见 CHANGELOG v1.6.10）
 - 新增 `skills/_meta/_compat/vendors.json` 作为 L2 Project Vendors 的单一事实源（id / priority / patterns / baseline / styles），`scanner/coverage.mjs` 启动时一次性编译 RegExp，零运行时开销
 - 新增 `wl-ui add-vendor <tag> [--family <id>] [--dry-run]` 脚手架命令：一键生成专项 SCSS、`@forward` 注册、`vendors.json` baseline 追加、scanner 规则草稿

package/package.json

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

package/styles/vendors/_base-components.scss

@@ -21,6 +21,8 @@
   align-items: center;
   justify-content: center;
   flex-wrap: nowrap;
+  width: 100%;
+    min-width: 0;
 }
 
 // ── 第一层：纯图标按钮（26×26px，hover 变语义色）──────────────────────────
@@ -40,7 +42,9 @@
   flex-shrink: 0;
 
   svg { width: 14px; height: 14px; }
-  &:active { opacity: 0.6; transform: scale(0.92); }
+        &:active {
+          opacity: 0.6;
+        }
 
   // 查看 — hover 蓝
   &.jh-op-view {
@@ -141,7 +145,9 @@
     background: rgba(34, 84, 244, 0.10);
       color: var(--el-color-primary, #2254f4);
   }
-  &:active { opacity: 0.65; transform: scale(0.96); }
+        &:active {
+          opacity: 0.65;
+        }
 }
 
 // ── 第三层：文字按钮（业务专属长名称）────────────────────────────────────────
@@ -193,17 +199,17 @@
       background: var(--el-color-danger) !important;
       color: #fff !important;
     }
-  
+
     &.el-tag--warning {
       background: var(--el-color-warning) !important;
       color: #fff !important;
     }
-  
+
     &.el-tag--success {
       background: var(--el-color-success) !important;
       color: #fff !important;
     }
-  
+
     &.el-tag--info {
       background: var(--el-color-primary) !important;
       color: #fff !important;
@@ -283,22 +289,22 @@
       background: rgba(43, 178, 104, 0.12);
       color: var(--el-color-success);
     }
-  
+
     &--warning {
       background: rgba(234, 154, 19, 0.12);
       color: var(--el-color-warning);
     }
-  
+
     &--danger {
       background: rgba(187, 45, 63, 0.12);
       color: var(--el-color-danger);
     }
-  
+
     &--info {
       background: rgba(34, 84, 244, 0.10);
       color: var(--el-color-primary);
     }
-  
+
     &--default {
       background: rgba(34, 84, 244, 0.10);
       color: var(--el-color-primary);
@@ -329,6 +335,24 @@
   }
 }
 
+.ag-row-selected {
+
+  .jh-op-btn,
+  .jh-op-chip,
+  .jh-op-link {
+    background-color: rgba(255, 255, 255, 0.65);
+    color: var(--el-color-primary, #2254f4);
+  }
+
+  .jh-op-del {
+    color: var(--el-color-danger, #f5222d);
+  }
+
+  .jh-op-edit,
+  .jh-op-ok {
+    color: var(--el-color-success, #2bb268);
+  }
+}
 // ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 // FullScreenDialog — 全屏/关闭按钮尺寸对齐 + 弹窗底部按钮风格
 // ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
@@ -455,6 +479,76 @@
   }
 }
 
+.el-input__wrapper,
+.el-select .el-input__wrapper,
+.el-select__wrapper,
+.el-date-editor.el-input__wrapper,
+.el-textarea__inner {
+  border-radius: 6px !important;
+  transition: box-shadow 0.15s ease, border-color 0.15s ease;
+}
+
+.el-input__wrapper.is-focus,
+.el-input__wrapper:focus-within,
+.el-select__wrapper.is-focus,
+.el-select__wrapper.is-focused,
+.el-select__wrapper:focus-within,
+.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;
+}
+
+.el-form-item__label,
+.base-query-box .el-form-item__label,
+[class*='base-form'] .el-form-item__label {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: keep-all;
+}
+
+.el-form-item.is-required:not(.is-no-asterisk).asterisk-left > .el-form-item__label::before,
+.el-form-item.is-required:not(.is-no-asterisk).asterisk-right>.el-form-item__label::after,
+.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::before,
+.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::after {
+  color: var(--el-color-danger, #f56c6c) !important;
+  display: inline-block !important;
+}
+
+.el-form-item.is-error {
+  .el-form-item__label,
+  .el-form-item__error {
+    color: var(--el-color-danger, #f56c6c) !important;
+  }
+
+  .el-input__wrapper,
+  .el-select__wrapper,
+  .el-date-editor.el-input__wrapper,
+  .el-textarea__inner {
+    box-shadow: 0 0 0 1px var(--el-color-danger, #f56c6c) inset !important;
+  }
+}
+
+.header .svg-icon,
+.el-dialog__header .svg-icon {
+  display: inline-flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  width: 24px !important;
+  height: 24px !important;
+  font-size: 14px !important;
+  line-height: 1 !important;
+  flex: 0 0 24px !important;
+  border-radius: 6px !important;
+  transform: none !important;
+}
+
+.header .svg-icon svg,
+.el-dialog__header .svg-icon svg {
+  width: 14px !important;
+  height: 14px !important;
+}
 // ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 // MenuDivider 分区标题分割线 — 颜色 Token 化
 // ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

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

@@ -262,6 +262,57 @@
   font-weight: 500;
 }
 
+.base-toolbar-box .el-button-group {
+  display: inline-flex !important;
+  align-items: center !important;
+  vertical-align: middle !important;
+
+  .el-button {
+    border-radius: 0 !important;
+    margin: 0 !important;
+  }
+
+  .el-button:first-child {
+    border-top-left-radius: 6px !important;
+    border-bottom-left-radius: 6px !important;
+  }
+
+  .el-button:last-child {
+    border-top-right-radius: 6px !important;
+    border-bottom-right-radius: 6px !important;
+    margin-left: -1px !important;
+  }
+}
+
+.base-toolbar-box .el-dropdown,
+.base-toolbar-box .action-button-wrap .el-dropdown,
+.base-toolbar-box .action-button-wrap .el-button-group {
+  display: inline-flex !important;
+  align-items: center !important;
+  margin: 0 !important;
+}
+
+.el-dropdown-menu .el-dropdown-menu__item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-height: 28px;
+  line-height: 1.3;
+  color: var(--el-text-color-regular, #606266);
+}
+
+.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;
+}
+
+.el-dropdown-menu .el-dropdown-menu__item .el-icon,
+.el-dropdown-menu .el-dropdown-menu__item svg {
+  color: currentColor !important;
+  fill: currentColor;
+  flex: 0 0 auto;
+}
 // ── 弹窗/抽屉底部按钮行 ──────────────────────────────────────────────────────
 .dialog-footer .el-button {
   border-radius: 6px !important;