@agile-team/wl-skills-ui 1.6.2 → 1.6.3

package/package.json

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

package/skills/element/el-table/SKILL.md

@@ -33,6 +33,8 @@ applyTo: "**/*.vue"
 + <el-table :data="list" empty-text="暂无数据">
 ```
 
+修复空状态时不要猜测固定高度；应先识别当前表格的真实内容区域（含主表、子表、弹窗表格、展开行内嵌套表格），保证空态在对应表格自身区域内水平/垂直居中，空态图标、文字比例保持同一套视觉规范。若业务页面存在树筛选、组织机构、标签页等上下文，仅在能从 DOM/文案/变量中确认存在时才补充对应提示，不要硬写“左侧选择组织机构”等不一定存在的描述。
+
 ---
 
 ## R003 — BaseTable 必须 `empty-text="暂无数据"` 【中危】

package/skills/vendors/base-table/SKILL.md

@@ -37,6 +37,11 @@ applyTo: "**/*.vue"
 - 操作列按钮 `type="primary"` → 改为 `link` + `is-text`
 - 内联 hex → CSS 变量
 
+### 空状态智能修复
+- 主表、子表、展开行内表格都必须在各自表格区域内居中，不要用全页面或父表高度推断子表位置
+- 保持同一套空态图标和文字比例，不要因为嵌套表格另起一套尺寸风格
+- 文案根据实际上下文判断：只有确认存在组织树/左侧机构筛选时，才提示选择组织机构；否则使用“调整筛选条件”等通用描述
+
 ### B 类（建议人工确认）
 - 替换为 `defineColumns(...)` 渲染（迁移到 L4 runtime，业务代码大幅精简）
 

package/styles/element/_feedback.scss

@@ -2,8 +2,8 @@ html body .el-empty {
   --el-empty-padding: 32px 0;
 
   .el-empty__description p {
-    color: var(--el-text-color-secondary);
-    font-size: var(--el-font-size-base);
+    color: var(--el-text-color-secondary, #909399);
+      font-size: var(--el-font-size-base, 14px);
   }
 
   .el-empty__bottom {
@@ -15,38 +15,38 @@ html body .el-alert {
   border-radius: 8px;
 
   .el-alert__title {
-    font-weight: var(--el-font-weight-medium);
+    font-weight: var(--el-font-weight-medium, 500);
   }
 
   .el-alert__description {
-    color: var(--el-text-color-regular);
+    color: var(--el-text-color-regular, #606266);
   }
 }
 
 html body .el-badge {
   .el-badge__content {
-    border-color: var(--el-fill-color-blank);
-    box-shadow: var(--el-box-shadow);
+    border-color: var(--el-fill-color-blank, #ffffff);
+      box-shadow: var(--el-box-shadow, 0 0 12px rgba(0, 0, 0, 0.12));
   }
 }
 
 html body .el-result {
   .el-result__title p {
-    color: var(--el-text-color-primary);
-    font-weight: var(--el-font-weight-medium);
+    color: var(--el-text-color-primary, #303133);
+      font-weight: var(--el-font-weight-medium, 500);
   }
 
   .el-result__subtitle p {
-    color: var(--el-text-color-secondary);
+    color: var(--el-text-color-secondary, #909399);
   }
 }
 
 html body .el-timeline {
   .el-timeline-item__timestamp {
-    color: var(--el-text-color-secondary);
+    color: var(--el-text-color-secondary, #909399);
   }
 
   .el-timeline-item__content {
-    color: var(--el-text-color-regular);
+    color: var(--el-text-color-regular, #606266);
   }
 }

package/styles/element/_table.scss

@@ -4,10 +4,28 @@
 html .el-table {
   .el-table__header-wrapper th,
   .el-table__fixed-header-wrapper th {
-    color: var(--el-text-color-primary);
-    background: var(--el-fill-color-lighter);
+    color: var(--el-text-color-primary, #303133);
+    background: var(--el-fill-color-lighter, #fafafa);
   }
+
   .el-table__header tr {
-    --el-table-tr-bg-color: var(--el-fill-color-lighter);
+    --el-table-tr-bg-color: var(--el-fill-color-lighter, #fafafa);
+  }
+
+  .el-table__empty-block {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100% !important;
+  }
+
+  .el-table__empty-text {
+    width: 100%;
+    line-height: 1.5;
+  }
+
+  .el-empty {
+    width: 100%;
+    margin: 0 auto;
   }
-}
+}

package/styles/vendors/_ag-grid.scss

@@ -150,6 +150,7 @@
 
 // ── 空数据占位 ────────────────────────────────────────────────────────────────
 .ag-overlay-no-rows-wrapper {
+  --wk-empty-hint: '未找到匹配数据，请调整筛选条件后重试';
   display: flex !important;
   flex-direction: column !important;
   align-items: center !important;
@@ -169,10 +170,10 @@
   }
 
   &::after {
-    content: '请尝试调整筛选条件或在左侧选择组织机构';
+    content: var(--wk-empty-hint);
     display: block;
     font-size: 12px;
-    color: #B0B7C3;
+    color: var(--el-text-color-placeholder, #B0B7C3);
     margin-top: 6px;
     letter-spacing: 0.01em;
   }
@@ -181,7 +182,7 @@
 .ag-overlay-no-rows-center {
   font-size: 14px;
   font-weight: 500;
-  color: #374151;
+  color: var(--el-text-color-primary, #374151);
   letter-spacing: 0.02em;
 }
 

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

@@ -86,14 +86,14 @@
     line-height: 1 !important;
     padding: 0 10px !important;
     font-size: 12px !important;
-    background-color: var(--el-color-primary) !important;
-    border-color: var(--el-color-primary) !important;
+    background-color: var(--el-color-primary, #2254f4) !important;
+      border-color: var(--el-color-primary, #2254f4) !important;
     color: #ffffff !important;
     transition: background-color 0.15s, box-shadow 0.15s;
 
     &:hover {
-      background-color: var(--el-color-primary-light-3) !important;
-      border-color: var(--el-color-primary-light-3) !important;
+      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);
     }
     &:active { opacity: 0.85; }
@@ -169,13 +169,13 @@
 
     // ── 主操作：填充蓝（新增/新建/申请）─────────────────────────────────
     &.el-button--primary {
-      background-color: var(--el-color-primary) !important;
-      border-color: var(--el-color-primary) !important;
+      background-color: var(--el-color-primary, #2254f4) !important;
+        border-color: var(--el-color-primary, #2254f4) !important;
       color: #ffffff !important;
 
       &:hover {
-        background-color: var(--el-color-primary-light-3) !important;
-        border-color: var(--el-color-primary-light-3) !important;
+        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);
       }
       &:active { opacity: 0.85; }
@@ -183,13 +183,13 @@
 
     // ── 危险操作：填充红（删除/作废/驳回）───────────────────────────────
     &.el-button--danger {
-      background-color: var(--el-color-danger) !important;
-      border-color: var(--el-color-danger) !important;
+      background-color: var(--el-color-danger, #f5222d) !important;
+        border-color: var(--el-color-danger, #f5222d) !important;
       color: #ffffff !important;
 
       &:hover {
-        background-color: var(--el-color-danger-light-3) !important;
-        border-color: var(--el-color-danger-light-3) !important;
+        background-color: var(--el-color-danger-light-3, #f56c6c) !important;
+          border-color: var(--el-color-danger-light-3, #f56c6c) !important;
         box-shadow: 0 2px 8px rgba(187, 45, 63, 0.25);
       }
       &:active { opacity: 0.85; }
@@ -197,13 +197,13 @@
 
     // ── 警告操作：填充橙（提醒/预警相关）───────────────────────────────
     &.el-button--warning {
-      background-color: var(--el-color-warning) !important;
-      border-color: var(--el-color-warning) !important;
+      background-color: var(--el-color-warning, #faad14) !important;
+        border-color: var(--el-color-warning, #faad14) !important;
       color: #ffffff !important;
 
       &:hover {
-        background-color: var(--el-color-warning-light-3) !important;
-        border-color: var(--el-color-warning-light-3) !important;
+        background-color: var(--el-color-warning-light-3, #ffd666) !important;
+          border-color: var(--el-color-warning-light-3, #ffd666) !important;
       }
     }
 
@@ -222,16 +222,35 @@
 
     // ── 成功操作：填充绿（审批通过/启用）────────────────────────────────
     &.el-button--success {
-      background-color: var(--el-color-success) !important;
-      border-color: var(--el-color-success) !important;
+      background-color: var(--el-color-success, #2bb268) !important;
+        border-color: var(--el-color-success, #2bb268) !important;
       color: #ffffff !important;
 
       &:hover {
-        background-color: var(--el-color-success-light-3) !important;
-        border-color: var(--el-color-success-light-3) !important;
-      }
-    }
-  }
+        background-color: var(--el-color-success-light-3, #80d0a4) !important;
+          border-color: var(--el-color-success-light-3, #80d0a4) !important;
+        }
+        }
+        }
+        }
+.base-query-box .el-button.is-disabled,
+.base-query-box .el-button.is-disabled:hover,
+.base-query-box .el-button.is-disabled:focus,
+.base-query-box .el-button.is-disabled:active,
+.base-toolbar-box .el-button.is-disabled,
+.base-toolbar-box .el-button.is-disabled:hover,
+.base-toolbar-box .el-button.is-disabled:focus,
+.base-toolbar-box .el-button.is-disabled:active,
+.base-toolbar-box .el-button[disabled],
+.base-toolbar-box .el-button[disabled]:hover,
+.base-toolbar-box .el-button[disabled]:focus,
+.base-toolbar-box .el-button[disabled]:active {
+  color: var(--el-disabled-text-color, #a8abb2) !important;
+  background-color: var(--el-disabled-bg-color, #f5f7fa) !important;
+  border-color: var(--el-border-color-light, #e4e7ed) !important;
+  box-shadow: none !important;
+  opacity: 1 !important;
+  cursor: not-allowed !important;
 }
 
 // ── 下拉菜单按钮（工具栏内的 el-dropdown 触发器）────────────────────────────