@qilitt-mickey/vue3-temp-skill 1.1.46 → 1.1.47

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.
@@ -74,7 +74,7 @@
74
74
  "admin.content.table.operation_bar": {
75
75
  "type": "element",
76
76
  "selector": ".vts-action-bar",
77
- "file": "出厂 src/components/ReTableBar/src/bar.vue 的工具栏行(标题/按钮/工具三件套所在行)已挂 .vts-action-bar;右侧工具三件套源码实证:刷新 svg-icon + el-dropdown 密度(宽松/默认/紧凑)+ el-popover 列设置(bar.vue 内层行)",
77
+ "file": "条件通道:ReTableBar 内部工具栏行(标题/按钮/工具三件套所在行)是本条目的唯一合法挂载点;该行出厂**无语义类**,selector 命中前须按 structure_ops 给该行补挂 .vts-action-bar(属补通道,交付说明单列申报)。禁止挂到 ReTableBar 根节点(见 preconditions)。右侧工具三件套源码实证:刷新 svg-icon + el-dropdown 密度(宽松/默认/紧凑)+ el-popover 列设置",
78
78
  "style_scope": ".vts-page-card",
79
79
  "forms": {
80
80
  "with_tools": "工具三件套(刷新/密度/列设置)齐全——设计规范 list-page §4 要求三件套缺一不可(ReTableBar 出厂已具备,此为默认形态)",
@@ -120,8 +120,10 @@
120
120
  "css_vars": {
121
121
  "link_color": "--el-color-primary",
122
122
  "danger_color": "--el-color-danger",
123
- "divider_color": "--vts-border-color"
123
+ "divider_color": "--re-op-divider-color",
124
+ "divider_gap": "--re-op-divider-gap"
124
125
  },
126
+ "$note": "操作列分割线为**条件通道**:出厂组件当前**没有**分割线元素——声明 divider_color / divider_gap 时,必须先按 structure_ops 在 ReTableOperate 模板按钮间 add_node `<span class=\"re-table-operate__divider\">`(中性元素,几何与颜色全走令牌:width/height/gap/color 分别挂 --re-op-divider-width/height/gap/color,出厂缺省 0 不可见),并同步给 resolveOperateColumnWidth 公式补分割线占位((limit-1)×(width+2×gap)),否则最后按钮被裁——元素与公式缺一即申报补通道失败。列宽由组件公式推算,业务页禁止写死 width——列宽属业务层,设计侧不声明列宽(操作列除外)。",
125
127
  "custom_style_map": {
126
128
  "align": "text-align",
127
129
  "min_width": "min-width",
@@ -181,6 +183,7 @@
181
183
  ],
182
184
  "preconditions": [
183
185
  "Element Plus 表头是「宿主 th.el-table__cell + 内层 .cell 文本盒」两层结构;EP 出厂给内层 .cell 写了 white-space: normal,因此 nowrap / text-overflow 这类文本控制必须落在 inner 层,写在宿主 th 上会被内层覆盖(这是「表头竖排换行」的根因)。高度 / padding / 背景落在 host 层。",
186
+ "几何语境随值迁移:EP 内层 .cell 出厂自带 padding 0 12px,设计的 16px 落到 host 后必须同步把内层 .cell 的 padding 归零,否则实际内边距 16+12=28px/侧 → 列宽被挤、表头标题被省略号截断(类…/包…/操…),视觉不适配常规。数据单元格(td)同理。",
184
187
  "表头单元格可能被业务页用 :header-cell-style 注入行内样式,行内样式优先级高于一切类规则;使用本条目时须确认页面未在列上写死行内表头样式,若有则在页面侧移除、改由本条目承载。"
185
188
  ],
186
189
  "priority": {
@@ -139,8 +139,12 @@
139
139
  "bg": "background-color",
140
140
  "box_shadow": "box-shadow",
141
141
  "gap": "gap",
142
- "border_color": "border-color"
143
- }
142
+ "border_color": "border-color",
143
+ "align_items": "align-items"
144
+ },
145
+ "preconditions": [
146
+ "顶栏内容垂直居中:--header-height 变更(如 54px)后,宿主 .navbar 必须显式 align-items: center——出厂顶栏内元素高度不一(折叠钮 40px / 文字行 / 头像),不显式声明会整体偏上(历史缺口:折叠按钮不垂直居中)。"
147
+ ]
144
148
  },
145
149
  "admin.layout.header.logo_area": {
146
150
  "type": "element",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@qilitt-mickey/vue3-temp-skill",
3
- "version": "1.1.46",
3
+ "version": "1.1.47",
4
4
  "type": "module",
5
5
  "description": "Vue 3 企业级中后台项目开发规范技能包 — core-kernel 架构、按需功能模块",
6
6
  "bin": {
package/parser/index.js CHANGED
@@ -103,7 +103,9 @@ function printHelp() {
103
103
  node parser/index.js match --batch <dir> 项目级批量匹配:目录下全部变更集 + 跨文件汇总
104
104
  node parser/index.js audit --project <dir> [<cs.json…>] 挂载点存在性 + 死通道静态审计(需目标项目源码)
105
105
  node parser/index.js verify --oracle <o.json> --actual <a.json> [--sids a,b]
106
- 渲染态逐点验收:computed style 期望 vs 实测 diff()
106
+ 渲染态逐点验收:computed style 期望 vs 实测 diff
107
+ node parser/index.js verify … --from-theme 钴蓝 --to-theme 橘橙
108
+ 同构异色复用:按语义槽位把效果图色值归一为本主题色值再比(配合 oracle.theme_mapping)
107
109
  node parser/index.js registry <registry.json> [--verbose]
108
110
  登记表通道核验:登记项 sid 是否在词典、dims 是否有落点()
109
111
  node parser/index.js list [--scene admin] [--verbose] 列出全部语义 ID(--verbose 含字段与形态,供下发词汇约束)
@@ -675,8 +677,21 @@ function checkOracle(changeset, plan, valueDict) {
675
677
  };
676
678
  const declaredTheme = themeFromValue(changeset.global && changeset.global.brand_primary);
677
679
  const mockupTheme = [...themes].find(t => mockup.includes(t)) || null;
678
- if (declaredTheme && mockupTheme && declaredTheme !== mockupTheme) {
679
- issues.push(`主题错配:效果图是「${mockupTheme}」、本变更集主色是「${declaredTheme}」—— 跨主题复用效果图会让 verify 逐点比对必然全红,请换成本主题自己的效果图。`);
680
+
681
+ // 同构异色复用:设计侧在 oracle 声明 theme_mapping { "from": "钴蓝", "to": "橘橙" } =
682
+ // 明确本变更集与效果图同场景 / 同页面 / 同角色集合,仅主题色板不同(语义槽位 -1..-10 一一对应)。
683
+ // 此时沿用 from 主题效果图是合法基线:verify 用 --from-theme/--to-theme 把色值归一到语义槽位再比,
684
+ // 几何 / 结构 / 字号等非色属性逐点照比 —— 不允许「只换个颜色就闭环不了」。
685
+ const tm = oracle.theme_mapping && typeof oracle.theme_mapping === "object" ? oracle.theme_mapping : null;
686
+ const declaredReuse = !!(tm && tm.from && tm.to
687
+ && themes.has(tm.from) && themes.has(tm.to)
688
+ && declaredTheme === tm.to && mockupTheme === tm.from);
689
+
690
+ if (declaredReuse) {
691
+ console.log(` ↺ 同构异色复用已声明:效果图「${tm.from}」→ 本主题「${tm.to}」(oracle.theme_mapping)。verify 需带 --from-theme ${tm.from} --to-theme ${tm.to} 做色值归一后比对。`);
692
+ }
693
+ else if (declaredTheme && mockupTheme && declaredTheme !== mockupTheme) {
694
+ issues.push(`主题错配:效果图是「${mockupTheme}」、本变更集主色是「${declaredTheme}」。同构异色(只换主题色板、场景/页面/角色集合不变)时,由设计侧在 oracle 声明 theme_mapping: { "from": "${mockupTheme}", "to": "${declaredTheme}" } 即可复用该效果图闭环;若结构 / 形态也变了,则必须换本主题自己的效果图。`);
680
695
  }
681
696
  if (!mockupTheme && mockup)
682
697
  issues.push(`效果图文件名不含任何已知主题词(${[...themes].join("/")}),无法确认主题一致性 —— 请核对是否复用了其它主题的效果图。`);
@@ -684,8 +699,14 @@ function checkOracle(changeset, plan, valueDict) {
684
699
  // ② 覆盖度(双向)
685
700
  const declaredIds = plan.map(p => p.id);
686
701
  const sidSet = new Set(sids);
702
+ // 仅 visible:false 的隐藏点位在效果图上没有可见元素可标 data-sid —— 豁免「无基线」判定
703
+ const hiddenOnly = new Set(
704
+ plan.filter(p => p.change && p.change.visible === false).map(p => p.id),
705
+ );
687
706
  const sidNotDeclared = sids.filter(s => !declaredIds.includes(s));
688
- const declaredWithoutSid = declaredIds.filter(id => !sidSet.has(id));
707
+ const declaredWithoutSid = declaredIds.filter(id => !sidSet.has(id) && !hiddenOnly.has(id));
708
+ if (hiddenOnly.size > 0)
709
+ console.log(` ℹ 隐藏点位(仅 visible:false)${hiddenOnly.size} 处豁免 sid 标注:${[...hiddenOnly].join("、")}`);
689
710
  if (sidNotDeclared.length > 0)
690
711
  issues.push(`欠声明 ${sidNotDeclared.length} 处:效果图里有、changes[] 未声明 → 该点位永远不可能被还原。\n ${sidNotDeclared.join("、")}`);
691
712
  if (declaredWithoutSid.length > 0)
@@ -1350,6 +1371,41 @@ function cmdVerify(args) {
1350
1371
  return s;
1351
1372
  };
1352
1373
 
1374
+ // 同构异色主题归一:--from-theme 钴蓝 --to-theme 橘橙 时,把效果图的主题色族色值
1375
+ // 按语义译表的槽位(-1..-10)映射为本主题同槽位色值再比对;译表之外的值原样保留。
1376
+ const fromTheme = get("--from-theme");
1377
+ const toTheme = get("--to-theme");
1378
+ let themeAlias = null;
1379
+ if (fromTheme && toTheme) {
1380
+ try {
1381
+ const sv = JSON.parse(readFileSync(path.join(ROOT, "mapping", "basic", "semantic-values.json"), "utf-8"));
1382
+ const slotOf = {};
1383
+ const hexOf = {};
1384
+ for (const t of Object.values(sv.themes || {})) {
1385
+ for (const [name, hex] of Object.entries(t.values || {})) {
1386
+ const m = /^(.+?)-(\d+)$/.exec(name);
1387
+ if (!m)
1388
+ continue;
1389
+ const key = String(hex).toLowerCase();
1390
+ slotOf[`${t.label}|${key}`] = m[2];
1391
+ hexOf[`${t.label}|${m[2]}`] = key;
1392
+ }
1393
+ }
1394
+ themeAlias = (v) => {
1395
+ let s = String(v == null ? "" : v).toLowerCase();
1396
+ s = s.replace(/#([0-9a-f]{3})\b/g, (_, h) => `#${h[0]}${h[0]}${h[1]}${h[1]}${h[2]}${h[2]}`);
1397
+ return s.replace(/#[0-9a-f]{6}/g, (hex) => {
1398
+ const lvl = slotOf[`${fromTheme}|${hex}`];
1399
+ return lvl ? (hexOf[`${toTheme}|${lvl}`] || hex) : hex;
1400
+ });
1401
+ };
1402
+ console.log(`主题归一:效果图「${fromTheme}」→ 本主题「${toTheme}」(按语义槽位映射色值后比对,几何 / 结构照比)`);
1403
+ }
1404
+ catch (e) {
1405
+ console.log(`⚠ 主题译表读取失败(${e.message})—— 本轮不做主题色归一,色值类属性可能出现假缺口`);
1406
+ }
1407
+ }
1408
+
1353
1409
  console.log(`渲染态验收(computed style 逐点比对)`);
1354
1410
  console.log(`效果图基线:${path.resolve(oraclePath)}`);
1355
1411
  console.log(`项目实测:${path.resolve(actualPath)}`);
@@ -1385,7 +1441,8 @@ function cmdVerify(args) {
1385
1441
  attr.selector_miss++;
1386
1442
  continue;
1387
1443
  }
1388
- if (normValue(expVal) === normValue(act[prop])) {
1444
+ const expNorm = themeAlias ? themeAlias(expVal) : expVal;
1445
+ if (normValue(expNorm) === normValue(act[prop])) {
1389
1446
  hitProps++;
1390
1447
  continue;
1391
1448
  }
@@ -233,6 +233,7 @@ node parser/index.js registry <restore-registry.json> [--verbose] # 只
233
233
  - 变更集**没给** `layer`、但条目 `preconditions` 指出必须落内层(如 EP 表头 `white-space`)→ 按 `preconditions` 落 inner 层,并在交付说明注明「设计侧未给 layer,按条目前置条件处理」。
234
234
  - **内层盒属性族强制校验**:`white-space` / `text-overflow` / `overflow` / `word-break` / `text-align` / `line-height` / `vertical-align` 这组属性**只在内层文本盒生效**——逐字段核对 `layer`;未指认且条目前置条件也没说 → **退回设计侧补声明**,禁止默认落 host(历史缺口:表头「禁止换行」落 host 被内层默认 `normal` 吃掉 → 表头竖排、行高撑大、列内容被压)。
235
235
  - 常规分工:高度 / 背景 / padding 落 host;文本换行、省略、对齐落 inner。
236
+ - **几何语境必须随值迁移(双重内边距,历史缺口:表头标题截断成 类…/包…/操…)**:出厂内层文本盒自带 padding 时(EP `.el-table .cell` 出厂 `padding: 0 12px`),把设计的 16px 落到 host 后**必须同步清零内层自带 padding**——否则实际内边距 = 16+12 = 28px/侧,列宽被挤、表头标题被省略号截断、视觉不适配常规。判据:**效果图的距离语义是「列缘到文字」的总距离;宿主/内层两层结构下必须拆成两段落地,两段之和等于设计值**。凡向 host 落 padding/border 类几何值,先查出厂内层盒的自带同族值再决定是否归零。
236
237
 
237
238
  **B2. 出厂形态互斥收口 `suppress`(治「新形态上了、旧形态残留」)**——条目带 `suppress` 时,逐通道执行收口,**收口优先走令牌重映射**(在令牌宿主作用域重声明令牌,零权重战争),令牌不存在才写属性:
238
239
 
@@ -315,6 +316,8 @@ html body .sidebar-container { /* 令牌宿主 = 该令牌被消费的
315
316
 
316
317
  写入纪律:
317
318
 
319
+ - **本文件是产物,不是手改对象(流程红线)**:`design-shell.scss` 的每一行都必须由「变更集 + 词典」经本协议产出——发现缺规则时,正确动作是**补词典字段 / 前置条件 / 登记项**让下一次 design-apply 自动生成,**禁止绕过流程直接手写项目文件**。历史规则已落词典的(侧栏令牌 / suppress / 表头内层 nowrap / 双重内边距归零 / 分割线通道),重生成后会自动带出;仅「补通道」(变量消费者 / form 枚举 / 组件中性默认)允许动出厂源码并单列申报。
320
+
318
321
  - 每条规则带来源标注(`/* <语义 ID> · <变更条目> */`),换设计时整段可替换;
319
322
  - 本文件内新增的 CSS 变量必须**定义 + 引用成对出现**(出厂已有消费者也算),避免死通道;
320
323
  - 出厂元素需关闭时(存在性收口)也在这里做:令牌置 `transparent` 或 `display:none`,**绝不删出厂代码行**;
@@ -344,6 +347,8 @@ html .navbar .navbar-breadcrumb-wrap {
344
347
 
345
348
  ### 第 4 步 · L3 新模块处理(分级布局)
346
349
 
350
+ - **列宽口径(业务层 / 设计层边界)**:表格**业务列宽度属业务层**,设计侧不声明、项目侧不按效果图硬套——效果图里的列宽只是其示例数据下的参考值。**唯一例外是操作列**:宽度由组件公式推算(`resolveOperateColumnWidth`,已含分割线占位),业务页禁止写死。**固定列自查(落完后必做,防「符合规范但不合常规」)**:操作列按钮不被裁、不换行、分割线居中可见;状态列标签完整;表头/单元格标题不被省略号截断——任何一项不满足即返工,禁止用「设计值就是对的」搪塞。
351
+
347
352
  - **L3 是施工指令,不是待办**:词典未命中的点位一律当场落地、交付说明申报「补映射」,不留待确认。新模块按「定制布局」三步走:① 基于全局规范生成结构(继承命名/作用域/组件规范)② 原子层字段(色彩/圆角/组件级)从 `basic/` + `component/` 词典借力 ③ 场景专属点位生成后**立即写入 mapping/ 对应场景域**(临时映射),累计复用 ≥3 次建议升级标准(由人工评审)。
348
353
  - 生成的新页面必须带构图钩子(`vts-page-card` / `vts-filter-area` / `vts-table-area` 等),保证后续变更集可命中。
349
354
 
@@ -378,7 +383,7 @@ html .navbar .navbar-breadcrumb-wrap {
378
383
  - [ ] **映射通道活性检查(杂必查)**:样式落地引用的每个 CSS 变量必须在项目样式中**存在消费者**(`变量名` 有 `var(--xxx)` 引用点);只定义不消费的变量 = 通道死路,翻译再准也不生效(menu_active_indicator 曾因 --vts-theme-menu-active-before 无消费者而「映射了却没效果」)。施工时 grep 核对,无消费者时改走消费者存在的作用域或补挂载点并申报。
379
384
  - [ ] **结构施工兑现检查(structure_ops 逐条对账,与红线同级)**:变更集 `structure_ops[]` 的**每一条 op** 都必须在交付说明给出「op → 落在哪个文件 / 哪个节点 / 怎么落的」;`add_node` 必须真的新增了元素或渲染分支(模板 diff 可验),`bind_source` 必须真的改了绑定(`class-name` / `align` / `formatter`)。出现「声明了 op、代码里找不到对应改动」= 交付不完整,禁止只改 CSS 冒充结构施工(历史缺口:操作列分割线 `add_node` 声明了但从未施工 → 按钮间竖线一直缺失)
380
385
  - [ ] **同权重失效检查( · 专查「写了不生效」)**:逐条核对设计层新增规则是否真能取胜——① 对手是组件 `<style scoped>` 时,本条特异度必须**严格高于**它(**平手即错**,因为组件样式在全局之后注入);② 对手带 `!important` 时本条必须同样 `!important`,或改走通道变量。**判定方法(必须真数,不许目测)**:对每条新规则与其对手分别写出特异度三元组 `(a,b,c)` 并**逐位比较(先 b 后 c)**,本条的 `b` 不大于对手即判为「失效」;`html` / `body` 只加 `c` 位,**对手 `b` 更高时加 `html body` 无效**,必须靠**加类**(祖先链补稳定语义类,如 `.el-menu`)把 `b` 抬到相等。同 `b` 时,`c` 更高者胜。③ **出厂用语义令牌间接设置该属性时(`var(--vts-theme-*)`),必须先走「令牌重映射」而不是抢属性**——在令牌宿主作用域重声明令牌即生效、零权重战争;只有无令牌或令牌语义不符时才抢属性。历史缺口全部命中本项:面包屑 `display:none`(与组件 scoped 同为 0,2,0)→ 照旧显示;页签关闭钮 `opacity`(同为 0,5,0)→ 仍要 hover 才显;页签项 `padding`(对手带 `!important`)→ 无论怎么抬特异度都改不动;**侧栏菜单 `color`(`b=2` 输给出厂 `b=3` + `!important`)→ 整栏菜单文字用浅色主题的黑色落在深色侧栏上、字全部消失**
381
- - [ ] **oracle 基线可用性检查**:变更集带 `oracle` 时——① `oracle.mockup` 必须与**本次主题、本次页面**一致(禁止复用异主题效果图:主题错配会让逐点比对必然全红);② `oracle.sids` 与 `changes[]` **双向闭合**:效果图里有、changes[] 未声明 = **欠声明**(该点位永远不可能被还原);changes[] 已声明、效果图无 sid = **无基线**(落地后无法机器验收)。两类出现即回流设计侧补齐,**不得直接开工**(`parser match` 已自动报出)
386
+ - [ ] **oracle 基线可用性检查**:变更集带 `oracle` 时——① `oracle.mockup` 必须与**本次主题、本次页面**一致;**同构异色复用除外**:变更集声明 `oracle.theme_mapping: { "from": "<效果图主题>", "to": "<本次主题>" }`(同场景 / 同页面 / 同角色集合、仅主题色板不同)时,允许复用 from 主题效果图,verify 必须带 `--from-theme/--to-theme` 做色值归一,**不得因换主题色就判死闭环**;结构 / 形态有差异时禁止复用;② `oracle.sids` 与 `changes[]` **双向闭合**:效果图里有、changes[] 未声明 = **欠声明**(该点位永远不可能被还原);changes[] 已声明、效果图无 sid = **无基线**——**仅 `visible:false` 的隐藏点位豁免**(效果图上无可见元素可标 `data-sid`,parser 已自动豁免并打印清单)。其余两类出现即回流设计侧补齐,**不得直接开工**(`parser match` 已自动报出)
382
387
  - [ ] **dark.scss 暗色同步**:新增视觉规则在 `html.dark` 有对应覆盖
383
388
  - [ ] **缺口清单只含意图缺口**:清单每一项都必须是「设计侧未给值 / 值非法」且已注明「回流设计侧补齐」;能力缺口(词典缺 ID / 缺字段枚举 / 缺 form)不得出现在清单里——出现即把可落地项搁置
384
389
  - [ ] **台账逐行兑现对账(对账闸门)**:把设计侧交付的提取台账逐行过一遍,每行必须有落地结论——已落地(写明落在哪个文件/选择器)或已入缺口清单(写明缺失字段)。存在「台账有行、落地无结论」的行 = 交付不完整,与红线同级
@@ -399,6 +404,8 @@ html .navbar .navbar-breadcrumb-wrap {
399
404
  ```bash
400
405
  node parser/index.js verify --oracle oracle.json --actual actual.json
401
406
  # 可选 --sids admin.content.table.header_cell,admin.layout.tabs.item 只验部分点位
407
+ # 同构异色复用(oracle.theme_mapping 已声明时必带)——效果图色值按语义槽位归一为本主题色值再比:
408
+ node parser/index.js verify --oracle oracle.json --actual actual.json --from-theme 钴蓝 --to-theme 橘橙
402
409
  ```
403
410
  退出码:存在缺口 → `1`。
404
411
 
@@ -416,6 +423,10 @@ html .navbar .navbar-breadcrumb-wrap {
416
423
 
417
424
  ## 词典维护纪律
418
425
 
426
+ ### 出厂状态漂移(词典假前提 = 事故源,落地前必查)
427
+
428
+ **项目可能随时被还原到出厂**(design-shell 回空壳、`.changeset/*` 消失、本体系此前补的通道全部消失)。因此词典里凡「出厂已具备 X」类表述必须满足:① X 是**真出厂能力**(对照出厂源码可验证);② 由本体系补建的通道一律写成**条件式**——「若缺失,按 structure_ops / 补通道流程补建并申报」,不写「已存在」。**落地前必须跑 `node parser/index.js audit --project <dir>`**:锚点/选择器/变量消费者存在性静态校验,会当场暴露词典假前提(曾发生:词典写「出厂已渲染分割线 / 工具栏行已挂语义类」,项目还原后全部失真 → 规则落空)。
429
+
419
430
  - mapping/ 是唯一事实源:施工前 `parser query <id>` 精读条目,**不凭记忆施工**。
420
431
  - **禁止编造的是「既有条目的映射」**(改既有 selector / css_vars / 变量指向 = 静默篡改,绝对禁止)。**词典缺 ID / 缺字段枚举不属编造**——那是新点位,按 L3 当场落地并写**新增的**临时映射条目,交付说明申报,等人工评审转正。
421
432
  - 「宁可不做,不做错」只适用于**设计侧未给值 / 值非法**的意图缺口;用它搁置能力缺口 = 交付失败。
@@ -1,468 +0,0 @@
1
- {
2
- "schema": "design.changeset/1.0",
3
- "changeset_version": "1.0.0",
4
- "mapping_version": "1.0.0",
5
- "scene": "admin",
6
- "layout_type": "vertical",
7
- "global": {
8
- "brand_primary": "钴蓝-5"
9
- },
10
- "changes": [
11
- {
12
- "id": "admin.layout.sidebar",
13
- "style": {
14
- "width": "208px",
15
- "collapsed_width": "64px",
16
- "bg": "#001529"
17
- }
18
- },
19
- {
20
- "id": "admin.layout.sidebar.logo_area",
21
- "style": {
22
- "height": "54px",
23
- "title_font_size": "16px",
24
- "title_font_weight": "中等",
25
- "title_color": "#FFFFFF"
26
- }
27
- },
28
- {
29
- "id": "admin.layout.sidebar.menu",
30
- "form": "pill",
31
- "style": {
32
- "padding_y": "8px",
33
- "item_height": "40px",
34
- "font_size": "14px",
35
- "font_weight": "常规",
36
- "text_color": "rgba(255,255,255,0.65)",
37
- "menu_hover_bg": "rgba(255,255,255,0.08)",
38
- "menu_active_bg": "钴蓝-5",
39
- "menu_active_indicator": "钴蓝-5"
40
- },
41
- "priority": { "strategy": "deep_qualified" }
42
- },
43
- {
44
- "id": "admin.layout.sidebar.collapse_trigger",
45
- "visible": false
46
- },
47
- {
48
- "id": "admin.layout.header",
49
- "style": {
50
- "height": "54px",
51
- "padding_x": "24px",
52
- "bg": "#FFFFFF",
53
- "border_color": "#F0F0F0"
54
- }
55
- },
56
- {
57
- "id": "admin.layout.header.collapse_trigger",
58
- "form": "header_inline",
59
- "style": {
60
- "btn_width": "40px",
61
- "btn_height": "40px",
62
- "icon_size": "16px",
63
- "border_radius": "6px"
64
- }
65
- },
66
- {
67
- "id": "admin.layout.header.logo_area",
68
- "visible": false
69
- },
70
- {
71
- "id": "admin.layout.header.breadcrumb",
72
- "visible": false,
73
- "priority": { "strategy": "deep_qualified" }
74
- },
75
- {
76
- "id": "admin.layout.header.lang_switch",
77
- "form": "inline_switch",
78
- "style": {
79
- "gap": "2px",
80
- "icon_size": "16px",
81
- "text_color": "#000000A6"
82
- }
83
- },
84
- {
85
- "id": "admin.layout.header.fullscreen",
86
- "style": {
87
- "icon_size": "16px",
88
- "width": "32px"
89
- }
90
- },
91
- {
92
- "id": "admin.layout.header.setting_button",
93
- "style": {
94
- "icon_size": "16px",
95
- "hover_bg": "#FAFAFA",
96
- "text_color": "#000000A6"
97
- }
98
- },
99
- {
100
- "id": "admin.layout.header.user_profile",
101
- "form": "greeting_avatar_name",
102
- "style": {
103
- "avatar_width": "28px",
104
- "avatar_height": "28px",
105
- "avatar_radius": "9999px",
106
- "name_font_size": "14px",
107
- "name_font_weight": "中等",
108
- "greeting_font_size": "14px",
109
- "gap": "12px",
110
- "text_color": "#000000E6",
111
- "hover_bg": "#FAFAFA"
112
- },
113
- "structure_ops": [{ "op": "add_node", "node": "问候区" }]
114
- },
115
- {
116
- "id": "admin.layout.tabs",
117
- "form": "flat",
118
- "style": {
119
- "height": "40px",
120
- "bg": "#FFFFFF",
121
- "border_bottom": "1px solid #F0F0F0",
122
- "padding_inline": "0px"
123
- },
124
- "priority": { "strategy": "deep_qualified" }
125
- },
126
- {
127
- "id": "admin.layout.tabs.home_tab",
128
- "form": "icon_only",
129
- "style": {
130
- "width": "40px",
131
- "height": "40px",
132
- "icon_size": "16px",
133
- "icon_color": "钴蓝-5"
134
- }
135
- },
136
- {
137
- "id": "admin.layout.tabs.item",
138
- "form": "text_only",
139
- "style": {
140
- "card_height": "40px",
141
- "padding_x": "12px",
142
- "title_gap": "6px",
143
- "close_size": "12px",
144
- "close_opacity": "0.45",
145
- "close_hover_color": "#FF4D4F",
146
- "divider_color": "#F0F0F0"
147
- },
148
- "priority": { "strategy": "deep_qualified" }
149
- },
150
- {
151
- "id": "admin.layout.tabs.item_active",
152
- "form": "text_color_only",
153
- "style": {
154
- "text_color": "钴蓝-5",
155
- "font_weight": "中等"
156
- }
157
- },
158
- {
159
- "id": "admin.layout.tabs.divider",
160
- "style": {
161
- "width": "1px",
162
- "height": "100%",
163
- "bg": "#F0F0F0",
164
- "opacity": "1"
165
- }
166
- },
167
- {
168
- "id": "admin.layout.tabs.context_menu",
169
- "style": {
170
- "width": "120px",
171
- "border_color": "#F0F0F0",
172
- "radius": "6px"
173
- }
174
- },
175
- {
176
- "id": "admin.content.container",
177
- "form": "fixed"
178
- },
179
- {
180
- "id": "admin.layout.content",
181
- "style": {
182
- "padding": "24px"
183
- }
184
- },
185
- {
186
- "id": "component.card.base",
187
- "style": {
188
- "bg_color": "#FFFFFF",
189
- "radius": "8px",
190
- "border_color": "transparent",
191
- "box_shadow": "0 2px 8px rgba(0,0,0,0.06)",
192
- "padding_x": "0px",
193
- "padding_y": "0px"
194
- }
195
- },
196
- {
197
- "id": "admin.content.page_header",
198
- "style": {
199
- "margin_bottom": "1px solid #F0F0F0",
200
- "title_size": "20px",
201
- "title_weight": "加粗",
202
- "desc_size": "14px",
203
- "desc_color": "#000000A6",
204
- "actions_gap": "8px",
205
- "padding_x": "20px",
206
- "padding_y": "20px"
207
- }
208
- },
209
- {
210
- "id": "admin.content.filter_area",
211
- "style": {
212
- "radius": "6px",
213
- "padding_y": "20px",
214
- "padding_x": "20px",
215
- "margin_bottom": "1px solid #F0F0F0",
216
- "bg": "#FFFFFF",
217
- "border_color": "#F0F0F0",
218
- "font_size": "14px",
219
- "text_color": "#000000E6",
220
- "text_align": "右对齐",
221
- "icon_size": "16px",
222
- "gap": "20px"
223
- }
224
- },
225
- {
226
- "id": "admin.content.table.operation_bar",
227
- "style": {
228
- "gap": "8px",
229
- "padding_y": "20px 20px 8px",
230
- "btn_height": "32px",
231
- "btn_radius": "6px",
232
- "btn_font_size": "14px",
233
- "font_size": "14px",
234
- "font_weight": "常规",
235
- "text_color": "#000000E6"
236
- }
237
- },
238
- {
239
- "id": "admin.content.table.area",
240
- "style": {
241
- "radius": "8px",
242
- "header_bg": "#FAFAFA",
243
- "header_text": "#000000E6",
244
- "row_hover_bg": "#FAFAFA",
245
- "bg_color": "#FFFFFF"
246
- }
247
- },
248
- {
249
- "id": "admin.content.table.header_cell",
250
- "layer": { "padding": "host", "text_align": "inner" },
251
- "style": {
252
- "height": "48px",
253
- "padding": "16px",
254
- "bg": "#FAFAFA",
255
- "font_size": "14px",
256
- "font_weight": "中等",
257
- "text_color": "#000000E6",
258
- "text_align": "左对齐",
259
- "border_bottom": "1px solid #F0F0F0",
260
- "nowrap": "禁止换行",
261
- "gap": "8px",
262
- "icon_size": "16px"
263
- },
264
- "priority": { "strategy": "self_plus_important" }
265
- },
266
- {
267
- "id": "admin.content.table.cell",
268
- "layer": "host",
269
- "style": {
270
- "padding": "16px",
271
- "height": "55px",
272
- "font_size": "14px",
273
- "font_weight": "常规",
274
- "text_color": "#000000E6",
275
- "border_bottom": "1px solid #F0F0F0",
276
- "vertical_align": "居中",
277
- "nowrap": "禁止换行"
278
- }
279
- },
280
- {
281
- "id": "admin.content.table.cell_status",
282
- "form": "filled",
283
- "style": {
284
- "bg": "#F6FFED",
285
- "border_color": "#D9F7BE",
286
- "text_color": "#52C41A",
287
- "font_size": "12px",
288
- "radius": "6px",
289
- "icon_size": "16px"
290
- },
291
- "structure_ops": [{ "op": "render_branch", "node": "状态列" }]
292
- },
293
- {
294
- "id": "admin.content.table.cell_amount",
295
- "layer": "inner",
296
- "style": {
297
- "align": "右对齐"
298
- },
299
- "structure_ops": [{ "op": "bind_source", "node": "金额列", "source": "列类名" }]
300
- },
301
- {
302
- "id": "admin.content.table.operation_column",
303
- "style": {
304
- "link_color": "钴蓝-5",
305
- "danger_color": "#FF4D4F",
306
- "divider_color": "#F0F0F0",
307
- "align": "居中",
308
- "min_width": "160px",
309
- "column_width": "160px",
310
- "nowrap": "禁止换行",
311
- "bg": "#FFFFFF",
312
- "box_shadow": "-2px 0 4px rgba(0,0,0,0.06)",
313
- "font_size": "14px",
314
- "gap": "8px",
315
- "radius": "6px",
316
- "vertical_align": "居中"
317
- },
318
- "structure_ops": [
319
- { "op": "render_branch", "node": "操作列图标" },
320
- { "op": "add_node", "node": "操作列分隔线" }
321
- ]
322
- },
323
- {
324
- "id": "admin.content.pagination",
325
- "style": {
326
- "font_size": "14px",
327
- "text_color": "#000000A6",
328
- "gap": "8px",
329
- "margin_bottom": "20px",
330
- "padding_y": "8px 20px",
331
- "active_bg": "钴蓝-5",
332
- "active_color": "#FFFFFF",
333
- "border_color": "#D9D9D9",
334
- "hover_color": "钴蓝-5"
335
- }
336
- },
337
- {
338
- "id": "admin.content.empty_state",
339
- "style": {
340
- "font_size": "14px",
341
- "text_color": "#000000A6",
342
- "icon_size": "40px",
343
- "padding": "40px"
344
- }
345
- },
346
- {
347
- "id": "component.button.primary",
348
- "style": {
349
- "bg_color": "钴蓝-5",
350
- "text_color": "#FFFFFF",
351
- "border_color": "钴蓝-5",
352
- "font_weight": "常规",
353
- "padding_x": "15px",
354
- "height": "32px",
355
- "radius": "6px"
356
- }
357
- },
358
- {
359
- "id": "component.button.default",
360
- "style": {
361
- "bg_color": "#FFFFFF",
362
- "text_color": "#000000E6",
363
- "border_color": "#D9D9D9",
364
- "font_weight": "常规",
365
- "padding_x": "15px",
366
- "height": "32px",
367
- "radius": "6px"
368
- }
369
- },
370
- {
371
- "id": "component.button.danger",
372
- "style": {
373
- "bg_color": "#FF4D4F",
374
- "text_color": "#FFFFFF",
375
- "border_color": "#FF4D4F",
376
- "font_weight": "常规",
377
- "padding_x": "12px",
378
- "height": "32px",
379
- "radius": "6px"
380
- }
381
- },
382
- {
383
- "id": "component.tag.status",
384
- "form": "filled",
385
- "style": {
386
- "bg_color": "#F6FFED",
387
- "text_color": "#52C41A",
388
- "border_color": "#D9F7BE",
389
- "font_size": "12px",
390
- "radius": "6px",
391
- "icon_size": "16px"
392
- }
393
- },
394
- {
395
- "id": "component.input.base",
396
- "style": {
397
- "bg_color": "#FFFFFF",
398
- "text_color": "#000000E6",
399
- "border_color": "#D9D9D9",
400
- "radius": "6px",
401
- "height": "32px",
402
- "font_size": "14px",
403
- "icon_size": "16px",
404
- "padding_x": "12px"
405
- }
406
- },
407
- {
408
- "id": "component.pagination.base",
409
- "style": {
410
- "height": "32px",
411
- "gap": "8px",
412
- "radius": "6px",
413
- "active_bg": "钴蓝-5",
414
- "active_color": "#FFFFFF",
415
- "border_color": "#D9D9D9",
416
- "text_color": "#000000E6",
417
- "hover_color": "钴蓝-5",
418
- "icon_size": "16px"
419
- }
420
- }
421
- ],
422
- "oracle": {
423
- "mockup": "project-ui-design/references/page-specs/styles/default/scenes/admin/mockups/list-page/运单管理-钴蓝.html",
424
- "sids": [
425
- "admin.layout.sidebar",
426
- "admin.layout.sidebar.logo_area",
427
- "admin.layout.sidebar.menu",
428
- "admin.layout.header",
429
- "admin.layout.header.collapse_trigger",
430
- "admin.layout.header.lang_switch",
431
- "admin.layout.header.fullscreen",
432
- "admin.layout.header.setting_button",
433
- "admin.layout.header.user_profile",
434
- "admin.layout.tabs",
435
- "admin.layout.tabs.home_tab",
436
- "admin.layout.tabs.item",
437
- "admin.layout.tabs.item_active",
438
- "admin.layout.tabs.divider",
439
- "admin.layout.content",
440
- "admin.content.container",
441
- "component.card.base",
442
- "admin.content.page_header",
443
- "admin.content.filter_area",
444
- "admin.content.table.operation_bar",
445
- "admin.content.table.area",
446
- "admin.content.table.header_cell",
447
- "admin.content.table.cell",
448
- "admin.content.table.cell_status",
449
- "admin.content.table.cell_amount",
450
- "admin.content.table.operation_column",
451
- "admin.content.pagination",
452
- "component.button.primary",
453
- "component.button.default",
454
- "component.button.danger",
455
- "component.tag.status",
456
- "component.input.base",
457
- "component.pagination.base"
458
- ]
459
- },
460
- "coverage": {
461
- "registry": "project-ui-design/references/page-specs/styles/default/scenes/admin/restore-registry.json",
462
- "registrable": 186,
463
- "applicable": 186,
464
- "covered": 186,
465
- "gaps": []
466
- },
467
- "notes": "钴蓝主题 admin 列表页完整还原变更集(首版,待 verify 验收)。值优先取效果图精确字面量;官方主色走语义值 钴蓝-5。侧栏为深色 #001529(钴蓝主题壳层约定)。cell_thumb 列本页未出现故未声明;sidebar.collapse_trigger / header.logo_area 按出厂中性收口(visible:false)。"
468
- }