300 lines
8.5 KiB
Markdown
300 lines
8.5 KiB
Markdown
# 数字我·天下：缘起、铸身、照命交接文档
|
||
|
||
更新时间：2026-08-28
|
||
|
||
项目目录：
|
||
|
||
```text
|
||
C:\Users\Administrator\Desktop\无字卷_整合版\digital-me-history\digital-me-web
|
||
```
|
||
|
||
## 1. 当前目标与设计结论
|
||
|
||
当前主流程为：
|
||
|
||
```text
|
||
缘起 → 铸身 → 照命 → 入局 → 回响 → 传世
|
||
```
|
||
|
||
缘起、铸身、照命已经完成一轮视觉整合。当前统一标准为：
|
||
|
||
- 米黄宣纸与羊皮纸底色。
|
||
- 深褐正文、暗红朱印、哑金线框。
|
||
- 宋体与历史画卷式排版。
|
||
- 全宽章节舞台，不再使用嵌入式演示卡片的视觉结构。
|
||
- 顶部统一显示“未完之地 · 时史”及六章导航。
|
||
- 保留缘起的叙事感，同时保留铸身和照命已经验收的核心交互。
|
||
|
||
后续不要重新设计整套画风。优化应以排版、衔接、细节和交互流畅度为主。
|
||
|
||
架构结论：这三章不是另做的独立站点，而是直接接替 `digitme.cn` 原项目中的正式模块位置；必须保留原项目游客、登录分身、入局和传世的上下游链路。
|
||
|
||
## 2. 页面入口
|
||
|
||
```text
|
||
缘起：http://127.0.0.1:5173/menmian?start=1
|
||
铸身：http://127.0.0.1:5173/shishi/zhushen
|
||
照命：http://127.0.0.1:5173/shishi/zhaoming
|
||
独立命盘验收页：http://127.0.0.1:5173/zhaoming-wheel
|
||
```
|
||
|
||
正式路由定义位于：
|
||
|
||
```text
|
||
src/router.ts
|
||
```
|
||
|
||
## 3. 本轮完成的章节衔接
|
||
|
||
此前的主要问题：
|
||
|
||
- 缘起是全屏叙事页面。
|
||
- 铸身与照命受到全站 `.tx-big` 的 `zoom: 1.4` 和预缩宽度影响。
|
||
- 后两章像被塞进网页里的演示截图，纸面宽度、标题尺度和顶部起点与缘起不一致。
|
||
- 翻章后视觉上像进入另一个项目。
|
||
|
||
当前修正：
|
||
|
||
- 缘起、铸身、照命使用同一连续舞台。
|
||
- 三页统一纸张宽度、顶部起点和章节导航基线。
|
||
- 这三页不再使用旧的预缩放大逻辑。
|
||
- 铸身与照命移除最外层悬浮卡片阴影，保留内部纸面层级。
|
||
- 缘起增加与后两章一致的六章导航。
|
||
- 缘起身份卡后增加“第一章已落定 / 下一章 · 铸身”翻章提示。
|
||
- 路由进入仅保留短促的透明度和纵向位移动效。
|
||
- `prefers-reduced-motion` 下关闭翻章动效。
|
||
|
||
相关文件：
|
||
|
||
```text
|
||
src/App.vue
|
||
src/views/Menmian.vue
|
||
src/components/shishi/ChapterShell.vue
|
||
src/assets/life-chapter-continuity.css
|
||
```
|
||
|
||
## 4. 缘起当前状态
|
||
|
||
正式组件：
|
||
|
||
```text
|
||
src/views/Menmian.vue
|
||
src/components/shishi/HistoricalIdentityCard.vue
|
||
```
|
||
|
||
当前保留内容：
|
||
|
||
- 王莽序章与历史叙事。
|
||
- 现代职业输入和职业选择。
|
||
- 历朝身份推演。
|
||
- 第一份命格与历史人物题像。
|
||
- 身份卡保存、分享和复制判词。
|
||
- 进入铸身的正式入口。
|
||
|
||
视觉衔接新增内容：
|
||
|
||
- 顶部六章导航。
|
||
- 与铸身、照命一致的纸面宽度。
|
||
- 身份卡之后的翻章提示。
|
||
|
||
不要删除人物题像。铸身最终生成的人物名帖会继续读取缘起中选择的朝代画像。
|
||
|
||
## 5. 铸身当前状态
|
||
|
||
正式页面与组件：
|
||
|
||
```text
|
||
src/views/shishi/Zhushen.vue
|
||
src/components/shishi/ZhushenForgeBoard.vue
|
||
```
|
||
|
||
主要样式：
|
||
|
||
```text
|
||
src/assets/accepted-scroll-design.css
|
||
src/assets/shishi-polish.css
|
||
src/assets/life-chapter-continuity.css
|
||
```
|
||
|
||
铸身四笔：
|
||
|
||
```text
|
||
第一笔：本事
|
||
第二笔：性情
|
||
第三笔：分量
|
||
第四笔：来处
|
||
```
|
||
|
||
已经保留并验证的交互：
|
||
|
||
- 本事签牌选择和翻轮。
|
||
- 性情签牌选择。
|
||
- 七项分量逐项循环选择程度。
|
||
- 来处台座选择。
|
||
- 每次选择与中心铸炉进度联动。
|
||
- “铸胚 · n/4 笔成形”进度反馈。
|
||
- 四笔完成后的合炉定身。
|
||
- 人物名帖展示缘起题像。
|
||
- 人物名帖进入照命。
|
||
|
||
绝对不要回退：
|
||
|
||
- 不要改回现代下拉框。
|
||
- 不要恢复蓝色选中态。
|
||
- 不要把七项分量合并成单个选择。
|
||
- 不要恢复之前的大面积廉价橙色火焰遮罩。
|
||
- 不要删除中心铸炉或人物名帖。
|
||
|
||
## 6. 照命当前状态
|
||
|
||
正式页面与组件：
|
||
|
||
```text
|
||
src/views/Verdict.vue
|
||
src/components/shishi/ZhaomingWheelBoard.vue
|
||
```
|
||
|
||
独立验收页：
|
||
|
||
```text
|
||
src/views/shishi/WheelLab.vue
|
||
```
|
||
|
||
正式资源：
|
||
|
||
```text
|
||
public/assets/zhaoming-wheel-chronicle-v2.png
|
||
public/assets/zhaoming-pointer-v2.png
|
||
public/assets/zhaoming-wheel-reference.png
|
||
public/assets/zhaoming-landscape-bg-v2.png
|
||
public/assets/zhaoming-exact.png
|
||
```
|
||
|
||
当前命盘规则：
|
||
|
||
- 命盘外圈共有 30 个手绘格子。
|
||
- 30 格不是数学平均等分。
|
||
- `ZhaomingWheelBoard.vue` 中的 `slotCenters` 是逐格校准后的真实中线。
|
||
- 指针固定在上方，外圈命盘旋转。
|
||
- 每次停止必须吸附到单个格子的中线。
|
||
- 中心显示当前朝代和“当前照命”。
|
||
- 方向键、上一朝、下一朝和拖拽均可切换朝代。
|
||
- 当前选中格只使用底图已有的格子高亮效果。
|
||
|
||
绝对不要回退：
|
||
|
||
- 不要把 30 格改成平均等分。
|
||
- 不要重画指针。
|
||
- 不要给指针尾端增加方框、扇形框或半个铆钉。
|
||
- 不要在格子外叠加额外矩形选中框。
|
||
- 不要恢复旧轮盘组件。
|
||
- 不要把正式朝代参数从 path 挪到 query。
|
||
|
||
正式朝代选择沿用原项目 path：
|
||
|
||
```text
|
||
/shishi/zhaoming/朝代ID
|
||
/twin/分身ID/verdict/朝代ID
|
||
```
|
||
|
||
`App.vue` 为同一游客照命、同一分身照命提供稳定 `RouterView key`，`router.ts` 同时保持切朝时的滚动位置。因此 path 可以正常变化并保留正式深链语义，但页面不会整页重新挂载或闪烁。
|
||
|
||
旧的 `?dyn=朝代ID` 只做兼容：打开后自动改写为正式 path，不再生成新的 query 朝代链接。
|
||
|
||
## 7. 照命保留的正式业务
|
||
|
||
新命盘只替换了表现形式，没有删除正式业务：
|
||
|
||
- 最得时、最逆时、另一种命三张结果卡。
|
||
- 登录用户 compare 数据。
|
||
- 游客 preview 数据。
|
||
- 朝代判词、品级、入仕路径和史料依据。
|
||
- 出身选择。
|
||
- 制度详情和朝代展开内容。
|
||
- 进入入局的正式流程。
|
||
- 无障碍 slider 语义与键盘控制。
|
||
|
||
## 8. 已完成验证
|
||
|
||
生产构建：
|
||
|
||
```text
|
||
Vite v6.4.3
|
||
✓ 1991 modules transformed
|
||
✓ built in 8.07s
|
||
```
|
||
|
||
浏览器实测：
|
||
|
||
```text
|
||
铸身“文采·细腻”签牌：aria-pressed 可正常切换
|
||
照命方向键：刘宋 → 南朝
|
||
转盘中心朝代、右侧结果与选择同步更新
|
||
照命正式地址：/shishi/zhaoming/朝代ID
|
||
同一照命切朝：页面实例复用、滚动位置保持
|
||
铸身“三 · 照命”导航：正确进入 /shishi/zhaoming
|
||
缘起、铸身、照命：同一纸张宽度与顶部章节导航
|
||
```
|
||
|
||
测试时临时切换的“文采·细腻”已经恢复到测试前的选中状态。
|
||
|
||
## 9. 已知工程状态
|
||
|
||
Vite 生产构建通过。
|
||
|
||
仓库完整 `vue-tsc --noEmit` 仍可能报告此前已有的模板空值收窄警告，主要位置：
|
||
|
||
```text
|
||
src/views/shishi/Zhushen.vue：guestProf、mbtiPersona
|
||
src/views/Verdict.vue：selKaiguo、jinSides
|
||
```
|
||
|
||
这些不是本轮连续舞台或命盘产生的问题。若下一会话要处理，应单独修复，不要借此重写页面。
|
||
|
||
## 10. 工作区安全注意事项
|
||
|
||
当前工作区已有多批未提交修改与资源文件。
|
||
|
||
禁止操作：
|
||
|
||
```text
|
||
git reset --hard
|
||
git checkout -- .
|
||
批量删除未跟踪文件
|
||
把全部工作区无差别覆盖成远端版本
|
||
```
|
||
|
||
后续修改前应先查看具体文件，保留用户已有改动。
|
||
|
||
## 11. 后续优化建议
|
||
|
||
优先顺序：
|
||
|
||
1. 在 1280、1440、1920 三档检查纸面宽度和命盘详情布局。
|
||
2. 检查缘起身份卡进入铸身时的人物画像是否正确继承。
|
||
3. 优化铸身四笔切换的细小动效，不改变签牌形状和字段。
|
||
4. 检查照命拖拽在触摸屏上的吸附手感。
|
||
5. 单独清理 Vue 模板空值警告。
|
||
|
||
不要重新生成命盘底图，不要重新设计铸炉，不要改变已经确定的古风色板。
|
||
|
||
## 12. 新会话可直接复制的开场说明
|
||
|
||
```text
|
||
请先完整阅读交接文档：
|
||
C:\Users\Administrator\Desktop\无字卷_整合版\digital-me-history\digital-me-web\docs\HANDOFF-2026-08-27-YUANQI-ZHUSHEN-ZHAOMING.md
|
||
|
||
项目目录：
|
||
C:\Users\Administrator\Desktop\无字卷_整合版\digital-me-history\digital-me-web
|
||
|
||
请先打开并对照：
|
||
http://127.0.0.1:5173/menmian?start=1
|
||
http://127.0.0.1:5173/shishi/zhushen
|
||
http://127.0.0.1:5173/shishi/zhaoming
|
||
http://127.0.0.1:5173/zhaoming-wheel
|
||
|
||
当前缘起、铸身、照命已经完成连续舞台整合。铸身核心交互和照命命盘已经定稿。
|
||
不要重做命盘，不要重画指针，不要增加选中框，不要把 30 格改成平均等分，不要把铸身改回现代下拉框。
|
||
先确认现状，再按照我的下一条具体要求继续。
|
||
```
|