feat: 完善人生轨迹详情页功能及微信小程序登录优化
This commit is contained in:
@@ -0,0 +1,167 @@
|
||||
# 登录路由跳转修复 Implementation Plan
|
||||
|
||||
> **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:** 修复小程序登录成功后错误进入编辑资料页的问题，确保登录后统一进入爽文生成页面。
|
||||
|
||||
**Architecture:** 移除登录流程中的 `hasProfile` 分支判断，将 `login/index.vue` 和 `splash/index.vue` 中的登录后路由固定指向 `/pages/main/index?tab=script`。编辑资料页面保留，仅通过"我的" tab 主动进入。
|
||||
|
||||
**Tech Stack:** Vue 3, uni-app, JavaScript
|
||||
|
||||
---
|
||||
|
||||
### Task 1: 修复 login/index.vue 登录后跳转逻辑
|
||||
|
||||
**Files:**
|
||||
- Modify: `mini-program/src/pages/login/index.vue:152-158`
|
||||
- Modify: `mini-program/src/pages/login/index.vue:187`
|
||||
- Modify: `mini-program/src/pages/login/index.vue:209`
|
||||
|
||||
**Context:** 当前 `routeAfterLogin` 函数根据 `profileReady` 参数分支：有资料去爽文生成页，无资料去编辑资料页。需要移除该判断，统一跳转至爽文生成页。
|
||||
|
||||
- [ ] **Step 1: 修改 `routeAfterLogin` 函数，移除 `profileReady` 参数和条件分支**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
const routeAfterLogin = (profileReady) => {
|
||||
if (profileReady) {
|
||||
uni.redirectTo({ url: '/pages/main/index?tab=script' })
|
||||
} else {
|
||||
uni.redirectTo({ url: '/pages/onboarding/index' })
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
const routeAfterLogin = () => {
|
||||
uni.redirectTo({ url: '/pages/main/index?tab=script' })
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 2: 修改 `handleWechatLogin` 中的调用，移除参数**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
routeAfterLogin(result.hasProfile)
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
routeAfterLogin()
|
||||
```
|
||||
|
||||
- [ ] **Step 3: 修改 `handleLogin` 中的调用，移除参数**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
routeAfterLogin(result.hasProfile)
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
routeAfterLogin()
|
||||
```
|
||||
|
||||
- [ ] **Step 4: Commit**
|
||||
|
||||
```bash
|
||||
git add mini-program/src/pages/login/index.vue
|
||||
git commit -m "fix(login): remove profile check, always redirect to script page after login"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Task 2: 修复 splash/index.vue 会话恢复后的跳转逻辑
|
||||
|
||||
**Files:**
|
||||
- Modify: `mini-program/src/pages/splash/index.vue:54-56`
|
||||
|
||||
**Context:** `resolveInitialRoute` 在检测到已登录用户时，会根据 `session.hasProfile` 决定跳转到爽文生成页或编辑资料页。需要移除该分支。
|
||||
|
||||
- [ ] **Step 1: 修改已登录用户的跳转目标**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
if (session.status === store.SESSION_STATUS.AUTHENTICATED) {
|
||||
const target = session.hasProfile ? '/pages/main/index?tab=script' : '/pages/onboarding/index'
|
||||
routeOnce(target, { reason: session.reason, hasProfile: session.hasProfile })
|
||||
return
|
||||
}
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
if (session.status === store.SESSION_STATUS.AUTHENTICATED) {
|
||||
routeOnce('/pages/main/index?tab=script', { reason: session.reason })
|
||||
return
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 2: Commit**
|
||||
|
||||
```bash
|
||||
git add mini-program/src/pages/splash/index.vue
|
||||
git commit -m "fix(splash): remove profile check on session restore, always go to script page"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Task 3: 验证修复
|
||||
|
||||
**Files:**
|
||||
- Read: `mini-program/src/pages/login/index.vue`
|
||||
- Read: `mini-program/src/pages/splash/index.vue`
|
||||
|
||||
- [ ] **Step 1: 验证 login/index.vue 中无残留的分支逻辑**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
grep -n "onboarding" mini-program/src/pages/login/index.vue
|
||||
```
|
||||
|
||||
预期：无输出（`onboarding` 不再被 `login/index.vue` 引用）
|
||||
|
||||
- [ ] **Step 2: 验证 splash/index.vue 中无残留的分支逻辑**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
grep -n "onboarding" mini-program/src/pages/splash/index.vue
|
||||
```
|
||||
|
||||
预期：无输出（`onboarding` 不再被 `splash/index.vue` 引用）
|
||||
|
||||
- [ ] **Step 3: 确认 `onboarding` 页面本身未被修改**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
git diff --name-only
|
||||
```
|
||||
|
||||
预期：输出不包含 `mini-program/src/pages/onboarding/index.vue`
|
||||
|
||||
- [ ] **Step 4: 最终提交（如需要）**
|
||||
|
||||
```bash
|
||||
git log --oneline -3
|
||||
```
|
||||
|
||||
预期：显示两次提交，分别为 login 和 splash 的修复。
|
||||
|
||||
---
|
||||
|
||||
## Self-Review Checklist
|
||||
|
||||
**1. Spec coverage:**
|
||||
- ✅ `login/index.vue` 的 `routeAfterLogin` 及两处调用 — Task 1
|
||||
- ✅ `splash/index.vue` 的会话恢复路由分支 — Task 2
|
||||
- ✅ `hasProfile` 和 `onboarding` 页面保留不动 — 确认无相关修改
|
||||
- ✅ 测试验证点 — Task 3
|
||||
|
||||
**2. Placeholder scan:**
|
||||
- ✅ 无 "TBD"/"TODO" 等占位符
|
||||
- ✅ 每步均含完整代码和命令
|
||||
- ✅ 无 "类似 Task N" 的引用
|
||||
|
||||
**3. Type consistency:**
|
||||
- ✅ 文件路径和函数名与 spec 及代码库一致
|
||||
@@ -0,0 +1,241 @@
|
||||
# 个人中心页面动态数据修复 Implementation Plan
|
||||
|
||||
> **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:** 修复"我的"页面显示写死信息的问题，改为从 store 动态读取用户头像、昵称、身份标签和统计数据。
|
||||
|
||||
**Architecture:** 仅修改 `MineView.vue` 一个文件。复用 `main/index.vue` 已加载的 store 数据（`userProfile` 和 `events`），通过新增 computed 属性生成头像 URL、觉醒深度等级和星历契合百分比，替换模板中的硬编码值。
|
||||
|
||||
**Tech Stack:** Vue 3, uni-app, JavaScript
|
||||
|
||||
---
|
||||
|
||||
### Task 1: 替换头像为动态生成头像
|
||||
|
||||
**Files:**
|
||||
- Modify: `mini-program/src/pages/main/MineView.vue:12-19`（模板）
|
||||
- Modify: `mini-program/src/pages/main/MineView.vue:64-78`（script）
|
||||
|
||||
**Context:** 当前头像区域用 `.person-head` 和 `.person-body` 两个 div 画了一个通用人形。需要替换为 `<image>` 组件显示 Dicebear 根据昵称生成的头像。
|
||||
|
||||
- [ ] **Step 1: 在 template 中替换 CSS 人形为 image 组件**
|
||||
|
||||
将：
|
||||
```html
|
||||
<view class="avatar-circle">
|
||||
<view class="person-head"></view>
|
||||
<view class="person-body"></view>
|
||||
</view>
|
||||
```
|
||||
|
||||
改为：
|
||||
```html
|
||||
<view class="avatar-circle">
|
||||
<image class="avatar-img" :src="avatarUrl" mode="aspectFill" />
|
||||
</view>
|
||||
```
|
||||
|
||||
- [ ] **Step 2: 在 script 中新增 `avatarUrl` computed**
|
||||
|
||||
在 `profile` computed 之后、`displayName` 之前添加：
|
||||
|
||||
```javascript
|
||||
const avatarUrl = computed(() => {
|
||||
const seed = profile.value.nickname || 'user'
|
||||
return `https://api.dicebear.com/7.x/avataaars/svg?seed=${encodeURIComponent(seed)}&backgroundColor=b982ff`
|
||||
})
|
||||
```
|
||||
|
||||
- [ ] **Step 3: 给 avatar-img 添加样式（在 style 区块末尾追加）**
|
||||
|
||||
```css
|
||||
.avatar-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 4: Commit**
|
||||
|
||||
```bash
|
||||
git add mini-program/src/pages/main/MineView.vue && git commit -m "fix(mine): replace static avatar with dynamic dicebear image"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Task 2: 替换写死的用户信息与统计数据
|
||||
|
||||
**Files:**
|
||||
- Modify: `mini-program/src/pages/main/MineView.vue:71-78`（displayName + metaLine）
|
||||
- Modify: `mini-program/src/pages/main/MineView.vue:24-33`（stats-grid 模板）
|
||||
|
||||
**Context：** `displayName` fallback 为 `'张义明'`，`metaLine` fallback 为 `'ENFJ · 狮子座 · 星民'`，统计数值 `Lv.4` 和 `98%` 硬编码。
|
||||
|
||||
- [ ] **Step 1: 修改 `displayName` 的 fallback**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
const displayName = computed(() => profile.value.nickname || '张义明')
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
const displayName = computed(() => profile.value.nickname || '未设置昵称')
|
||||
```
|
||||
|
||||
- [ ] **Step 2: 修改 `metaLine` computed**
|
||||
|
||||
将：
|
||||
```javascript
|
||||
const metaLine = computed(() => {
|
||||
const mbti = profile.value.mbti || 'ENFJ'
|
||||
const zodiac = profile.value.zodiac || '狮子座'
|
||||
const identity = profile.value.profession || '星民'
|
||||
return `${mbti} · ${zodiac} · ${identity}`
|
||||
})
|
||||
```
|
||||
|
||||
改为：
|
||||
```javascript
|
||||
const metaLine = computed(() => {
|
||||
const mbti = profile.value.mbti
|
||||
const zodiac = profile.value.zodiac
|
||||
const identity = profile.value.profession
|
||||
if (!mbti && !zodiac && !identity) {
|
||||
return '点击设置个人档案'
|
||||
}
|
||||
return `${mbti || ''} · ${zodiac || ''} · ${identity || ''}`.replace(/(^ · | · $)/g, '').replace(/ · · /g, ' · ')
|
||||
})
|
||||
```
|
||||
|
||||
- [ ] **Step 3: 新增 `awakenLevel` computed**
|
||||
|
||||
在 `metaLine` 之后添加：
|
||||
|
||||
```javascript
|
||||
const awakenLevel = computed(() => {
|
||||
const count = store.events?.length || 0
|
||||
if (count >= 10) return 'Lv.5'
|
||||
if (count >= 6) return 'Lv.4'
|
||||
if (count >= 3) return 'Lv.3'
|
||||
if (count >= 1) return 'Lv.2'
|
||||
return 'Lv.1'
|
||||
})
|
||||
```
|
||||
|
||||
- [ ] **Step 4: 新增 `harmonyPercent` computed**
|
||||
|
||||
在 `awakenLevel` 之后添加：
|
||||
|
||||
```javascript
|
||||
const harmonyPercent = computed(() => {
|
||||
const hasLifeStory = profile.value.childhood?.text ||
|
||||
profile.value.joy?.text ||
|
||||
profile.value.low?.text ||
|
||||
profile.value.future?.ideal
|
||||
const fields = [
|
||||
profile.value.nickname,
|
||||
profile.value.gender,
|
||||
profile.value.zodiac,
|
||||
profile.value.mbti,
|
||||
profile.value.profession,
|
||||
profile.value.hobbies?.length,
|
||||
hasLifeStory
|
||||
]
|
||||
const filled = fields.filter(Boolean).length
|
||||
return Math.round((filled / 7) * 100) + '%'
|
||||
})
|
||||
```
|
||||
|
||||
- [ ] **Step 5: 替换模板中的硬编码统计值**
|
||||
|
||||
将：
|
||||
```html
|
||||
<view class="stats-grid">
|
||||
<view class="stat-card">
|
||||
<text class="stat-label">觉醒深度</text>
|
||||
<text class="stat-value">Lv.4</text>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<text class="stat-label">星历契合</text>
|
||||
<text class="stat-value">98%</text>
|
||||
</view>
|
||||
</view>
|
||||
```
|
||||
|
||||
改为：
|
||||
```html
|
||||
<view class="stats-grid">
|
||||
<view class="stat-card">
|
||||
<text class="stat-label">觉醒深度</text>
|
||||
<text class="stat-value">{{ awakenLevel }}</text>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<text class="stat-label">星历契合</text>
|
||||
<text class="stat-value">{{ harmonyPercent }}</text>
|
||||
</view>
|
||||
</view>
|
||||
```
|
||||
|
||||
- [ ] **Step 6: Commit**
|
||||
|
||||
```bash
|
||||
git add mini-program/src/pages/main/MineView.vue && git commit -m "fix(mine): replace hardcoded user info and stats with dynamic store data"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Task 3: 验证修复
|
||||
|
||||
**Files:**
|
||||
- Read: `mini-program/src/pages/main/MineView.vue`
|
||||
|
||||
- [ ] **Step 1: 确认模板中无硬编码用户信息**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
grep -n "张义明\|ENFJ\|狮子座\|星民\|Lv\.4\|98%" mini-program/src/pages/main/MineView.vue
|
||||
```
|
||||
|
||||
预期：无输出（所有硬编码值已被替换）
|
||||
|
||||
- [ ] **Step 2: 确认 `<image>` 和 computed 属性存在**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
grep -n "avatarUrl\|awakenLevel\|harmonyPercent" mini-program/src/pages/main/MineView.vue
|
||||
```
|
||||
|
||||
预期：输出包含 `avatarUrl`、`awakenLevel`、`harmonyPercent` 的定义和引用
|
||||
|
||||
- [ ] **Step 3: 查看提交记录**
|
||||
|
||||
运行：
|
||||
```bash
|
||||
git log --oneline -3
|
||||
```
|
||||
|
||||
预期：显示两次提交，分别为头像修复和统计数据修复
|
||||
|
||||
---
|
||||
|
||||
## Self-Review Checklist
|
||||
|
||||
**1. Spec coverage:**
|
||||
- ✅ 头像替换为 Dicebear 动态生成 — Task 1
|
||||
- ✅ displayName fallback 改为 `'未设置昵称'` — Task 2 Step 1
|
||||
- ✅ metaLine 无资料时显示 `'点击设置个人档案'` — Task 2 Step 2
|
||||
- ✅ 觉醒深度基于 `store.events.length` — Task 2 Step 3
|
||||
- ✅ 星历契合基于资料完整度 — Task 2 Step 4
|
||||
- ✅ 模板硬编码值替换 — Task 2 Step 5
|
||||
- ✅ 验证步骤 — Task 3
|
||||
|
||||
**2. Placeholder scan:**
|
||||
- ✅ 无 "TBD"/"TODO" 等占位符
|
||||
- ✅ 每步均含完整代码和命令
|
||||
- ✅ 无 "类似 Task N" 的引用
|
||||
|
||||
**3. Type consistency:**
|
||||
- ✅ 字段名（`nickname`、`mbti`、`zodiac`、`profession`、`events`、`hobbies`、`childhood`、`joy`、`low`、`future`）与 store 和 spec 一致
|
||||
- ✅ `avatarUrl` 生成逻辑与 onboarding 中一致
|
||||
Reference in New Issue
Block a user