106 lines
3.9 KiB
Markdown
106 lines
3.9 KiB
Markdown
# 实现方案
|
||
|
||
时间戳:2026-05-04-03-21-40
|
||
|
||
## 修改目标
|
||
|
||
将当前前端静态演示升级为前后端协调系统:
|
||
|
||
- 后端统一管理登录状态、用户列表、项目列表和演示环境。
|
||
- 项目列表默认载入 `Head_CT_DICOM` 与 `Head_CT_ReConstruct`。
|
||
- 恢复演示环境出厂设置后恢复默认项目和默认用户。
|
||
- 逆向工作区通过后端生成并下载 `.nii.gz` 分割 mask。
|
||
- 继续部署到 `http://192.168.3.11:4000/`。
|
||
|
||
## 涉及路径
|
||
|
||
- `WebSite/package.json`
|
||
- `WebSite/server.ts`
|
||
- `WebSite/src/lib/api.ts`
|
||
- `WebSite/src/types.ts`
|
||
- `WebSite/src/App.tsx`
|
||
- `WebSite/src/components/Login.tsx`
|
||
- `WebSite/src/components/Overview.tsx`
|
||
- `WebSite/src/components/ProjectLibrary.tsx`
|
||
- `WebSite/src/components/ReverseWorkspace.tsx`
|
||
- `WebSite/src/components/UserManagement.tsx`
|
||
- `WebSite/data/state.json`
|
||
- `WebSite/exports/`
|
||
- `.gitignore`
|
||
- `工程分析/测试方案-2026-05-04-03-21-40.md`
|
||
- `工程分析/经验记录.md`
|
||
|
||
## 技术路线
|
||
|
||
1. 新增 Express 后端 `server.ts`。
|
||
- 开发环境通过 Vite 中间件服务前端。
|
||
- API 和页面共用 `4000` 端口,避免跨域和前后端端口不一致。
|
||
2. 后端状态持久化。
|
||
- 使用 `WebSite/data/state.json` 保存演示状态。
|
||
- 默认用户包括 `admin / 123456`。
|
||
- 当前登录状态由后端统一维护,所有浏览器轮询 `/api/session` 同步。
|
||
3. 默认项目载入。
|
||
- 后端扫描 `../Head_CT_DICOM` 的 `.dcm` 数量。
|
||
- 后端扫描 `../Head_CT_ReConstruct` 的 `.stl` 文件列表。
|
||
- 构造默认项目 `head-ct-demo`,包含 DICOM/STL 路径、数量、模块名称。
|
||
4. 恢复演示环境出厂设置。
|
||
- `POST /api/demo/reset` 重建默认用户、默认项目、登录状态。
|
||
- 前端系统管理页点击按钮后调用该接口,并刷新用户和项目相关数据。
|
||
5. 前端 API 化。
|
||
- `Login` 调用 `/api/login`。
|
||
- `App` 调用 `/api/session` 并轮询同步登录状态。
|
||
- `Overview` 调用 `/api/overview`。
|
||
- `ProjectLibrary` 调用 `/api/projects`。
|
||
- `UserManagement` 调用 `/api/users` 与 `/api/demo/reset`。
|
||
- `ReverseWorkspace` 调用 `/api/projects/:id` 与 `/api/projects/:id/export-mask`。
|
||
6. NIfTI 导出。
|
||
- 后端生成 NIfTI-1 单文件 `.nii.gz`。
|
||
- 使用 Node `zlib.gzipSync` 压缩。
|
||
- 文件保存到 `WebSite/exports/`,同时以 attachment 下载。
|
||
- NIfTI 内容先采用演示 mask 体素数据,尺寸、标签信息和项目元数据由后端生成。
|
||
7. 部署。
|
||
- `npm run build`
|
||
- `npm run lint`
|
||
- 使用 `tmux` 运行 `npm run serve -- --host 0.0.0.0 --port 4000`。
|
||
|
||
## 数据流
|
||
|
||
登录:
|
||
|
||
前端登录页 -> `POST /api/login` -> 后端验证账号密码 -> 更新共享 session -> 所有浏览器轮询 `/api/session` 后同步状态。
|
||
|
||
项目:
|
||
|
||
前端项目库 -> `GET /api/projects` -> 后端扫描或读取默认项目状态 -> 展示 DICOM 数量、STL 模块、路径和状态。
|
||
|
||
重置:
|
||
|
||
系统管理页 -> `POST /api/demo/reset` -> 后端重建默认状态 -> 前端刷新用户和项目。
|
||
|
||
导出:
|
||
|
||
逆向工作区 -> `POST /api/projects/:id/export-mask` -> 后端生成 `.nii.gz` -> 前端下载。
|
||
|
||
## 兼容性与回滚方案
|
||
|
||
- 保留 Vite/React 前端结构,后端通过同端口中间件接入。
|
||
- DICOM/STL 仍不进入 Git。
|
||
- `WebSite/data/state.json` 和 `WebSite/exports/` 作为运行态文件默认不纳入提交。
|
||
- 若后端服务异常,可回滚 `server.ts` 和前端 API 调用改动,恢复纯前端 Vite 部署。
|
||
|
||
## 预计文件变更
|
||
|
||
- 新增 `WebSite/server.ts`
|
||
- 新增 `WebSite/src/lib/api.ts`
|
||
- 修改 `WebSite/package.json`
|
||
- 修改 `WebSite/src/types.ts`
|
||
- 修改主要页面组件以接入 API。
|
||
- 修改 `.gitignore` 排除运行态数据和导出文件。
|
||
- 更新工程分析文档和经验记录。
|
||
|
||
## 人工审核状态
|
||
|
||
本次用户明确要求需求分析、实现方案、测试方案、执行修改均不用人工二次确认。
|
||
|
||
状态:自动确认,继续执行。
|