聊天框内 ECharts 影响图 · 2026-07-31

目标

用户要在对话框里"演示 ECharts 图"，让影响范围分析从黑框 JSON 变成看得懂的力导向图，强化演示效果。约束：不要搞乱代码、稳一点、不要提交。

改动（仅前端，后端零改动，未提交）

1. 新增 src/components/ImpactChart.vue

• 自包含 ECharts 力导向图组件，懒加载 import('echarts')（与 BomAssistant.vue 同模式，不拖累首屏）。
• 接收 props：graph:{nodes,links} + summary（人话总结）。节点按类型着色（零件/BOM/型号/产品/工艺），带图例。

1. src/views/AiWorkbench.vue 三处修改

• 顶部 import ImpactChart。
• 消息渲染模板新增 v-else-if="msg.type === 'chart'" 分支，挂载 。
• sendMessage 中新增关键词拦截：命中 影响范围|影响分析|where.?used|受影响|波及 时调用新增的 tryImpactAnalysis()，直接打 /api/change/analyze，把真实返回的 impactChain 边 + 各 affected 节点构建成图，推送 type:'chart' 消息。
• tryImpactAnalysis() 逻辑：从真实响应 target_id + affectedParts/Boms/Models/Products/Processes + impactChain 构建图；查不到对象时返回"未在 SCSAI 中找到该对象的关联数据"（替代原 unknown 假数据，更诚实）；服务异常时降级为普通 AI 对话，不阻断主流程。

技术验证（已实测）

• 构建通过：npm run build ✓ built in 22.60s；echarts vendor chunk (912KB) + ImpactChart 编译进 aiworkbench chunk。
• 构建产物确认：ImpactChart、impact-message、_graph、_summary、type:"chart" 分支、/api/change/analyze 调用均在 dist/assets/views-aiworkbench-*.js 中。
• 实时接口+图构建链路（node 实测，非 mock）：POST /api/change/analyze {description:"查询 P-1001 的影响范围"} → success:true，构建出 4 节点（P-1001 + 3 个装配体）+ 6 边，0 悬空边。图数据有效。
• 诚实性：该零件在 SCSAI 只有 part 级链路，故图如实显示 3 个下游装配体，不编造型号/产品——避免演示穿帮。

演示使用方式

在聊天框输入：「查询 P-1001 的影响范围」「帮我做个影响分析」「P-1001 的 where-used」等，即返回：一句话总结 + 影响传播力导向图。

注意事项 / 遗留

• 当前 SCSAI 中该示例零件只到 part→bom 层级，演示图偏浅（中心→3 装配体）。若要"层级深、显震撼"，需在 SCSAI 造一个有 型号→产品 多级的真实样例零件（演示前备好 2-3 个真实存在的编号）。
• 该改动未提交（遵守用户"不要提交"约束）；git status 仅 M src/views/AiWorkbench.vue + ?? src/components/ImpactChart.vue。
• 运行中的 node server 一度因我自己的挂起测试脚本（_verify_graph.cjs）占用 analyze 端点而卡死；已清理挂起进程、重启 server（pid 18408→23228，端口 3006），现已恢复 /api/health 200。
• 浏览器控件当前被禁用，未能截图前端渲染；渲染逻辑经构建产物 + 实时数据链路双重验证，但浏览器内视觉效果需用户在本地打开确认。