feat(deploy/ui): 运维前端重写为 React + 统一蓝白设计系统

redxin commented

2026-06-21 15:07:33 +00:00

Owner

背景

部署工具 webtool、网点 agent 本机控制台、营业大屏与主前端最新设计系统（clinical-blue 蓝白）观感不一致。排查发现代码反复引用的 design/文档原型设计方案（README『二、设计语言』、AgentDashboard.dc.html）经 git 全史核验从未入库（幽灵引用），唯一权威基准是主前端 client/src/renderer/src/styles/variables.css。

改动

webtool：手写 web/ → React+Vite 工程 webui/。部署向导 6 屏 + 控制中心 dashboard 全部功能对等（23 端点 / SSE 流式部署日志 / 凭据一次性打码回显 / 远端路径浏览 / 同机冲突预校验 / 控制动作二次确认）；main.go 改 embed webui/dist。
agent 控制台：手写 webui → React。三态状态机（接入向导 / 待审核 / 已上线自助管理）+ 5 本机控制端点对等；control.go 改 embed webui/dist；Dockerfile 复用已提交 dist（免 Node 构建阶段）+ 新增 deploy/.dockerignore 排除 node_modules。
营业大屏 PublicViewPage：深色航显 → 蓝白医疗（18 个 --v-* 令牌重映射 + 逐区块对比反转），仅样式换肤，数据/SSE/组件不动。
字体取舍：运维前端只打包 Manrope + JetBrains Mono，中文走系统字体，避免 Noto Sans SC 全切片把嵌入二进制撑大十几 MB（业务客户端不受影响）。
清理 variables.css/themes.ts 指向幽灵文档的注释；dist 产物入库保证 go build/go test 在无 Node 环境自洽。

验证

agent 与 webtool 两工程 npm run build + tsc --noEmit + go build + go test ./... 全部通过；大屏为安全的纯样式改动。集群实机端到端验收待后续。

🤖 Generated with Claude Code

## 背景部署工具 webtool、网点 agent 本机控制台、营业大屏与主前端最新设计系统（clinical-blue 蓝白）观感不一致。排查发现代码反复引用的 `design/文档原型设计方案`（README『二、设计语言』、`AgentDashboard.dc.html`）经 git 全史核验**从未入库**（幽灵引用），唯一权威基准是主前端 `client/src/renderer/src/styles/variables.css`。 ## 改动 - **webtool**：手写 `web/` → React+Vite 工程 `webui/`。部署向导 6 屏 + 控制中心 dashboard 全部功能对等（23 端点 / SSE 流式部署日志 / 凭据一次性打码回显 / 远端路径浏览 / 同机冲突预校验 / 控制动作二次确认）；`main.go` 改 embed `webui/dist`。 - **agent 控制台**：手写 `webui` → React。三态状态机（接入向导 / 待审核 / 已上线自助管理）+ 5 本机控制端点对等；`control.go` 改 embed `webui/dist`；Dockerfile 复用已提交 dist（免 Node 构建阶段）+ 新增 `deploy/.dockerignore` 排除 node_modules。 - **营业大屏 PublicViewPage**：深色航显 → 蓝白医疗（18 个 `--v-*` 令牌重映射 + 逐区块对比反转），仅样式换肤，数据/SSE/组件不动。 - **字体取舍**：运维前端只打包 Manrope + JetBrains Mono，中文走系统字体，避免 Noto Sans SC 全切片把嵌入二进制撑大十几 MB（业务客户端不受影响）。 - 清理 `variables.css`/`themes.ts` 指向幽灵文档的注释；dist 产物入库保证 `go build`/`go test` 在无 Node 环境自洽。 ## 验证 agent 与 webtool 两工程 `npm run build` + `tsc --noEmit` + `go build` + `go test ./...` 全部通过；大屏为安全的纯样式改动。集群实机端到端验收待后续。 🤖 Generated with [Claude Code](https://claude.com/claude-code)

redxin added 1 commit

2026-06-21 15:07:33 +00:00

feat(deploy/ui): 运维前端重写为 React + 统一蓝白设计系统

CI / Frontend (Tauri/TS) (pull_request) Has been cancelled

Details

CI / Backend (Go) (pull_request) Has been cancelled

Details

e9e4e28f4e

把部署工具 webtool、网点 agent 本机控制台、营业大屏统一到主前端 clinical-blue
蓝白设计令牌（变量/字体取自 client/src/.../styles），三者视觉与工作台一致。

- webtool: 手写 web/ → React+Vite 工程 webui/；部署向导 6 屏 + 控制中心 dashboard
  全部功能对等（23 端点 / SSE 流式部署日志 / 凭据一次性打码回显 / 远端路径浏览 /
  同机冲突预校验 / 控制动作二次确认）；main.go 改 //go:embed webui/dist。
- agent 控制台: 手写 webui → React；三态状态机（接入向导 / 待审核 / 已上线自助管理）
  + 5 本机控制端点对等；control.go 改 //go:embed webui/dist；Dockerfile 复用已提交
  dist（免 Node 构建阶段）+ 新增 deploy/.dockerignore 排除 node_modules。
- 营业大屏 PublicViewPage: 深色航显 → 蓝白医疗（18 个 --v-* 令牌重映射 + 逐区块
  对比反转/阴影校准）；仅样式换肤，数据/SSE/组件不动。
- 字体取舍: 运维前端只打包 Manrope + JetBrains Mono，中文走系统字体，避免 Noto
  Sans SC 全切片把嵌入二进制撑大十几 MB（业务客户端不受影响）。
- 清理 variables.css / themes.ts 中指向「design/文档原型设计方案」（经 git 全史核验
  从未入库）的幽灵注释，明确权威来源即代码内 hex 令牌。
- dist 产物提交入库，保证 go build / go test 在无 Node 环境下自洽。

验证：agent 与 webtool 两工程 npm run build + tsc --noEmit + go build + go test ./...
全部通过；大屏为安全的纯样式改动。

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

CI / Frontend (Tauri/TS) (pull_request) Has been cancelled

Details

CI / Backend (Go) (pull_request) Has been cancelled

Details

This pull request has changes conflicting with the target branch.

client/src/renderer/src/pages/view/PublicViewPage.module.css
deploy/clinic-node/agent/control.go
deploy/clinic-node/agent/webui/dist/index.html
deploy/clinic-node/agent/webui/package-lock.json
deploy/clinic-node/agent/webui/src/api.ts
deploy/clinic-node/agent/webui/src/components/icons.tsx
deploy/clinic-node/agent/webui/src/styles/app.css
deploy/clinic-node/agent/webui/src/types.ts
deploy/clinic-node/agent/webui/src/views/Active.tsx
deploy/clinic-node/agent/webui/src/views/Unpaired.tsx
deploy/webtool/webui/dist/index.html
deploy/webtool/webui/package-lock.json
deploy/webtool/webui/package.json
deploy/webtool/webui/src/App.tsx
deploy/webtool/webui/src/components/BrowseModal.tsx
deploy/webtool/webui/src/components/HostCard.tsx
deploy/webtool/webui/src/dashboard/Dashboard.tsx
deploy/webtool/webui/src/dashboard/api.ts
deploy/webtool/webui/src/hooks/useWizard.ts
deploy/webtool/webui/src/screens/Complete.tsx
deploy/webtool/webui/src/screens/Deploy.tsx
deploy/webtool/webui/src/screens/Health.tsx
deploy/webtool/webui/src/screens/Hosts.tsx
deploy/webtool/webui/src/screens/Mode.tsx
deploy/webtool/webui/src/styles/app.css
deploy/webtool/webui/src/types.ts
deploy/webtool/webui/src/utils/credsMask.ts
deploy/webtool/webui/src/utils/phases.ts

View command line instructions

Checkout

From your project repository, check out a new branch and test the changes.

git fetch -u origin claude/dazzling-mendeleev-5633de:claude/dazzling-mendeleev-5633de

git switch claude/dazzling-mendeleev-5633de

Merge

Merge the changes and update on Forgejo.

Warning: The "Autodetect manual merge" setting is not enabled for this repository, you will have to mark this pull request as manually merged afterwards.

git switch main

git merge --no-ff claude/dazzling-mendeleev-5633de

git switch claude/dazzling-mendeleev-5633de

git rebase main

git switch main

git merge --ff-only claude/dazzling-mendeleev-5633de

git switch claude/dazzling-mendeleev-5633de

git rebase main

git switch main

git merge --no-ff claude/dazzling-mendeleev-5633de

git switch main

git merge --squash claude/dazzling-mendeleev-5633de

git switch main

git merge --ff-only claude/dazzling-mendeleev-5633de

git switch main

git merge claude/dazzling-mendeleev-5633de

git push origin main

Rows
Columns

feat(deploy/ui): 运维前端重写为 React + 统一蓝白设计系统 #215

背景

改动

验证

Checkout

Merge