happy-life-star/docs/superpowers/plans/2026-06-23-remove-mock-data-from-profile-and-script-library-plan.md

去除编辑资料页与剧本列表 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 行代码：

<text class="hero-name">{{ form.nickname || 'Zoey' }}</text>

• Step 2: 替换默认文案

将第 22 行改为：

<text class="hero-name">{{ form.nickname || '未设置昵称' }}</text>

• Step 3: 提交

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 数组：

const fallbackScripts = [
  {
    id: 'demo-1',
    title: '逆袭人生：从低谷到巅峰',
    // ...
  },
  // ... 共 6 条
]

确认第 251–254 行为 scripts computed：

const scripts = computed(() => {
  const list = store.scripts || []
  return list.length ? list : fallbackScripts
})

• Step 2: 删除 fallbackScripts 并修改 scripts computed

删除 fallbackScripts 数组及其后的空行，将 scripts computed 改为：

const scripts = computed(() => store.scripts || [])

• Step 3: 提交

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: 查看当前工具函数代码

确认以下函数当前实现：

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: 修改各函数去掉兜底假值

将上述函数改为：

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: 提交

git add mini-program/src/pages/main/ScriptLibraryView.vue
git commit -m "fix：剧本列表工具函数去除默认值兜底"

---

Task 4: 编译与 H5 验证

Files:

• 无新增/修改文件

• Step 1: 运行 H5 生产构建

cd mini-program
npm run build:h5

期望输出包含 DONE Build complete.，无编译错误。

• Step 2: 启动 H5 开发服务器

确保 5173/5175 端口未被占用，然后：

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: 所有函数签名、字段名与源码保持一致。