docs：去除编辑资料页与剧本列表 mock 数据实现计划

2026-06-23 22:16:27 +08:00
parent a00ce0bf95
commit e7531f86cf
1 changed files with 218 additions and 0 deletions
@@ -0,0 +1,218 @@
+# 去除编辑资料页与剧本列表 mock 数据实现计划
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** 将编辑资料页顶部默认昵称从「Zoey」改为「未设置昵称」，并彻底删除剧本列表中的 `fallbackScripts` 数组及各工具函数的兜底默认值。
+
+**Architecture:** 直接修改两个 Vue 文件：在 `onboarding/index.vue` 替换默认文案；在 `ScriptLibraryView.vue` 删除 `fallbackScripts`、让 `scripts` 直接返回 `store.scripts`，并清理 `getTags`、`getWordCount`、`getDateText`、`getProgress`、`getChapterCount` 中的默认假值。
+
+**Tech Stack:** Vue 3 + UniApp + TypeScript + Pinia
+
+---
+
+## 文件结构
+
+| 文件 | 职责 | 变更类型 |
+|---|---|---|
+| `mini-program/src/pages/onboarding/index.vue` | 编辑资料页面顶部预览卡片 | 修改 |
+| `mini-program/src/pages/main/ScriptLibraryView.vue` | 剧本列表页面 | 修改 |
+
+---
+
+### Task 1: 修改编辑资料页顶部默认昵称
+
+**Files:**
+- Modify: `mini-program/src/pages/onboarding/index.vue:22`
+
+- [ ] **Step 1: 查看当前代码**
+
+确认第 22 行代码：
+
+```vue
+<text class="hero-name">{{ form.nickname || 'Zoey' }}</text>
+```
+
+- [ ] **Step 2: 替换默认文案**
+
+将第 22 行改为：
+
+```vue
+<text class="hero-name">{{ form.nickname || '未设置昵称' }}</text>
+```
+
+- [ ] **Step 3: 提交**
+
+```bash
+git add mini-program/src/pages/onboarding/index.vue
+git commit -m "fix：编辑资料页无昵称时显示未设置昵称"
+```
+
+---
+
+### Task 2: 删除剧本列表 fallbackScripts 数组
+
+**Files:**
+- Modify: `mini-program/src/pages/main/ScriptLibraryView.vue:178-254`
+
+- [ ] **Step 1: 查看当前代码**
+
+确认第 178–249 行为 `fallbackScripts` 数组：
+
+```javascript
+const fallbackScripts = [
+  {
+    id: 'demo-1',
+    title: '逆袭人生：从低谷到巅峰',
+    // ...
+  },
+  // ... 共 6 条
+]
+```
+
+确认第 251–254 行为 `scripts` computed：
+
+```javascript
+const scripts = computed(() => {
+  const list = store.scripts || []
+  return list.length ? list : fallbackScripts
+})
+```
+
+- [ ] **Step 2: 删除 fallbackScripts 并修改 scripts computed**
+
+删除 `fallbackScripts` 数组及其后的空行，将 `scripts` computed 改为：
+
+```javascript
+const scripts = computed(() => store.scripts || [])
+```
+
+- [ ] **Step 3: 提交**
+
+```bash
+git add mini-program/src/pages/main/ScriptLibraryView.vue
+git commit -m "fix：剧本列表删除 fallbackScripts 假数据"
+```
+
+---
+
+### Task 3: 清理剧本列表工具函数默认值
+
+**Files:**
+- Modify: `mini-program/src/pages/main/ScriptLibraryView.vue:297-317`
+
+- [ ] **Step 1: 查看当前工具函数代码**
+
+确认以下函数当前实现：
+
+```javascript
+const getTags = (script) => {
+  if (Array.isArray(script.tags) && script.tags.length) return script.tags.slice(0, 4)
+  return [script.style || '逆袭成长', '都市', '事业', '热血']
+}
+
+const getChapterCount = (script) => script.chapterCount || script.chapters || Math.max(1, Math.round((script.wordCount || 30000) / 4500))
+
+const getWordCount = (script) => {
+  const count = Number(script.wordCount || 0)
+  if (!count) return '3.1万字'
+  if (count >= 10000) return `${(count / 10000).toFixed(1)}万字`
+  return `${count}字`
+}
+
+const getDateText = (script) => {
+  if (getStatus(script) === 'done') return `完成于：${script.completedAt || script.date || '2025.05.10'}`
+  if (getStatus(script) === 'draft') return `创建于：${script.createdAt || script.date || '2025.05.08'}`
+  return `最近更新：${script.updatedAt || script.date || '今天 21:30'}`
+}
+
+const getProgress = (script) => Math.max(1, Math.min(99, Number(script.progress || 28)))
+```
+
+- [ ] **Step 2: 修改各函数去掉兜底假值**
+
+将上述函数改为：
+
+```javascript
+const getTags = (script) => {
+  if (Array.isArray(script.tags) && script.tags.length) return script.tags.slice(0, 4)
+  return []
+}
+
+const getChapterCount = (script) => script.chapterCount || script.chapters || 0
+
+const getWordCount = (script) => {
+  const count = Number(script.wordCount || 0)
+  if (count >= 10000) return `${(count / 10000).toFixed(1)}万字`
+  return `${count}字`
+}
+
+const getDateText = (script) => {
+  if (getStatus(script) === 'done') return `完成于：${script.completedAt || script.date || ''}`
+  if (getStatus(script) === 'draft') return `创建于：${script.createdAt || script.date || ''}`
+  return `最近更新：${script.updatedAt || script.date || ''}`
+}
+
+const getProgress = (script) => Math.max(0, Math.min(99, Number(script.progress || 0)))
+```
+
+- [ ] **Step 3: 提交**
+
+```bash
+git add mini-program/src/pages/main/ScriptLibraryView.vue
+git commit -m "fix：剧本列表工具函数去除默认值兜底"
+```
+
+---
+
+### Task 4: 编译与 H5 验证
+
+**Files:**
+- 无新增/修改文件
+
+- [ ] **Step 1: 运行 H5 生产构建**
+
+```bash
+cd mini-program
+npm run build:h5
+```
+
+期望输出包含 `DONE  Build complete.`，无编译错误。
+
+- [ ] **Step 2: 启动 H5 开发服务器**
+
+确保 5173/5175 端口未被占用，然后：
+
+```bash
+cd mini-program
+npm run dev:h5
+```
+
+- [ ] **Step 3: 验证编辑资料页**
+
+1. 在浏览器中打开 `http://localhost:5173`（或实际分配的端口）。
+2. 登录后进入编辑资料页面。
+3. 清空昵称输入框，点击保存，确认顶部显示「未设置昵称」。
+
+- [ ] **Step 4: 验证剧本列表空状态**
+
+1. 从爽文生成页面点击左上角「历史」按钮进入剧本列表。
+2. 如果当前账号没有剧本数据，确认页面显示「还没有人生剧本」空状态，不展示任何 demo 剧本。
+3. 如果账号有真实剧本数据，确认真实数据正常显示。
+
+- [ ] **Step 5: 检查浏览器 Console**
+
+确认没有新增的 JavaScript 错误。
+
+---
+
+## Self-Review
+
+1. **Spec coverage:**
+   - 编辑资料页默认昵称 → Task 1
+   - 删除 fallbackScripts → Task 2
+   - 清理工具函数默认值 → Task 3
+   - 编译与验证 → Task 4
+
+2. **Placeholder scan:** 无 TBD、TODO、"implement later" 或模糊描述。
+
+3. **Type consistency:** 所有函数签名、字段名与源码保持一致。