浅念
37d88da4bc
- admin-preview-2026-09-22/ 20页新版后台HTML原型+截图+validation（UI05 交付） - app-preview-2026-09-22/ 截图/validation/check 脚本入库及小改 - admin-redesign-concept 概念图 - UI05 管理后台分析与新版设计说明、用户列表分页计划文档 - UI06 全端视觉统一实施方案（以两个 HTML 预览为唯一视觉基准） - services/api g4-sync-once 手动同步脚本 Co-Authored-By: Claude Code <noreply@anthropic.com>
64 lines
3.6 KiB
Markdown
64 lines
3.6 KiB
Markdown
# PhotoLive 管理后台新版 HTML 原型
|
|
|
|
打开 **index.html**，使用左侧菜单浏览；点击“全部页面目录”查看20个入口。每个页面也有独立HTML文件，可双击打开。无需启动服务或访问互联网。
|
|
|
|
视觉基于Art Design Pro / Element Plus的后台布局，但此目录是独立原生HTML原型，没有改动 `apps/admin`。
|
|
|
|
## 交付文件
|
|
|
|
- `index.html`：默认相册管理入口。
|
|
- `01-*.html` 至 `20-*.html`：独立页面，见下表。
|
|
- `styles.css`、`admin.js`、`icons.js`、`pages.js`：共享外观、交互及索引。
|
|
- `assets/`：离线示例图片与演示二维码。
|
|
- `screenshots/01.png` 至 `20.png`：实际HTML渲染截图；mobile前缀为窄屏检查。
|
|
- `validation.json`：本次浏览器检查结果。
|
|
- `image-prompt.txt`：概念图完整生成提示词。
|
|
- `../../plans/2026-09-22-UI05-管理后台分析与新版设计说明.md`：现状分析、接口差异及实施映射。
|
|
|
|
## 页面目录
|
|
|
|
| 编号 | 内容 | 文件 |
|
|
|---|---|---|
|
|
| 01 | 账号密码登录 | 01-login.html |
|
|
| 02 | 相册卡片/表格列表 | 02-albums.html |
|
|
| 03 | 相册照片网格/表格 | 03-photos.html |
|
|
| 04 | 成员与所有者交接 | 04-members.html |
|
|
| 05 | 双语分类 | 05-categories.html |
|
|
| 06 | 水印预览、生成任务 | 06-watermark.html |
|
|
| 07 | 分享卡、二维码、链接 | 07-sharing.html |
|
|
| 08 | 新建相册表单 | 08-create-album.html |
|
|
| 09 | 编辑资料、访问开关 | 09-edit-album.html |
|
|
| 10 | 账号、角色与治理 | 10-users.html |
|
|
| 11 | 用户目录同步 | 11-user-sync.html |
|
|
| 12 | 用量、阈值与告警 | 12-usage.html |
|
|
| 13 | 展示位、绑定、接入代码 | 13-embed-slots.html |
|
|
| 14 | v1/v2配置与小窗预览 | 14-embed-editor.html |
|
|
| 15 | 宣传图与资产入口 | 15-branding.html |
|
|
| 16 | 管理大图及操作 | 16-photo-viewer.html |
|
|
| 17 | 403 | 17-403.html |
|
|
| 18 | 404 | 18-404.html |
|
|
| 19 | 500 | 19-500.html |
|
|
| 20 | 同步批次失败明细 | 20-sync-detail.html |
|
|
|
|
## 可以体验
|
|
|
|
- 中英文切换、相册搜索、卡片/表格切换、照片分类/状态筛选。
|
|
- 查看大图、单张隐藏/恢复/软删除、选择已公开照片批量隐藏。
|
|
- 创建和编辑示例相册、邀请内部示例用户、交接所有者、分类增改。
|
|
- 水印文字/位置/透明度/字号即时预览。
|
|
- 账号搜索、角色修改、重置密码流程、激活/锁定；自身账号角色不可改。
|
|
- 同步运行模拟、失败详情、用量阈值对话框。
|
|
- 展示位开关/绑定、v1/v2设置、固定195×280预览、收起展开、模拟气泡、复制示例代码。
|
|
|
|
## 重要边界
|
|
|
|
所有数据和操作为样例，不调用生产接口、不真正重置密码或上传/删除文件。请勿输入真实账号密码。原型状态只存在当前标签页内存，重新打开独立页会重置。
|
|
|
|
摄影局部来自本次生成的后台概念图，`assets/photo-reference.png` 保留离线来源。界面文字、表单、卡片和表格均为真实DOM。样例文件名、时间、人数和数据不能抄进生产默认值。
|
|
|
|
分享QR指向 `https://example.com/photolive-preview`，仅用于展示，不是相册链接。跨原型链接依赖上一层已生成的 `viewer-preview-2026-09-22.html` / `embed-preview-2026-09-22.html`；搬运目录时请一同携带，或修改为实际目标。
|
|
|
|
嵌入配置中的预览为简化CSS展示；正式组件须复用现有UI04代码。此次未完成真实角色权限、OSS、网络异常、水印生成、用户同步或Art Design Pro运行集成验收。
|
|
|
|
`build-preview.cjs` / `check-preview.cjs` 是本仓库的生成和检查辅助脚本。普通浏览无需执行它们。
|