Files
beads-group/docs/webui-report.md
T

37 lines
3.4 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 店员后台交付报告
实现目录:`perler-beads-webui`。Vue 3 + TypeScript + Element Plus / icons + Pinia + Vue Router + Vite,CSS 原生样式,不含 Tailwind 或外部素材。森林绿与奶油色工作台,桌面侧栏与移动端折叠菜单。
## 已实现
- 管理员账号密码登录,不内置任何凭据。令牌存在 sessionStorage;每次受保护路由导航调用 `/api/me` 确認身份、员工角色与 store-001 门店,禁止仅凭令牌存在放行。401 未授权、403 未登录从业务 envelope 识别。403 清除会话并退出。
- 店内服务列表、数量摘要、状态/服务类型/桌码备注筛选、明确空/载入/错误状态、pending→accepted→completed 操作。10 秒轮询可暂停,隐藏页面不轮询,路由卸载停止计时并 AbortController 取消未完成请求。
- 图纸列表与检索、JSON 导入、名称分类编辑、发布/下架。仅管理员访问;私有图纸仍由服务端鉴权。导入尺寸、格子、色板、门店匹配由服务端权威校验。
- 色板与物料位置编辑抽屉,添加色号、颜色名称、HEX、可用状态;更新整门店色板。桌位新增/编辑、启停;门店信息与双 HTTPS 服务地址编辑。所有配置以当前授权门店提交,无跨店选择假授权。
- 图纸库与有 patternId 的服务任务可下载实际尺寸 SVG,带 Bearer 鉴权;识别下载接口 JSON 错误,释放 Object URL。服务端限制最多 200×200,SVG 是有界文件,客户端采用 Blob 下载;实际打印由店员手动完成。
- 支付与储值始终禁用,没有假支付、假充值或余额。
- 中文页面语言、内部后台 noindex、语义 heading/main/nav、跳转主要内容链接、控件标签、文字状态、键盘焦点、减少动画偏好、移动端抽屉与可横向滚动表格。
- 页面按路由懒加载,Element Plus 按实际组件注册,减少首屏 JS;无第三方字体/图片网络请求。
## 启动
```sh
cd perler-beads-webui
npm ci --cache /tmp/perler-npm-cache
npm run dev
```
开发服务监听 `127.0.0.1:5174`,`/api` 相对地址代理 `127.0.0.1:8080`。生产构建 `dist/`,部署需将 `/api` 代理服务端,并将前端路由回退至 index.html。管理员用户名与密码配置于服务端环境,后台手动输入。
本次本机联调账号:用户名 `admin`,密码 `local-integration-only`,门店 `store-001`。仅适用于本次启动的演示服务;自行部署按 `ADMIN_USERNAME` / `ADMIN_PASSWORD` 配置。完整说明见 [README 的本地管理员说明](../README.md#当前本地演示管理员)。
## 验证
先写 envelope 权限错误与任务状态序列测试,执行出现 contract.ts 尚不存在的预期失败,再实现。
已执行通过:`npm test`(3 项,含真实 client 模拟 Fetch / Bearer / 过期会话校验)、`npm run build`(vue-tsc 类型检查 + Vite 生产构建)。安装审计 0 vulnerabilities。官方 npm 元数据确认框架版本。TypeScript latest(7)与当前 vue-tsc 不兼容,固定使用 TypeScript 5.9.3。依赖版本及 package-lock 保存。
最终首屏 JS gzip 146.84 kB,CSS gzip 50.13 kB,额外路由 chunk 每份约 1.3–3.2 kB gzip。构建无超大 chunk 警告。
浏览器桌面/移动交互与真实 API 联调由根任务统一验证;此报告当前不声称已完成该核查。没有 PostgreSQL/Redis 启动时,后台正确呈现连接失败。微信凭据、生产 DNS/TLS 和打印机硬件未验证。