46 lines
2.4 KiB
Markdown
46 lines
2.4 KiB
Markdown
# 第一版前端网页实现与项目清理计划
|
||
|
||
## 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 生成器为唯一目标。
|