85 lines
3.6 KiB
Markdown
85 lines
3.6 KiB
Markdown
# Mine Page 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:** 保持当前项目的轻量结构，直接在 `src/pages/` 下新增页面目录，不引入状态管理或新 UI 框架。主页面使用本地 mock 数据渲染，二级页面复用统一的深色卡片布局和轻量占位文案，验证以 `npm run build:weapp` 为主。
|
||
|
||
**Tech Stack:** Taro 4、React 18、TypeScript、SCSS
|
||
|
||
---
|
||
|
||
### Task 1: 注册页面与整理导航入口
|
||
|
||
**Files:**
|
||
- Modify: `src/app.config.ts`
|
||
- Modify: `src/pages/index/index.tsx`
|
||
|
||
- [ ] 在 `src/app.config.ts` 中注册 `mine` 主页面及 `profile`、`settings`、`support`、`devices`、`repair`、`feedback`、`videos`、`follow-us` 二级页面
|
||
- [ ] 将首页底部导航中的“我的”入口改为跳转到 `pages/mine/index`
|
||
- [ ] 保留首页其余入口当前占位逻辑，不扩展其他 Tab 页面
|
||
|
||
### Task 2: 实现“我的”主页面
|
||
|
||
**Files:**
|
||
- Create: `src/pages/mine/index.config.ts`
|
||
- Create: `src/pages/mine/index.tsx`
|
||
- Create: `src/pages/mine/index.scss`
|
||
|
||
- [ ] 新建“我的”主页面配置，设置页面标题
|
||
- [ ] 在 `index.tsx` 中定义本地 mock 用户数据、功能列表数据和页面跳转逻辑
|
||
- [ ] 实现顶部用户信息卡、右侧快捷入口、功能列表和版本检查提示
|
||
- [ ] 保持代码对新手友好，复杂映射处仅补充必要注释
|
||
|
||
### Task 3: 实现二级页面骨架
|
||
|
||
**Files:**
|
||
- Create: `src/pages/profile/index.config.ts`
|
||
- Create: `src/pages/profile/index.tsx`
|
||
- Create: `src/pages/profile/index.scss`
|
||
- Create: `src/pages/settings/index.config.ts`
|
||
- Create: `src/pages/settings/index.tsx`
|
||
- Create: `src/pages/settings/index.scss`
|
||
- Create: `src/pages/support/index.config.ts`
|
||
- Create: `src/pages/support/index.tsx`
|
||
- Create: `src/pages/support/index.scss`
|
||
- Create: `src/pages/devices/index.config.ts`
|
||
- Create: `src/pages/devices/index.tsx`
|
||
- Create: `src/pages/devices/index.scss`
|
||
- Create: `src/pages/repair/index.config.ts`
|
||
- Create: `src/pages/repair/index.tsx`
|
||
- Create: `src/pages/repair/index.scss`
|
||
- Create: `src/pages/feedback/index.config.ts`
|
||
- Create: `src/pages/feedback/index.tsx`
|
||
- Create: `src/pages/feedback/index.scss`
|
||
- Create: `src/pages/videos/index.config.ts`
|
||
- Create: `src/pages/videos/index.tsx`
|
||
- Create: `src/pages/videos/index.scss`
|
||
- Create: `src/pages/follow-us/index.config.ts`
|
||
- Create: `src/pages/follow-us/index.tsx`
|
||
- Create: `src/pages/follow-us/index.scss`
|
||
|
||
- [ ] 为每个二级页面补齐标题、卡片布局和占位内容
|
||
- [ ] 保持二级页面视觉与主页面一致，但布局更简洁
|
||
- [ ] 确保所有从“我的”页发起的跳转都能进入对应页面
|
||
|
||
### Task 4: 样式收口与验证
|
||
|
||
**Files:**
|
||
- Modify: `src/app.scss`
|
||
- Modify: `src/pages/index/index.tsx`
|
||
- Modify: `src/pages/mine/index.scss`
|
||
- Modify: `src/pages/profile/index.scss`
|
||
- Modify: `src/pages/settings/index.scss`
|
||
- Modify: `src/pages/support/index.scss`
|
||
- Modify: `src/pages/devices/index.scss`
|
||
- Modify: `src/pages/repair/index.scss`
|
||
- Modify: `src/pages/feedback/index.scss`
|
||
- Modify: `src/pages/videos/index.scss`
|
||
- Modify: `src/pages/follow-us/index.scss`
|
||
|
||
- [ ] 如有必要，补充少量全局基础样式，避免和现有页面冲突
|
||
- [ ] 运行 `npm run build:weapp`
|
||
- [ ] 检查构建输出，确认页面注册、TS 代码和 SCSS 都能通过编译
|