Excelbuilder/Agents/第一版前端网页实现与项目清理计划.md

第一版前端网页实现与项目清理计划

Summary

• 按当前设计文档实现第一版 Vue2 前端网页：左侧设备列表，右侧工位基本变量详情，点击生成标准 SignalTable_CZ.xlsx。
• Excel 只导出两个 Sheet：MES_基本变量原始数据、设备类型对应表。
• 清理旧大屏项目遗留文件，只保留本工具运行、构建、文档所需内容。

Key Changes

• 页面实现：
  • 新增/重写 src/views/SignalTableGenerator.vue，实现微信式左右布局。
  • 左侧支持设备新增、编辑、删除、查询、选中高亮、启用/禁用。
  • 新增/编辑弹窗包含 设备名称 / 工位名称 / 设备型号 / 设备IP / 是否启用 / DB（高级）。
  • 右侧显示当前设备信息和变量清单；无选中设备时显示空状态与设备统计。
  • 顶部提供 校验、生成 Excel 按钮。
• 数据与导出：
  • 重写 src/data/default-signal-table.json，只保留 devices 和 variables。
  • 重写 src/utils/signalTableBuilder.js，只生成两个 Sheet。
  • 重写 src/utils/excelWriter.js，负责 .xlsx 下载、基础列宽、表头样式。
  • 设备类型对应表 导出列固定为 设备IP / 设备类型 / DB / 是否启用 / 工位号 / 数据来源。
  • MES_基本变量原始数据 保持 38 列模板形态。
• 入口简化：
  • 简化 src/main.js、src/App.vue、src/router/index.js。
• 依赖简化：
  • package.json 只保留本工具需要的运行依赖和 Vue CLI 构建依赖。
  • 删除旧大屏相关依赖。

Test Plan

• 运行 npm install 同步精简后的依赖和 package-lock.json。
• 运行 npm run build，确认 Vue 项目可构建。
• 页面手测：
  • 新增设备后左侧出现新行。
  • 编辑设备后左侧和右侧同步变化。
  • 删除选中设备后右侧进入空状态。
  • 查询设备能按设备名称或工位名称过滤。
• Excel 校验：
  • 点击生成后文件名为 SignalTable_CZ.xlsx。
  • 文件只包含两个 Sheet。
  • MES_基本变量原始数据 保持 38 列。
  • 禁用设备导出为 是否启用 = 0。

Assumptions

• 第一版不接后端，数据只在前端内存中维护。
• 第一版不做 Excel 导入，只做网页编辑和 Excel 导出。
• DB 虽然是高级字段，但导出时必填。
• 清理旧文件以当前 Excel 生成器为唯一目标。