模具进度协同看板

① 提取来源与方法

参考站点：https://srm.cjtconn.com/web/#/login（Vue 3 + Element Plus 的 SRM 采购协同平台登录页）。
色值来自站点打包样式表 /web/css/index.WStLPexT.css 中的 .cjt-login 主题变量与 :root 品牌变量；组件尺寸来自 .cjt-input / .cjt-submit / .cjt-fact / .cjt-login__split；色彩占比来自 1440×900 截图的 16 级量化像素统计（近白像素 69.5%，品牌绿实心像素约 1.5%，浅绿背景约 20.4%）。本页只复用视觉参数，未使用其 Logo、文案与品牌资产。

② 标注版色卡（可直接用于自有产品）

③ 纯色版色卡（交付开发 / 导入设计工具）

④ 风格 DNA 量化摘要

主色相 146°（冷绿 / 偏中性），饱和度区间 8%–100%，明度区间 9%–97%；
结构特征：浅底 + 小面积高饱和强调——近白与浅绿背景合计约 89.9%，品牌绿实心仅约 1.5%；
背景肌理：4 层 radial-gradient 网格（主色 16% / 9% 透明度）+ 1px 点阵（opacity .08）+ 电路走线（opacity .10）；
典型密度：顶栏内边距 20px 44px，左侧品牌栏 67.5% / 右侧表单栏 32.5%，卡片槽宽 380px；
圆角体系：3 / 5 / 8 / 9 / 10 / 11 / 12 / 16 / 999px，输入框与按钮统一 11px，胶囊标签 999px。

⑤ 视觉规范表（令牌化 · 全部有具体数值）

⑥ 前端代码片段（复制即用）

<link rel="stylesheet" href="./design-tokens.css">

<button class="tk-btn tk-btn--primary">提交进度</button>
<input class="tk-input" placeholder="请输入模具编号">
<div class="tk-surface" style="padding:16px">卡片内容</div>

/* 直接引用令牌，改一处即可全站换肤 */
.tk-btn--primary{
  height: var(--btn-h);              /* 48px */
  border-radius: var(--r-xl);        /* 11px */
  background: var(--brand-strong);   /* #107936 · 白字 5.51:1 */
  color: #fff;                      /* 达标 AA */
  font: 600 14px/1 var(--font-sans);
  box-shadow: var(--sh-sm);          /* 0 1px 3px #0000000f */
}
.tk-btn--primary:hover{ background: var(--brand-deep); }  /* #006023 · 7.79:1 */

/* 页面浅底网格（参考站 .cjt-backdrop__mesh 简化版） */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none;
  background:
    radial-gradient(58% 46% at 8% 4%, rgba(0,168,74,.10) 0%, transparent 62%),
    radial-gradient(46% 40% at 94% 12%, rgba(96,200,120,.14) 0%, transparent 64%);
}

⑦ 设计评审问题清单（发现 → 严重度 → 修正）

⑧ 假设汇总

假设：使用者为模具 / 项目管理人员，任务是快速掌握各模具工序进度与延期；
假设：终端为 PC 端内网看板（主断点 1280px / 768px），浏览器为 Chrome 或 Edge 桌面版；
假设：数据文件为本机模具进度跟进表_V8 1.xlsx，页面不修改源文件、只读取；
假设：所有 KPI、状态、延期数、进度值均由表格单元格计算得出，页面不内置任何业务数值；
待确认：是否需要暗色主题（参考站含 dark 令牌，本版仅交付浅色）、是否需要导出 / 打印、是否需要多人共享同一数据源。

本内容由 AI 生成，请核实后使用。