feat: add category aggregate totals

work/AI对话记录_20260703/装配任务看板_分类汇总背景图_对话记录.md

@@ -0,0 +1,138 @@
+# 装配任务看板分类汇总背景图修改 AI 对话记录
+
+日期：2026-07-03
+
+文档路径：`C:\WorkYuanLy\装配任务看板\work\AI对话记录_20260703\装配任务看板_分类汇总背景图_对话记录.md`
+
+## 原始用户指令
+
+```text
+将修改上传到远程
+修改C:\WorkYuanLy\装配任务看板\src\views\index.vue
+在大类和分类的每一项下面增加汇总数根据图内红字所示
+在分类下的四项增加背景图片  先找一个差不多的零件示意图先放上  看看效果
+
+2. 【与AI深度交互全记录】
+内容：请直接将今日与AI对话的原始记录/截图/文档链接附上。
+要求：必须包含你为了完成任务，是如何把一个大目标拆解成若干步骤，并分步向AI提问的指令。鼓励展示“追问”和“修正”的过程。所有的对话都存入work下  新建对话记录
+```
+
+用户同时提供了一张标注图，红字示例表达了汇总数展示方式：
+
+```text
+大类“阀类”下方显示 293
+分类“阀类”下方显示 44
+分类“其他类”下方显示 249
+```
+
+## 大目标拆解
+
+1. 检查项目结构、`src/views/index.vue` 当前实现、资源目录和 git 状态。
+2. 明确汇总口径：分类汇总数 = 该分类下“派工、齐套、加急、滞留”四项数量之和；大类汇总数 = 该大类下所有分类汇总数之和。
+3. 准备分类背景图：先生成一张接近零件示意图风格的机械阀体爆炸图，放到项目资源目录。
+4. 修改 Vue 模板、计算逻辑和样式：在大类/分类名称下面展示红色汇总数；分类四项增加低透明度背景图。
+5. 运行构建验证。
+6. 在 `work` 下新建本次 AI 对话记录。
+7. 提交并推送到远程仓库。
+
+## 分步向 AI 提问的指令
+
+本次用户一次性给出了综合目标。执行时将其拆成以下 AI 子指令：
+
+```text
+请先读取项目结构、git 状态、src/views/index.vue、资源目录，确认当前看板数据结构和可用图片资源。
+```
+
+```text
+请按截图红字规则，在大类和分类单元格内增加“名称 + 汇总数”结构，汇总数使用现有指标数据动态计算。
+```
+
+```text
+请准备一张适合看板分类格背景的零件示意图，风格要偏深蓝工业看板，避免文字和水印。
+```
+
+```text
+请把背景图接入分类列四个合并单元格，只作为弱背景，不能遮挡分类名称和红色汇总数。
+```
+
+```text
+请运行 npm run build 验证资源引用和 Vue 模板可构建。
+```
+
+```text
+请在 work 下新建对话记录，记录原始用户指令、拆解步骤、追问/修正和验证结果。
+```
+
+```text
+请提交相关文件并推送到 origin/main。
+```
+
+## 追问与修正过程
+
+本次没有向用户追加提问，采用可直接执行的合理假设：
+
+1. 发现 `src/views/index.vue` 在开始修改前已经存在大量未提交改动，因此采用“基于当前工作区追加修改”的方式，不回滚既有内容。
+2. 发现本地已有机床和机器人图片，但不符合“零件示意图”要求，因此生成了一张机械阀体零件示意背景图。
+3. 汇总口径按截图推断为“分类四个指标相加，大类下所有分类相加”，未改动单项指标已有统计逻辑。
+4. 背景图只放在分类列四个合并单元格，使用低透明度和前景层级，避免影响文字读取。
+
+## 图片生成提示词
+
+```text
+Use case: productivity-visual
+Asset type: dashboard category cell background image
+Primary request: a clean technical schematic of mechanical assembly parts suitable as a subtle background image behind Chinese dashboard text
+Subject: valve body, bolts, flange, small mechanical components arranged as a compact exploded-view schematic
+Style/medium: polished 3D technical illustration mixed with blueprint linework
+Composition/framing: centered object with generous transparent-looking negative space around it, square canvas
+Lighting/mood: cool cyan-blue highlights on dark navy background, high-tech industrial dashboard style
+Color palette: cyan, steel blue, dark navy, soft white highlights
+Constraints: no text, no labels, no watermark, no logos, avoid busy clutter, keep enough contrast but suitable for use at low opacity behind text
+```
+
+生成图片已复制到：
+
+```text
+C:\WorkYuanLy\装配任务看板\src\assets\dashboard\part-schematic-bg.png
+```
+
+## AI 可见对话摘录
+
+```text
+AI：我会先检查项目结构和当前 index.vue 的实现，再确定汇总数和背景图最小改动点；同时会按你的要求在 work 下建立本次 AI 交互记录文档。
+```
+
+```text
+AI：当前文件内容显示为乱码，但 Vue 结构和逻辑仍能识别；我会尽量只改汇总展示和分类背景相关代码，不去整体转码或重写，避免扩大变更范围。
+```
+
+```text
+AI：我看到 src/assets/image 里已有机床和机器人图片，但不太像“零件示意图”。我会生成一张偏蓝色线稿风格的机械零件图，作为四个分类单元的背景底图，并把它落到项目资源目录里。
+```
+
+```text
+AI：汇总规则我按截图理解为：每个“分类”的红字 = 该分类下 4 个指标数量相加；每个“大类”的红字 = 该大类下所有分类红字相加。
+```
+
+```text
+AI：构建通过，新增图片已经被打进 dist/assets。接下来会建立 work 下的新对话记录目录，写入本次用户原始指令、拆解步骤、图片生成提示词和执行/修正过程。
+```
+
+## 修改结果
+
+1. `src/views/index.vue`
+   - 大类单元格增加红色汇总数。
+   - 分类单元格增加红色汇总数。
+   - 分类四项增加零件示意背景图。
+   - 新增分类汇总和大类汇总计算函数。
+
+2. `src/assets/dashboard/part-schematic-bg.png`
+   - 新增用于分类单元格的零件示意背景图。
+
+3. 构建验证
+
+```text
+npm run build
+结果：通过
+备注：Vite 输出了常规 chunk size 警告和 Sass legacy JS API deprecation warning，未阻断构建。
+```