diff --git a/WebSite/index.html b/WebSite/index.html index 21dfe69..6048cb1 100644 --- a/WebSite/index.html +++ b/WebSite/index.html @@ -2,12 +2,12 @@ + - My Google AI Studio App + 模型逆向系统
- diff --git a/WebSite/public/logo.png b/WebSite/public/logo.png new file mode 100644 index 0000000..6b9ee7e Binary files /dev/null and b/WebSite/public/logo.png differ diff --git a/WebSite/src/components/Login.tsx b/WebSite/src/components/Login.tsx index 86461fb..3fdd9f7 100644 --- a/WebSite/src/components/Login.tsx +++ b/WebSite/src/components/Login.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import { motion } from 'motion/react'; -import { Layout, Lock, User, CheckCircle2 } from 'lucide-react'; +import { Lock, User } from 'lucide-react'; interface LoginProps { onLogin: () => void; @@ -28,12 +28,16 @@ export default function Login({ onLogin }: LoginProps) { className="w-full max-w-md" >
-
-
- +
+
+ 模型逆向系统
-

基于模型逆向体素化及DICOM分割标注系统

-

模型逆向系统

+

模型逆向系统

+

基于模型逆向体素化及DICOM分割标注系统

diff --git a/WebSite/src/components/Sidebar.tsx b/WebSite/src/components/Sidebar.tsx index 13d5466..756fd8d 100644 --- a/WebSite/src/components/Sidebar.tsx +++ b/WebSite/src/components/Sidebar.tsx @@ -41,8 +41,12 @@ export default function Sidebar({ className="h-screen bg-slate-900 text-slate-300 flex flex-col relative z-20 transition-all duration-300 shadow-2xl" >
-
- +
+ 模型逆向系统
{!collapsed && ( ` 改为 `模型逆向系统`。 +3. 修改 favicon。 + - 在 `WebSite/index.html` 中增加或更新 ``。 +4. 修改登录页。 + - 将 `Login.tsx` 顶部的 lucide `Layout` 图标替换为 `模型逆向系统`。 + - 标题显示为 `模型逆向系统`，保留或简化副标题以避免视觉重复。 +5. 修改左侧栏。 + - 将 `Sidebar.tsx` 左上角的蓝色方块 `Box` 图标替换为 `模型逆向系统`。 + - 保持左侧栏文字标题为 `模型逆向系统`。 +6. 构建验证。 + - 执行 `npm run build`。 +7. 部署到 4000。 + - 检查 `4000` 端口占用。 + - 使用 `tmux` 会话托管 Vite 服务： + - `node ./node_modules/vite/bin/vite.js --host 0.0.0.0 --port 4000 --strictPort` + - 若原 `revoxelseg-dicom` 会话仍在 `3001`，优先关闭旧会话后使用同名会话部署到 `4000`。 +8. 验证访问。 + - `curl -I http://127.0.0.1:4000/` + - `curl -I http://192.168.3.11:4000/` + +## 预计文件变更 + +- 新增 `WebSite/public/logo.png`。 +- 修改 `WebSite/index.html`。 +- 修改 `WebSite/src/components/Login.tsx`。 +- 修改 `WebSite/src/components/Sidebar.tsx`。 +- 更新 `工程分析/测试方案-2026-05-04-03-08-20.md` 执行结果。 +- 更新 `工程分析/经验记录.md`。 + +## 兼容性与回滚方案 + +- favicon 和 logo 统一引用 `/logo.png`，便于后续替换资源。 +- 若 logo 文件不可用，可先不提交代码修改，等待用户提供本地图片文件。 +- 若 `4000` 端口不可用，记录占用进程并等待用户决定是否停止占用服务或改端口。 +- 回滚时恢复 `index.html`、`Login.tsx`、`Sidebar.tsx`，并停止 `4000` 对应 tmux 会话。 + +## 人工审核状态 + +已确认并执行。 + +确认记录： + +- 用户已回复 `确认执行`。 +- 附件 logo 已在环境中确认，对应文件为 `/tmp/logo_check.png`，已复制为 `WebSite/public/logo.png`。 diff --git a/工程分析/测试方案-2026-05-04-03-08-20.md b/工程分析/测试方案-2026-05-04-03-08-20.md new file mode 100644 index 0000000..baa177e --- /dev/null +++ b/工程分析/测试方案-2026-05-04-03-08-20.md @@ -0,0 +1,102 @@ +# 测试方案 + +时间戳：2026-05-04-03-08-20 + +## 测试目标 + +验证 title、favicon、登录页 logo、左侧栏 logo 修改生效，并确认项目部署到 `http://192.168.3.11:4000/`。 + +## 静态检查 + +- 检查 `WebSite/public/logo.png` 是否存在。 +- 检查 `WebSite/index.html`： + - `` 为 `模型逆向系统`。 + - favicon 指向 `/logo.png`。 +- 检查 `WebSite/src/components/Login.tsx`： + - 登录页顶部使用 `/logo.png`。 + - 登录页主标题为 `模型逆向系统`。 +- 检查 `WebSite/src/components/Sidebar.tsx`： + - 左上角使用 `/logo.png`。 + - 左上角文字为 `模型逆向系统`。 + +## 构建验证 + +在 `WebSite/` 下执行： + +```bash +npm run build +``` + +预期结果： + +- Vite 构建成功。 +- 不出现 TypeScript 编译错误。 + +## 部署验证 + +执行端口检查： + +```bash +ss -ltnp | rg ':4000\b' || true +``` + +使用 `tmux` 启动服务： + +```bash +tmux new-session -d -s revoxelseg-dicom 'cd /home/wkmgc/Desktop/ReVoxelSeg_DICOM/WebSite && node ./node_modules/vite/bin/vite.js --host 0.0.0.0 --port 4000 --strictPort' +``` + +验证 HTTP 响应： + +```bash +curl -I http://127.0.0.1:4000/ +curl -I http://192.168.3.11:4000/ +``` + +预期结果： + +- 两个地址均返回 `HTTP/1.1 200 OK`。 + +## 页面验证 + +- 打开 `http://192.168.3.11:4000/`。 +- 浏览器标签标题显示 `模型逆向系统`。 +- 标签页图标显示用户提供的 logo。 +- 登录页顶部显示用户提供的 logo。 +- 登录后左上角显示用户提供的 logo。 +- 折叠侧边栏后 logo 不变形、不溢出。 + +## 回归风险 + +- logo 图片尺寸较大时可能影响布局，需要通过固定容器尺寸和 `object-contain` 控制。 +- favicon 可能受浏览器缓存影响，需要强制刷新或无痕窗口验证。 +- 端口切换可能导致旧 `3001` 地址不再访问当前项目。 + +## 人工审核状态 + +已确认并执行。 + +确认记录： + +- 用户已回复 `确认执行`。 + +## 执行结果 + +- `WebSite/public/logo.png` 已创建，图片为用户提供的 logo，格式为 PNG RGBA，尺寸 `429 x 429`。 +- `WebSite/index.html` 已更新： + - favicon 指向 `/logo.png`。 + - title 为 `模型逆向系统`。 +- `WebSite/src/components/Login.tsx` 已更新： + - 登录页顶部使用 `/logo.png`。 + - 登录页主标题为 `模型逆向系统`。 +- `WebSite/src/components/Sidebar.tsx` 已更新： + - 左上角使用 `/logo.png`。 + - 左上角文字保持为 `模型逆向系统`。 +- `npm run build` 执行成功。 +- `npm run lint` 执行成功。 +- Vite 构建仍有大 chunk 警告，当前不影响本次 logo/title 修改。 +- 已关闭旧的 `revoxelseg-dicom` 部署会话，并使用同名 `tmux` 会话部署到 `4000`。 +- `curl -I http://127.0.0.1:4000/` 返回 `HTTP/1.1 200 OK`。 +- `curl -I http://192.168.3.11:4000/` 返回 `HTTP/1.1 200 OK`。 +- `curl -I http://127.0.0.1:4000/logo.png` 返回 `HTTP/1.1 200 OK` 且 `Content-Type: image/png`。 +- 当前监听端口确认：`0.0.0.0:4000`。 diff --git a/工程分析/经验记录.md b/工程分析/经验记录.md index f18c7de..79138f7 100644 --- a/工程分析/经验记录.md +++ b/工程分析/经验记录.md @@ -73,3 +73,39 @@ C. 解决问题方案 D. 后续如何避免问题 需要保留长时间运行的开发服务时，优先使用 `tmux` 会话托管，并用 `tmux capture-pane -pt <session>` 查看启动日志，用 `curl` 验证 HTTP 响应。 + +## 2026-05-04-03-08-20 附件 logo 落盘与静态资源引用 + +A. 具体问题 + +用户要求将 title 图标、登录页 logo 和左上角 logo 都替换为对话中提供的图片，需要把附件图片变为前端可稳定访问的静态资源。 + +B. 产生问题原因 + +前端组件不能直接引用对话附件，必须先将图片保存到项目静态资源目录，再通过固定 URL 引用。 + +C. 解决问题方案 + +确认 `/tmp/logo_check.png` 与用户提供的 logo 一致后，将其复制到 `WebSite/public/logo.png`。`index.html` favicon、登录页和侧边栏统一通过 `/logo.png` 引用。 + +D. 后续如何避免问题 + +后续涉及用户上传图片替换项目资源时，先在本地确认附件是否已落盘；优先放入 `WebSite/public/` 并使用根路径引用，避免组件间重复存放资源。 + +## 2026-05-04-03-08-20 指定端口重新部署 + +A. 具体问题 + +用户要求将项目部署到 `http://192.168.3.11:4000/`，需要从原先 `3001` 端口切换到 `4000`。 + +B. 产生问题原因 + +项目早前使用 `tmux` 会话 `revoxelseg-dicom` 托管在 `3001`，本次需求指定了新的访问端口。 + +C. 解决问题方案 + +先检查 `4000` 端口是否空闲，然后关闭旧 `revoxelseg-dicom` 会话，使用同名 `tmux` 会话启动 Vite：`node ./node_modules/vite/bin/vite.js --host 0.0.0.0 --port 4000 --strictPort`。随后用本机地址和内网地址分别验证 HTTP 200。 + +D. 后续如何避免问题 + +每次调整部署端口前先检查端口占用和现有 `tmux` 会话；部署后同时验证 `127.0.0.1` 与目标内网 IP，并把实际访问地址写入测试方案执行结果。 diff --git a/工程分析/需求分析-2026-05-04-03-08-20.md b/工程分析/需求分析-2026-05-04-03-08-20.md new file mode 100644 index 0000000..5d2b9b6 --- /dev/null +++ b/工程分析/需求分析-2026-05-04-03-08-20.md @@ -0,0 +1,51 @@ +# 需求分析 + +时间戳：2026-05-04-03-08-20 + +## 原始需求摘要 + +用户要求将项目的 title 图标、登录界面 logo、左上角 logo 均替换为用户提供的医疗风格彩色 logo；浏览器标题改为“模型逆向系统”；并将项目部署到 `http://192.168.3.11:4000/`。 + +## 业务目标 + +- 统一系统品牌视觉。 +- 让浏览器标签页标题和 favicon 与“模型逆向系统”一致。 +- 登录页顶部标识改为用户提供的 logo。 +- 系统左上角侧边栏标识改为用户提供的 logo。 +- 使用指定地址和端口完成重新部署。 + +## 输入与输出 + +输入： + +- 用户提供的 logo 图片。 +- 目标标题：“模型逆向系统”。 +- 目标部署地址：`http://192.168.3.11:4000/`。 + +输出： + +- `WebSite/index.html` 中 title 更新。 +- `WebSite/index.html` 中 favicon 指向新 logo。 +- 登录页使用新 logo。 +- 左侧栏顶部使用新 logo。 +- 本地开发服务或部署服务运行在 `0.0.0.0:4000`，可通过 `http://192.168.3.11:4000/` 访问。 + +## 影响范围 + +- `WebSite/index.html` +- `WebSite/src/components/Login.tsx` +- `WebSite/src/components/Sidebar.tsx` +- 可能新增 `WebSite/public/` 下的 logo 资源文件。 +- 可能调整运行端口和现有 `tmux` 部署会话。 + +## 风险点 + +- 当前对话中的 logo 图片可能未自动落盘为本地文件；如无法直接读取附件，需要用户提供图片文件路径，或由用户将图片保存到指定路径。 +- `4000` 端口可能已被其他服务占用，执行前需要检查。 +- 当前项目已在 `3001` 端口通过 `tmux` 会话 `revoxelseg-dicom` 部署，切换到 `4000` 时需要重启该会话或新建会话。 +- favicon 使用 PNG 时浏览器可能缓存旧图标，验证时可能需要强制刷新。 + +## 待确认问题 + +- 若当前附件无法在文件系统中读取，是否允许用户将 logo 保存为 `WebSite/public/logo.png` 后再继续。 +- 是否需要保留 `3001` 旧服务，还是将 `revoxelseg-dicom` 会话切换到 `4000`。