@agile-team/wl-skills-ui 1.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/CHANGELOG.md +207 -0
  2. package/README.md +623 -0
  3. package/SKILL.md +632 -0
  4. package/bin/wl-ui.js +794 -0
  5. package/design/spec/color.md +41 -0
  6. package/design/spec/spacing.md +28 -0
  7. package/design/spec/typography.md +29 -0
  8. package/design/tokens/base.css +144 -0
  9. package/design/tokens/index.css +8 -0
  10. package/dist/ag-grid-override.scss +1 -0
  11. package/dist/element.scss +1 -0
  12. package/dist/index.scss +1 -0
  13. package/dist/portal.scss +1 -0
  14. package/dist/style-override.scss +1 -0
  15. package/dist/tokens.css +144 -0
  16. package/es/chunk-GBB7LDKQ.js +261 -0
  17. package/es/chunk-MDI2SCUP.js +281 -0
  18. package/es/chunk-QDTNMM7W.js +286 -0
  19. package/es/chunk-YLNAFAWE.js +233 -0
  20. package/es/common-preset.d.ts +38 -0
  21. package/es/common-preset.js +157 -0
  22. package/es/index.d.ts +32 -0
  23. package/es/index.js +1 -0
  24. package/es/presets/security.d.ts +16 -0
  25. package/es/presets/security.js +99 -0
  26. package/es/renderers-BFRSp2BH.d.ts +51 -0
  27. package/es/renderers-DMZbi_Gs.d.ts +51 -0
  28. package/es/renderers-DWhUlI2y.d.ts +47 -0
  29. package/es/types-04qLKHMt.d.ts +62 -0
  30. package/es/types-BrCPjAH6.d.ts +62 -0
  31. package/es/types-QZ1gy9KX.d.ts +63 -0
  32. package/examples/migration-operations-to-renderOps.md +107 -0
  33. package/examples/wk-exempt.example.json +30 -0
  34. package/mcp/server.js +394 -0
  35. package/package.json +130 -0
  36. package/reference/SelectPopupCom.vue +634 -0
  37. package/reference/ag-cell-renders.ts +644 -0
  38. package/reference/define-columns.ts +185 -0
  39. package/reference/jhlc.d.ts +1 -0
  40. package/scanner/coverage.mjs +287 -0
  41. package/scanner/exempt.mjs +127 -0
  42. package/scanner/fix.mjs +216 -0
  43. package/scanner/index.mjs +403 -0
  44. package/scanner/integration.mjs +155 -0
  45. package/scanner/report.mjs +459 -0
  46. package/scanner/rules/_shared.mjs +134 -0
  47. package/scanner/rules/button.mjs +97 -0
  48. package/scanner/rules/color.mjs +118 -0
  49. package/scanner/rules/componentFamily.mjs +184 -0
  50. package/scanner/rules/dialog.mjs +42 -0
  51. package/scanner/rules/form.mjs +86 -0
  52. package/scanner/rules/index.mjs +58 -0
  53. package/scanner/rules/table.mjs +170 -0
  54. package/scanner/rules/tag.mjs +245 -0
  55. package/scanner/snapshot.mjs +198 -0
  56. package/skills/_flows/full-audit.md +65 -0
  57. package/skills/_flows/legacy-skin-align.md +71 -0
  58. package/skills/_flows/new-project-init.md +80 -0
  59. package/skills/_flows/progressive-migrate.md +49 -0
  60. package/skills/_meta/_compat/README.md +47 -0
  61. package/skills/_meta/_compat/editors.json +76 -0
  62. package/skills/_meta/_compat/headers/agents.txt +7 -0
  63. package/skills/_meta/_compat/headers/claude-code.txt +7 -0
  64. package/skills/_meta/_compat/headers/cline.txt +7 -0
  65. package/skills/_meta/_compat/headers/cursor-mdc.txt +5 -0
  66. package/skills/_meta/_compat/headers/github-copilot.txt +5 -0
  67. package/skills/_meta/_compat/headers/kiro.txt +4 -0
  68. package/skills/_meta/_compat/headers/qoder.txt +4 -0
  69. package/skills/_meta/_compat/headers/trae.txt +3 -0
  70. package/skills/_meta/_compat/headers/windsurf.txt +5 -0
  71. package/skills/_meta/_detection.md +81 -0
  72. package/skills/_meta/_registry.md +96 -0
  73. package/skills/element/component-family/SKILL.md +71 -0
  74. package/skills/element/el-dialog/SKILL.md +124 -0
  75. package/skills/element/el-form/SKILL.md +84 -0
  76. package/skills/element/el-table/SKILL.md +86 -0
  77. package/skills/element/el-tag/SKILL.md +127 -0
  78. package/skills/layouts/detail-page/SKILL.md +99 -0
  79. package/skills/layouts/form-dialog/SKILL.md +128 -0
  80. package/skills/layouts/list-page/SKILL.md +111 -0
  81. package/skills/layouts/tree-list/SKILL.md +108 -0
  82. package/skills/ops/audit/SKILL.md +109 -0
  83. package/skills/ops/fix/SKILL.md +52 -0
  84. package/skills/ops/fix/USAGE.md +24 -0
  85. package/skills/ops/migrate/SKILL.md +157 -0
  86. package/skills/ops/scan/SKILL.md +71 -0
  87. package/skills/ops/scan/USAGE.md +16 -0
  88. package/skills/runtime/design-tokens/SKILL.md +88 -0
  89. package/skills/runtime/design-tokens/USAGE.md +19 -0
  90. package/skills/runtime/migration/SKILL.md +106 -0
  91. package/skills/runtime/migration/USAGE.md +34 -0
  92. package/skills/runtime/style-align/SKILL.md +124 -0
  93. package/skills/runtime/style-align/USAGE.md +52 -0
  94. package/skills/vendors/ag-grid/SKILL.md +94 -0
  95. package/skills/vendors/base-table/SKILL.md +57 -0
  96. package/skills/vendors/c-components/SKILL.md +36 -0
  97. package/skills/vendors/custom-wrappers/SKILL.md +45 -0
  98. package/skills/vendors/jh-components/SKILL.md +42 -0
  99. package/skills/vendors/unknown-wrapper/SKILL.md +44 -0
  100. package/standards/engineering/01-import-order.md +46 -0
  101. package/standards/engineering/02-naming.md +54 -0
  102. package/standards/engineering/03-scss-structure.md +59 -0
  103. package/standards/ui/01-table.md +111 -0
  104. package/standards/ui/02-button.md +83 -0
  105. package/standards/ui/03-form.md +118 -0
  106. package/standards/ui/04-tag-status.md +110 -0
  107. package/standards/ui/05-dialog-pagination.md +118 -0
  108. package/styles/element/_card.scss +26 -0
  109. package/styles/element/_descriptions.scss +22 -0
  110. package/styles/element/_dialog.scss +43 -0
  111. package/styles/element/_drawer.scss +22 -0
  112. package/styles/element/_feedback.scss +52 -0
  113. package/styles/element/_form.scss +22 -0
  114. package/styles/element/_navigation.scss +36 -0
  115. package/styles/element/_overlay.scss +32 -0
  116. package/styles/element/_pagination.scss +16 -0
  117. package/styles/element/_steps.scss +32 -0
  118. package/styles/element/_table.scss +13 -0
  119. package/styles/element/_tabs.scss +40 -0
  120. package/styles/element/_tree.scss +27 -0
  121. package/styles/element/_upload.scss +34 -0
  122. package/styles/element/index.scss +17 -0
  123. package/styles/index.scss +21 -0
  124. package/styles/layouts/_detail-page.scss +27 -0
  125. package/styles/layouts/_form-dialog.scss +19 -0
  126. package/styles/layouts/_list-page.scss +47 -0
  127. package/styles/layouts/_tree-list.scss +33 -0
  128. package/styles/layouts/index.scss +6 -0
  129. package/styles/presets/element-only.scss +6 -0
  130. package/styles/presets/full.scss +12 -0
  131. package/styles/presets/security.scss +37 -0
  132. package/styles/presets/skin.scss +14 -0
  133. package/styles/presets/tokens-only.scss +7 -0
  134. package/styles/tokens/index.scss +79 -0
  135. package/styles/vendors/_ag-grid.scss +273 -0
  136. package/styles/vendors/_base-components.scss +480 -0
  137. package/styles/vendors/_base-query-toolbar.scss +253 -0
  138. package/styles/vendors/_base-table.scss +41 -0
  139. package/styles/vendors/_c-components.scss +34 -0
  140. package/styles/vendors/_custom-wrappers.scss +30 -0
  141. package/styles/vendors/_jh-drag-col.scss +63 -0
  142. package/styles/vendors/_jh-pagination.scss +81 -0
  143. package/styles/vendors/_jh-tree.scss +196 -0
  144. package/styles/vendors/_portal.scss +114 -0
  145. package/styles/vendors/index.scss +17 -0
  146. package/templates/ag-grid-page/TPL-AG-GRID.md +76 -0
  147. package/templates/form-dialog/TPL-FORM-DIALOG.md +165 -0
  148. package/templates/list-page/TPL-LIST.md +139 -0
  149. package/templates/tree-list/TPL-TREE-LIST.md +176 -0
  150. package/templates/ui-optimization-report/TPL-UI-OPTIM-REPORT.md +343 -0
@@ -0,0 +1,41 @@
1
+ # 颜色设计规范
2
+
3
+ ## 品牌色系
4
+
5
+ | Token | 值 | 用途 |
6
+ | ---------------------------- | --------- | -------------------------- |
7
+ | `--el-color-primary` | `#4368ff` | 主色调:按钮、链接、激活态 |
8
+ | `--el-color-primary-light-9` | `#f0f3ff` | 主色浅底:Tag 背景 |
9
+ | `--el-color-success` | `#0cc859` | 成功/正常/启用状态 |
10
+ | `--el-color-warning` | `#ffaf27` | 警告/待处理状态 |
11
+ | `--el-color-danger` | `#FB2323` | 危险/失败/停用状态 |
12
+ | `--el-color-info` | `#909399` | 中性/辅助信息 |
13
+
14
+ ## 文本色系
15
+
16
+ | Token | 值 | 用途 |
17
+ | ----------------------------- | ------------------ | -------- |
18
+ | `--el-text-color-primary` | `rgba(0,0,0,0.85)` | 主要文本 |
19
+ | `--el-text-color-regular` | `rgba(0,0,0,0.65)` | 次要文本 |
20
+ | `--el-text-color-secondary` | `rgba(0,0,0,0.45)` | 辅助文本 |
21
+ | `--el-text-color-placeholder` | `rgba(0,0,0,0.25)` | 占位文本 |
22
+
23
+ ## 边框色系
24
+
25
+ | Token | 值 | 用途 |
26
+ | ------------------------- | --------- | ---------------- |
27
+ | `--el-border-color` | `#d9d9d9` | 默认边框 |
28
+ | `--el-border-color-light` | `#f0f0f0` | 浅边框(分隔线) |
29
+
30
+ ## 填充色系
31
+
32
+ | Token | 用途 |
33
+ | ------------------------- | ---------------- |
34
+ | `--el-fill-color-lighter` | 表格 header 背景 |
35
+ | `--el-fill-color-blank` | 白色背景 |
36
+
37
+ ## 硬编码颜色禁止使用
38
+
39
+ ❌ 禁止在业务代码中直接写 hex 值,必须使用上方 Token 变量。
40
+
41
+ 扫描器规则 R016/R017/R018 会自动检测并报告。
@@ -0,0 +1,28 @@
1
+ # 间距规范
2
+
3
+ ## 间距 Token
4
+
5
+ | Token | 值 | 用途 |
6
+ | -------------------- | ------ | ------------------ |
7
+ | `--el-padding-large` | `24px` | 页面级留白 |
8
+ | `--el-padding` | `12px` | 组件内边距(默认) |
9
+ | `--el-padding-small` | `12px` | 小尺寸内边距 |
10
+
11
+ ## 组件间距约定
12
+
13
+ | 场景 | 间距 |
14
+ | ------------------------------ | ------------------------------------------ |
15
+ | form-item 行间距(small 尺寸) | `8px`(已由 element/\_form.scss 全局设置) |
16
+ | 搜索区 el-col 间距 | `8px 12px` |
17
+ | 工具栏按钮间距 | `8px`(flex gap) |
18
+ | 操作列按钮间距 | `4px`(jh-op-group gap) |
19
+ | 弹窗内容区内边距 | `20px 24px`(EP 默认) |
20
+
21
+ ## 圆角
22
+
23
+ | 场景 | 值 |
24
+ | ---------------------- | ------------------- |
25
+ | 输入框/选择框/日期选择 | `6px`(已全局设置) |
26
+ | 按钮 | `4px`(EP 默认) |
27
+ | Tag | `4px`(EP 默认) |
28
+ | 弹窗 | `8px`(EP 默认) |
@@ -0,0 +1,29 @@
1
+ # 字体排版规范
2
+
3
+ ## 字号
4
+
5
+ | Token | 值 | 用途 |
6
+ | ---------------------------- | ------ | ------------------- |
7
+ | `--el-font-size-extra-large` | `32px` | 大标题 |
8
+ | `--el-font-size-large` | `24px` | 页面标题 |
9
+ | `--el-font-size-medium` | `16px` | 次级标题 |
10
+ | `--el-font-size-base` | `14px` | 正文(默认) |
11
+ | `--el-font-size-small` | `12px` | 辅助信息、Tag、分页 |
12
+ | `--el-font-size-extra-small` | `10px` | 角标 |
13
+
14
+ ## 字重
15
+
16
+ | Token | 值 | 用途 |
17
+ | -------------------------- | ----- | ---------------------- |
18
+ | `--el-font-weight-primary` | `500` | 中等加粗(按钮、表头) |
19
+ | `--el-font-weight-semi` | `600` | 较粗(弹窗标题) |
20
+ | `--el-font-weight-regular` | `400` | 正文 |
21
+ | `--el-font-weight-light` | `300` | 轻量文本 |
22
+
23
+ ## 使用原则
24
+
25
+ 1. 正文统一 `14px / font-weight: 400`
26
+ 2. 操作按钮 `14px / font-weight: 500`
27
+ 3. 表格表头 `14px / font-weight: 500`
28
+ 4. 弹窗标题 `16px / font-weight: 600`
29
+ 5. Tag/角标 `12px`
@@ -0,0 +1,144 @@
1
+ :root body {
2
+ --el-color-primary: #2254f4;
3
+ --el-color-primary-light-1: #3865f5;
4
+ --el-color-primary-light-2: #5178f6;
5
+ --el-color-primary-light-3: #7a98f8;
6
+ --el-color-primary-light-4: #91aaf9;
7
+ --el-color-primary-light-5: #a8bbfa;
8
+ --el-color-primary-light-6: #bfccfc;
9
+ --el-color-primary-light-7: #d3ddfd;
10
+ --el-color-primary-light-8: #e6ebfe;
11
+ --el-color-primary-light-9: #f2f5ff;
12
+ --el-color-primary-dark-1: #1b43c3;
13
+ --el-color-primary-dark-2: #1738a3;
14
+ --el-color-primary-dark-3: #102873;
15
+ --el-color-primary-dark-4: #0a1a4d;
16
+ --el-color-success: #2bb268;
17
+ --el-color-success-light-1: #40ba77;
18
+ --el-color-success-light-2: #55c286;
19
+ --el-color-success-light-3: #6bcb95;
20
+ --el-color-success-light-4: #80d3a4;
21
+ --el-color-success-light-5: #95dbb4;
22
+ --el-color-success-light-6: #aae3c3;
23
+ --el-color-success-light-7: #bfebd2;
24
+ --el-color-success-light-8: #d5f4e1;
25
+ --el-color-success-light-9: #eaf9f0;
26
+ --el-color-success-dark-1: #229051;
27
+ --el-color-success-dark-2: #1b733f;
28
+ --el-color-success-dark-3: #14562f;
29
+ --el-color-success-dark-4: #0d3a20;
30
+ --el-color-warning: #ea9a13;
31
+ --el-color-warning-light-1: #eca42b;
32
+ --el-color-warning-light-2: #efae42;
33
+ --el-color-warning-light-3: #f1b85a;
34
+ --el-color-warning-light-4: #f3c171;
35
+ --el-color-warning-light-5: #f5cb89;
36
+ --el-color-warning-light-6: #f7d5a1;
37
+ --el-color-warning-light-7: #f9dfb8;
38
+ --el-color-warning-light-8: #fce8d0;
39
+ --el-color-warning-light-9: #fef2e7;
40
+ --el-color-warning-dark-1: #c47f0e;
41
+ --el-color-warning-dark-2: #9d650a;
42
+ --el-color-warning-dark-3: #754a07;
43
+ --el-color-warning-dark-4: #4e3004;
44
+ --el-color-danger: #bb2d3f;
45
+ --el-color-danger-light-1: #c34253;
46
+ --el-color-danger-light-2: #ca5766;
47
+ --el-color-danger-light-3: #d16b78;
48
+ --el-color-danger-light-4: #d8808b;
49
+ --el-color-danger-light-5: #dd969f;
50
+ --el-color-danger-light-6: #e4abb2;
51
+ --el-color-danger-light-7: #e8c0c5;
52
+ --el-color-danger-light-8: #f0d5d9;
53
+ --el-color-danger-light-9: #f7eaec;
54
+ --el-color-danger-dark-1: #962433;
55
+ --el-color-danger-dark-2: #711b26;
56
+ --el-color-danger-dark-3: #4b1219;
57
+ --el-color-danger-dark-4: #26090d;
58
+ --el-color-error: #bb2d3f;
59
+ --el-color-error-light-1: #c34253;
60
+ --el-color-error-light-2: #ca5766;
61
+ --el-color-error-light-3: #d16b78;
62
+ --el-color-error-light-4: #d8808b;
63
+ --el-color-error-light-5: #dd969f;
64
+ --el-color-error-light-6: #e4abb2;
65
+ --el-color-error-light-7: #e8c0c5;
66
+ --el-color-error-light-8: #f0d5d9;
67
+ --el-color-error-light-9: #f7eaec;
68
+ --el-color-error-dark-1: #962433;
69
+ --el-color-error-dark-2: #711b26;
70
+ --el-color-error-dark-3: #4b1219;
71
+ --el-color-error-dark-4: #26090d;
72
+ --el-color-info: #909399;
73
+ --el-color-info-light-1: #9b9ea3;
74
+ --el-color-info-light-2: #a7a9ae;
75
+ --el-color-info-light-3: #b2b4b8;
76
+ --el-color-info-light-4: #bdbfc3;
77
+ --el-color-info-light-5: #c9cacd;
78
+ --el-color-info-light-6: #d4d5d7;
79
+ --el-color-info-light-7: #dfe0e2;
80
+ --el-color-info-light-8: #ebebec;
81
+ --el-color-info-light-9: #f6f6f7;
82
+ --el-color-info-dark-1: #909399;
83
+ --el-color-info-dark-2: #909399;
84
+ --el-color-info-dark-3: #909399;
85
+ --el-color-info-dark-4: #909399;
86
+ --el-text-color-primary: rgba(0, 0, 0, 0.85);
87
+ --el-text-color-regular: rgba(0, 0, 0, 0.65);
88
+ --el-text-color-secondary: rgba(0, 0, 0, 0.45);
89
+ --el-text-color-placeholder: rgba(0, 0, 0, 0.25);
90
+ --el-text-color-disabled: rgba(0, 0, 0, 0.25);
91
+ --el-border-color: #d9d9d9;
92
+ --el-border-color-light: #f0f0f0;
93
+ --el-border-color-lighter: #f5f5f5;
94
+ --el-border-color-extra-light: rgba(0, 0, 0, 0.04);
95
+ --el-border-color-dark: rgba(0, 0, 0, 0.06);
96
+ --el-border-color-darker: rgba(0, 0, 0, 0.15);
97
+ --el-fill-color: #f0f0f0 !important;
98
+ --el-fill-color-light: rgba(0, 0, 0, 0.02) !important;
99
+ --el-fill-color-lighter: rgba(0, 0, 0, 0.04) !important;
100
+ --el-fill-color-dark: rgba(0, 0, 0, 0.45) !important;
101
+ --el-fill-color-darker: rgba(0, 0, 0, 0.75) !important;
102
+ --el-fill-color-blank: #ffffff !important;
103
+ --el-mask-color: rgba(0, 0, 0, 0.45);
104
+ --el-mask-color-extra-light: rgba(0, 0, 0, 0.30);
105
+ --el-font-size-extra-large: 32px;
106
+ --el-font-size-large: 24px;
107
+ --el-font-size-medium: 16px;
108
+ --el-font-size-base: 14px;
109
+ --el-font-size-small: 12px;
110
+ --el-font-size-extra-small: 10px;
111
+ --el-font-weight-primary: 500;
112
+ --el-font-weight-light: 300;
113
+ --el-font-weight-regular: 400;
114
+ --el-font-weight-medium: 500;
115
+ --el-font-weight-semi: 600;
116
+ --el-box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.05);
117
+ --el-box-shadow-light: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
118
+ --el-box-shadow-lighter: 0px 6px 12px 0px rgba(0, 0, 0, 0.12);
119
+ --el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.08), 0px 12px 32px rgba(0, 0, 0, 0.12), 0px 8px 16px -8px rgba(0, 0, 0, 0.16);
120
+ --el-border-radius-base: 4px;
121
+ --el-border-radius-small: 2px;
122
+ --el-border-radius-round: 20px;
123
+ --el-border-radius-circle: 100%;
124
+ --el-line-height-1: 20px;
125
+ --el-line-height-2: 20px;
126
+ --el-line-height-3: 20px;
127
+ --el-line-height-4: 20px;
128
+ --el-line-height-5: 20px;
129
+ --el-line-height-6: 20px;
130
+ --el-line-height-7: 20px;
131
+ --el-line-height-8: 20px;
132
+ --el-line-height-9: 20px;
133
+ --el-component-size-small: 28px;
134
+ --el-component-size-large: 40px;
135
+ --el-component-size-default: 32px;
136
+ --el-padding: 12px;
137
+ --el-padding-large: 24px;
138
+ --el-padding-small: 12px;
139
+ --el-sidebar-bg: #10182C;
140
+ --el-sidebar-bg-active: rgba(255, 255, 255, 0.11);
141
+ --el-sidebar-width: 240px;
142
+ --el-menu-item-font-size: 16px;
143
+ --el-menu-item-height: 40px;
144
+ }
@@ -0,0 +1,8 @@
1
+ /* design/tokens/index.css — 设计系统 Token 入口
2
+ *
3
+ * 在 index.html 中最先加载:
4
+ * <link rel="stylesheet" href="/node_modules/@agile-team/wk-skills-ui/design/tokens/index.css" />
5
+ *
6
+ * 注意:dist/tokens.css 保留用于兼容旧版本引用路径,内容与此文件相同。
7
+ */
8
+ @import './base.css';
@@ -0,0 +1 @@
1
+ @use '../styles/vendors/ag-grid' as *;
@@ -0,0 +1 @@
1
+ @use '../styles/element/index' as *;
@@ -0,0 +1 @@
1
+ @use '../styles/index' as *;
@@ -0,0 +1 @@
1
+ @use '../styles/vendors/portal' as *;
@@ -0,0 +1 @@
1
+ @use '../styles/element/index' as *;
@@ -0,0 +1,144 @@
1
+ :root body {
2
+ --el-color-primary: #2254f4;
3
+ --el-color-primary-light-1: #3865f5;
4
+ --el-color-primary-light-2: #5178f6;
5
+ --el-color-primary-light-3: #7a98f8;
6
+ --el-color-primary-light-4: #91aaf9;
7
+ --el-color-primary-light-5: #a8bbfa;
8
+ --el-color-primary-light-6: #bfccfc;
9
+ --el-color-primary-light-7: #d3ddfd;
10
+ --el-color-primary-light-8: #e6ebfe;
11
+ --el-color-primary-light-9: #f2f5ff;
12
+ --el-color-primary-dark-1: #1b43c3;
13
+ --el-color-primary-dark-2: #1738a3;
14
+ --el-color-primary-dark-3: #102873;
15
+ --el-color-primary-dark-4: #0a1a4d;
16
+ --el-color-success: #2bb268;
17
+ --el-color-success-light-1: #40ba77;
18
+ --el-color-success-light-2: #55c286;
19
+ --el-color-success-light-3: #6bcb95;
20
+ --el-color-success-light-4: #80d3a4;
21
+ --el-color-success-light-5: #95dbb4;
22
+ --el-color-success-light-6: #aae3c3;
23
+ --el-color-success-light-7: #bfebd2;
24
+ --el-color-success-light-8: #d5f4e1;
25
+ --el-color-success-light-9: #eaf9f0;
26
+ --el-color-success-dark-1: #229051;
27
+ --el-color-success-dark-2: #1b733f;
28
+ --el-color-success-dark-3: #14562f;
29
+ --el-color-success-dark-4: #0d3a20;
30
+ --el-color-warning: #ea9a13;
31
+ --el-color-warning-light-1: #eca42b;
32
+ --el-color-warning-light-2: #efae42;
33
+ --el-color-warning-light-3: #f1b85a;
34
+ --el-color-warning-light-4: #f3c171;
35
+ --el-color-warning-light-5: #f5cb89;
36
+ --el-color-warning-light-6: #f7d5a1;
37
+ --el-color-warning-light-7: #f9dfb8;
38
+ --el-color-warning-light-8: #fce8d0;
39
+ --el-color-warning-light-9: #fef2e7;
40
+ --el-color-warning-dark-1: #c47f0e;
41
+ --el-color-warning-dark-2: #9d650a;
42
+ --el-color-warning-dark-3: #754a07;
43
+ --el-color-warning-dark-4: #4e3004;
44
+ --el-color-danger: #bb2d3f;
45
+ --el-color-danger-light-1: #c34253;
46
+ --el-color-danger-light-2: #ca5766;
47
+ --el-color-danger-light-3: #d16b78;
48
+ --el-color-danger-light-4: #d8808b;
49
+ --el-color-danger-light-5: #dd969f;
50
+ --el-color-danger-light-6: #e4abb2;
51
+ --el-color-danger-light-7: #e8c0c5;
52
+ --el-color-danger-light-8: #f0d5d9;
53
+ --el-color-danger-light-9: #f7eaec;
54
+ --el-color-danger-dark-1: #962433;
55
+ --el-color-danger-dark-2: #711b26;
56
+ --el-color-danger-dark-3: #4b1219;
57
+ --el-color-danger-dark-4: #26090d;
58
+ --el-color-error: #bb2d3f;
59
+ --el-color-error-light-1: #c34253;
60
+ --el-color-error-light-2: #ca5766;
61
+ --el-color-error-light-3: #d16b78;
62
+ --el-color-error-light-4: #d8808b;
63
+ --el-color-error-light-5: #dd969f;
64
+ --el-color-error-light-6: #e4abb2;
65
+ --el-color-error-light-7: #e8c0c5;
66
+ --el-color-error-light-8: #f0d5d9;
67
+ --el-color-error-light-9: #f7eaec;
68
+ --el-color-error-dark-1: #962433;
69
+ --el-color-error-dark-2: #711b26;
70
+ --el-color-error-dark-3: #4b1219;
71
+ --el-color-error-dark-4: #26090d;
72
+ --el-color-info: #909399;
73
+ --el-color-info-light-1: #9b9ea3;
74
+ --el-color-info-light-2: #a7a9ae;
75
+ --el-color-info-light-3: #b2b4b8;
76
+ --el-color-info-light-4: #bdbfc3;
77
+ --el-color-info-light-5: #c9cacd;
78
+ --el-color-info-light-6: #d4d5d7;
79
+ --el-color-info-light-7: #dfe0e2;
80
+ --el-color-info-light-8: #ebebec;
81
+ --el-color-info-light-9: #f6f6f7;
82
+ --el-color-info-dark-1: #909399;
83
+ --el-color-info-dark-2: #909399;
84
+ --el-color-info-dark-3: #909399;
85
+ --el-color-info-dark-4: #909399;
86
+ --el-text-color-primary: rgba(0, 0, 0, 0.85);
87
+ --el-text-color-regular: rgba(0, 0, 0, 0.65);
88
+ --el-text-color-secondary: rgba(0, 0, 0, 0.45);
89
+ --el-text-color-placeholder: rgba(0, 0, 0, 0.25);
90
+ --el-text-color-disabled: rgba(0, 0, 0, 0.25);
91
+ --el-border-color: #d9d9d9;
92
+ --el-border-color-light: #f0f0f0;
93
+ --el-border-color-lighter: #f5f5f5;
94
+ --el-border-color-extra-light: rgba(0, 0, 0, 0.04);
95
+ --el-border-color-dark: rgba(0, 0, 0, 0.06);
96
+ --el-border-color-darker: rgba(0, 0, 0, 0.15);
97
+ --el-fill-color: #f0f0f0 !important;
98
+ --el-fill-color-light: rgba(0, 0, 0, 0.02) !important;
99
+ --el-fill-color-lighter: rgba(0, 0, 0, 0.04) !important;
100
+ --el-fill-color-dark: rgba(0, 0, 0, 0.45) !important;
101
+ --el-fill-color-darker: rgba(0, 0, 0, 0.75) !important;
102
+ --el-fill-color-blank: #ffffff !important;
103
+ --el-mask-color: rgba(0, 0, 0, 0.45);
104
+ --el-mask-color-extra-light: rgba(0, 0, 0, 0.30);
105
+ --el-font-size-extra-large: 32px;
106
+ --el-font-size-large: 24px;
107
+ --el-font-size-medium: 16px;
108
+ --el-font-size-base: 14px;
109
+ --el-font-size-small: 12px;
110
+ --el-font-size-extra-small: 10px;
111
+ --el-font-weight-primary: 500;
112
+ --el-font-weight-light: 300;
113
+ --el-font-weight-regular: 400;
114
+ --el-font-weight-medium: 500;
115
+ --el-font-weight-semi: 600;
116
+ --el-box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.05);
117
+ --el-box-shadow-light: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
118
+ --el-box-shadow-lighter: 0px 6px 12px 0px rgba(0, 0, 0, 0.12);
119
+ --el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.08), 0px 12px 32px rgba(0, 0, 0, 0.12), 0px 8px 16px -8px rgba(0, 0, 0, 0.16);
120
+ --el-border-radius-base: 4px;
121
+ --el-border-radius-small: 2px;
122
+ --el-border-radius-round: 20px;
123
+ --el-border-radius-circle: 100%;
124
+ --el-line-height-1: 20px;
125
+ --el-line-height-2: 20px;
126
+ --el-line-height-3: 20px;
127
+ --el-line-height-4: 20px;
128
+ --el-line-height-5: 20px;
129
+ --el-line-height-6: 20px;
130
+ --el-line-height-7: 20px;
131
+ --el-line-height-8: 20px;
132
+ --el-line-height-9: 20px;
133
+ --el-component-size-small: 28px;
134
+ --el-component-size-large: 40px;
135
+ --el-component-size-default: 32px;
136
+ --el-padding: 12px;
137
+ --el-padding-large: 24px;
138
+ --el-padding-small: 12px;
139
+ --el-sidebar-bg: #10182C;
140
+ --el-sidebar-bg-active: rgba(255, 255, 255, 0.11);
141
+ --el-sidebar-width: 240px;
142
+ --el-menu-item-font-size: 16px;
143
+ --el-menu-item-height: 40px;
144
+ }
@@ -0,0 +1,261 @@
1
+ import { h } from 'vue';
2
+ import { ElTag } from 'element-plus';
3
+ import { Upload, CircleCheck, Document, Delete, Edit, View } from '@element-plus/icons-vue';
4
+
5
+ // runtime/core/renderers.ts
6
+ const ENABLE_STATUS_MAP = {
7
+ 0: { label: '\u505C\u7528', type: 'danger' },
8
+ 1: { label: '\u542F\u7528', type: 'success' }
9
+ };
10
+ const AUDIT_STATUS_MAP = {
11
+ 0: { label: '\u5F85\u5BA1\u6279', type: 'info' },
12
+ 1: { label: '\u5DF2\u901A\u8FC7', type: 'success' },
13
+ 2: { label: '\u5DF2\u9A73\u56DE', type: 'danger' }
14
+ };
15
+ const VERIFY_STATUS_MAP = {
16
+ 0: { label: '\u672A\u6838\u5B9E', type: 'warning' },
17
+ 1: { label: '\u5DF2\u6838\u5B9E', type: 'success' }
18
+ };
19
+ const RATING_LEVEL_COLORS = {
20
+ \u4E00: {
21
+ bg: 'var(--wk-rating-lv1-bg, rgba(16,185,129,0.14))',
22
+ color: 'var(--wk-rating-lv1-color, #065F46)'
23
+ },
24
+ \u4E8C: {
25
+ bg: 'var(--wk-rating-lv2-bg, rgba(59,130,246,0.14))',
26
+ color: 'var(--wk-rating-lv2-color, #1E40AF)'
27
+ },
28
+ \u4E09: {
29
+ bg: 'var(--wk-rating-lv3-bg, rgba(245,158,11,0.14))',
30
+ color: 'var(--wk-rating-lv3-color, #78350F)'
31
+ },
32
+ \u56DB: {
33
+ bg: 'var(--wk-rating-lv4-bg, rgba(249,115,22,0.14))',
34
+ color: 'var(--wk-rating-lv4-color, #9A3412)'
35
+ },
36
+ \u4E94: {
37
+ bg: 'var(--wk-rating-lv5-bg, rgba(239,68,68,0.14))',
38
+ color: 'var(--wk-rating-lv5-color, #991B1B)'
39
+ },
40
+ '1': {
41
+ bg: 'var(--wk-rating-lv1-bg, rgba(16,185,129,0.14))',
42
+ color: 'var(--wk-rating-lv1-color, #065F46)'
43
+ },
44
+ '2': {
45
+ bg: 'var(--wk-rating-lv2-bg, rgba(59,130,246,0.14))',
46
+ color: 'var(--wk-rating-lv2-color, #1E40AF)'
47
+ },
48
+ '3': {
49
+ bg: 'var(--wk-rating-lv3-bg, rgba(245,158,11,0.14))',
50
+ color: 'var(--wk-rating-lv3-color, #78350F)'
51
+ },
52
+ '4': {
53
+ bg: 'var(--wk-rating-lv4-bg, rgba(249,115,22,0.14))',
54
+ color: 'var(--wk-rating-lv4-color, #9A3412)'
55
+ },
56
+ '5': {
57
+ bg: 'var(--wk-rating-lv5-bg, rgba(239,68,68,0.14))',
58
+ color: 'var(--wk-rating-lv5-color, #991B1B)'
59
+ }
60
+ };
61
+ function renderTagNode(value, map) {
62
+ if (value === null || value === void 0 || value === '') return null;
63
+ const item = map[value];
64
+ if (!item) return null;
65
+ return { tag: 'jh-tag', item: [{ title: item.label, type: item.type }] };
66
+ }
67
+ function renderTagSlot(value, map) {
68
+ if (value === null || value === void 0 || value === '') return null;
69
+ const item = map[value];
70
+ if (!item) return null;
71
+ const typeClass = item.type ? `jh-cell-tag--${item.type}` : 'jh-cell-tag--default';
72
+ return h('span', { class: ['jh-cell-tag', typeClass] }, item.label);
73
+ }
74
+ function renderClassifyTag(value, map) {
75
+ if (value === null || value === void 0 || value === '') return null;
76
+ const item = map[value];
77
+ if (!item) return null;
78
+ return h(
79
+ ElTag,
80
+ { type: item.type || 'primary', size: 'small', effect: 'plain' },
81
+ () => item.label
82
+ );
83
+ }
84
+ let dictResolver = null;
85
+ function setDictResolver(fn) {
86
+ dictResolver = fn;
87
+ }
88
+ function renderDictClassifyTag(value, dictKey, typeColorMap) {
89
+ if (value === null || value === void 0 || value === '') return null;
90
+ let label = String(value);
91
+ if (dictResolver) {
92
+ const resolved = dictResolver(dictKey, value);
93
+ if (resolved) label = resolved;
94
+ }
95
+ const tagType = typeColorMap?.[String(value)] ?? 'primary';
96
+ return h(
97
+ ElTag,
98
+ { type: tagType, size: 'small', effect: 'plain' },
99
+ () => label
100
+ );
101
+ }
102
+ function renderBadge(value) {
103
+ if (value === null || value === void 0 || value === '') return null;
104
+ return h('span', { class: 'jh-riskno-badge' }, String(value));
105
+ }
106
+ function renderCountBadge(value) {
107
+ if (value === null || value === void 0 || value === '') return null;
108
+ return h('span', { class: 'jh-count-badge' }, String(value));
109
+ }
110
+ function renderDangerText(value) {
111
+ if (value === null || value === void 0 || value === '') return null;
112
+ return h(
113
+ 'span',
114
+ { style: { color: 'var(--el-color-danger)', fontWeight: 500 } },
115
+ String(value)
116
+ );
117
+ }
118
+ function renderRatingLevel(value) {
119
+ if (!value) return null;
120
+ const clr = RATING_LEVEL_COLORS[value] ?? {
121
+ bg: 'var(--wk-rating-fallback-bg, rgba(107,114,128,0.12))',
122
+ color: 'var(--wk-rating-fallback-color, #374151)'
123
+ };
124
+ return h(
125
+ 'span',
126
+ {
127
+ class: 'jh-rating-lv',
128
+ style: { '--lv-bg': clr.bg, '--lv-color': clr.color }
129
+ },
130
+ value
131
+ );
132
+ }
133
+ const renderEnableStatus = (v) => renderTagNode(v, ENABLE_STATUS_MAP);
134
+ const renderAuditStatus = (v) => renderTagNode(v, AUDIT_STATUS_MAP);
135
+ const renderVerifyStatus = (v) => renderTagNode(v, VERIFY_STATUS_MAP);
136
+ const ICON_PRESETS = {
137
+ view: { icon: View, cls: 'jh-op-view', title: '\u67E5\u770B' },
138
+ edit: { icon: Edit, cls: 'jh-op-edit', title: '\u7F16\u8F91' },
139
+ del: { icon: Delete, cls: 'jh-op-del', title: '\u5220\u9664' },
140
+ log: { icon: Document, cls: 'jh-op-log', title: '\u8BB0\u5F55' },
141
+ ok: { icon: CircleCheck, cls: 'jh-op-ok', title: '\u5BA1\u6838' },
142
+ send: { icon: Upload, cls: 'jh-op-send', title: '\u63D0\u4EA4' }
143
+ };
144
+ function renderOps(items) {
145
+ const visible = items.filter((item) => item.show !== false);
146
+ const iconItems = visible.filter((i) => i.type in ICON_PRESETS);
147
+ const otherItems = visible.filter((i) => !(i.type in ICON_PRESETS));
148
+ const nodes = [];
149
+ for (const item of iconItems) {
150
+ const preset = ICON_PRESETS[item.type];
151
+ nodes.push(
152
+ h(
153
+ 'button',
154
+ {
155
+ class: ['jh-op-btn', preset.cls],
156
+ type: 'button',
157
+ title: item.title ?? preset.title,
158
+ onClick: (e) => {
159
+ e.stopPropagation();
160
+ item.onClick(e);
161
+ }
162
+ },
163
+ h(preset.icon)
164
+ )
165
+ );
166
+ }
167
+ if (iconItems.length > 0 && otherItems.length > 0)
168
+ nodes.push(h('span', { class: 'jh-op-sep', 'aria-hidden': 'true' }));
169
+ for (const item of otherItems) {
170
+ if (item.type === 'chip') {
171
+ const children = [];
172
+ if (item.icon) children.push(h(item.icon));
173
+ children.push(h('span', null, item.label));
174
+ nodes.push(
175
+ h(
176
+ 'button',
177
+ {
178
+ class: 'jh-op-chip',
179
+ type: 'button',
180
+ onClick: (e) => {
181
+ e.stopPropagation();
182
+ item.onClick(e);
183
+ }
184
+ },
185
+ children
186
+ )
187
+ );
188
+ } else {
189
+ nodes.push(
190
+ h(
191
+ 'button',
192
+ {
193
+ class: 'jh-op-link',
194
+ type: 'button',
195
+ onClick: (e) => {
196
+ e.stopPropagation();
197
+ item.onClick(e);
198
+ }
199
+ },
200
+ item.label
201
+ )
202
+ );
203
+ }
204
+ }
205
+ return h('div', { class: 'jh-op-group' }, nodes);
206
+ }
207
+
208
+ // runtime/core/registry.ts
209
+ const COLUMN_AUTO_MAP = {};
210
+ function registerColumnAutoMap(name, config) {
211
+ COLUMN_AUTO_MAP[name] = config;
212
+ }
213
+ function registerColumnAutoMaps(maps) {
214
+ Object.assign(COLUMN_AUTO_MAP, maps);
215
+ }
216
+ function getColumnAutoMap() {
217
+ return COLUMN_AUTO_MAP;
218
+ }
219
+ function clearColumnAutoMap(name) {
220
+ if (name) delete COLUMN_AUTO_MAP[name];
221
+ else for (const k of Object.keys(COLUMN_AUTO_MAP)) delete COLUMN_AUTO_MAP[k];
222
+ }
223
+ function defineColumns(columns) {
224
+ return columns.map((col) => {
225
+ const fieldName = col.name ?? col.label ?? '';
226
+ const preset = COLUMN_AUTO_MAP[fieldName];
227
+ const hasRenderer = col.defaultNode !== void 0 || col.defaultSlot !== void 0;
228
+ if (hasRenderer) return col;
229
+ if (!preset && isDictColumn(col)) {
230
+ return {
231
+ ...col,
232
+ defaultSlot: ({ row }) => renderDictClassifyTag(row?.[fieldName], String(col.logicValue))
233
+ };
234
+ }
235
+ if (!preset) return col;
236
+ return { ...preset, ...col };
237
+ });
238
+ }
239
+ function isDictColumn(col) {
240
+ const logicType = String(col.logicType ?? '').toLowerCase();
241
+ return Boolean(col.logicValue) && logicType.includes('dict');
242
+ }
243
+ registerColumnAutoMaps({
244
+ enableStatus: {
245
+ width: 80,
246
+ fixed: 'right',
247
+ defaultNode: ({ row }) => renderEnableStatus(row.enableStatus)
248
+ },
249
+ approvalStatus: {
250
+ width: 90,
251
+ fixed: 'right',
252
+ defaultNode: ({ row }) => renderAuditStatus(row.approvalStatus)
253
+ },
254
+ verifyStatus: {
255
+ width: 90,
256
+ fixed: 'right',
257
+ defaultNode: ({ row }) => renderVerifyStatus(row.verifyStatus)
258
+ }
259
+ });
260
+
261
+ export { AUDIT_STATUS_MAP, ENABLE_STATUS_MAP, RATING_LEVEL_COLORS, VERIFY_STATUS_MAP, clearColumnAutoMap, defineColumns, getColumnAutoMap, registerColumnAutoMap, registerColumnAutoMaps, renderAuditStatus, renderBadge, renderClassifyTag, renderCountBadge, renderDangerText, renderDictClassifyTag, renderEnableStatus, renderOps, renderRatingLevel, renderTagNode, renderTagSlot, renderVerifyStatus, setDictResolver };