This commit is contained in:
zpc
parent
693986ae65
commit
50a3d7e67d
1
.kiro/specs/invite-page-enhancement/.config.kiro
Normal file
1
.kiro/specs/invite-page-enhancement/.config.kiro
Normal file
|
|
@ -0,0 +1 @@
|
|||
{"specId": "a3e7c1d2-8f4b-4e6a-9c5d-1b2a3f4e5d6c", "workflowType": "requirements-first", "specType": "feature"}
|
||||
116
.kiro/specs/invite-page-enhancement/requirements.md
Normal file
116
.kiro/specs/invite-page-enhancement/requirements.md
Normal file
|
|
@ -0,0 +1,116 @@
|
|||
# 需求文档：邀请新用户页面增强
|
||||
|
||||
## 简介
|
||||
|
||||
本需求针对现有邀请新用户页面（`uniapp/pages/invite/index.vue`）进行 UI 增强和功能完善，使其对齐设计图。现有页面已具备基本功能（规则说明、二维码生成、分享链接、佣金展示、提现申请、提现记录、邀请记录），但 UI 布局和交互细节与设计稿存在差异。本次增强聚焦于视觉还原和交互优化，不涉及后端接口变更。
|
||||
|
||||
## 术语表
|
||||
|
||||
- **邀请页面（Invite_Page）**：邀请新用户页面，路径为 `uniapp/pages/invite/index.vue`
|
||||
- **佣金区域（Commission_Section）**：页面中展示"已提现"和"待提现"金额的区域
|
||||
- **邀请记录区域（Record_Section）**：页面中展示直属下级用户列表的区域
|
||||
- **二维码弹窗（Qrcode_Popup）**：点击"生成二维码"后弹出的弹窗
|
||||
- **提现记录弹窗（Withdraw_Record_Popup）**：点击"查看提现记录"后弹出的弹窗
|
||||
- **申请提现弹窗（Withdraw_Popup）**：点击"申请提现"后弹出的弹窗
|
||||
- **规则说明弹窗（Rule_Popup）**：点击"规则说明"后弹出的弹窗
|
||||
- **Banner 区域（Banner_Section）**：页面顶部的礼物 banner 图区域
|
||||
- **操作按钮区域（Action_Section）**：包含"生成二维码"和"分享链接"两个按钮的区域
|
||||
|
||||
## 需求
|
||||
|
||||
### 需求 1：顶部 Banner 区域
|
||||
|
||||
**用户故事：** 作为用户，我希望页面顶部有一个醒目的礼物 banner 图，以便直观了解邀请活动的主题。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Invite_Page SHALL 在导航栏下方展示一个全宽的礼物 banner 图片区域
|
||||
2. THE Banner_Section SHALL 展示一张礼物主题的 banner 图片，图片宽度为页面全宽，高度按设计图比例自适应
|
||||
3. WHEN 页面加载完成时，THE Banner_Section SHALL 在 banner 图片右上角区域叠加显示一个"规则说明"按钮
|
||||
4. WHEN 用户点击"规则说明"按钮时，THE Invite_Page SHALL 弹出规则说明弹窗
|
||||
|
||||
### 需求 2：操作按钮区域样式调整
|
||||
|
||||
**用户故事：** 作为用户，我希望"生成二维码"和"分享链接"按钮是红色圆角样式，以便与整体设计风格一致。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Action_Section SHALL 展示"生成二维码"和"分享链接"两个并排的红色圆角按钮
|
||||
2. THE Action_Section 的按钮 SHALL 使用红色（#FF4D4F 或设计图指定的红色）背景色、白色文字、圆角矩形样式
|
||||
3. WHEN 用户点击"生成二维码"按钮时，THE Invite_Page SHALL 弹出二维码弹窗
|
||||
4. WHEN 用户点击"分享链接"按钮时，THE Invite_Page SHALL 拉起微信转发好友功能
|
||||
|
||||
### 需求 3：佣金提现区域样式调整
|
||||
|
||||
**用户故事：** 作为用户，我希望提现区域的标题和金额展示更加醒目，以便快速了解我的佣金状况。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Commission_Section SHALL 展示标题"提现记录"，并在标题右侧显示"查看提现记录 >"链接文字
|
||||
2. WHEN 用户点击"查看提现记录 >"链接时，THE Invite_Page SHALL 弹出提现记录弹窗
|
||||
3. THE Commission_Section SHALL 以红色大字格式展示"已提现"和"待提现"金额，格式为"XX元"（如"99元"）
|
||||
4. THE Commission_Section SHALL 在金额下方展示"申请提现"按钮
|
||||
5. WHEN 用户点击"申请提现"按钮时，THE Invite_Page SHALL 弹出申请提现弹窗
|
||||
|
||||
### 需求 4：二维码弹窗增强
|
||||
|
||||
**用户故事：** 作为用户，我希望二维码弹窗包含小程序名称、简介和更多操作按钮，以便更方便地分享给好友。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Qrcode_Popup SHALL 在弹窗顶部居中展示小程序名称标题
|
||||
2. THE Qrcode_Popup SHALL 在标题下方居中展示邀请二维码图片
|
||||
3. THE Qrcode_Popup SHALL 在二维码图片下方展示一句话简介文字
|
||||
4. THE Qrcode_Popup SHALL 在底部展示"分享给好友"和"保存二维码"两个蓝色按钮
|
||||
5. WHEN 用户点击"分享给好友"按钮时，THE Qrcode_Popup SHALL 拉起微信转发好友功能
|
||||
6. WHEN 用户点击"保存二维码"按钮时，THE Qrcode_Popup SHALL 将二维码图片保存到用户手机相册
|
||||
7. IF 用户未授权相册权限，THEN THE Qrcode_Popup SHALL 弹出提示引导用户前往设置页授权
|
||||
|
||||
### 需求 5：提现记录弹窗改为表格布局
|
||||
|
||||
**用户故事：** 作为用户，我希望提现记录以表格形式展示，以便更清晰地查看每条记录的时间、金额和状态。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Withdraw_Record_Popup SHALL 以表格形式展示提现记录，包含"时间""金额""状态"三列
|
||||
2. THE Withdraw_Record_Popup SHALL 展示表头行，列标题分别为"时间""金额""状态"
|
||||
3. THE Withdraw_Record_Popup 的状态列 SHALL 展示四种状态之一：申请中、提现中、已取消、已提现
|
||||
4. WHEN 提现记录列表为空时，THE Withdraw_Record_Popup SHALL 展示"暂无提现记录"的空状态提示
|
||||
5. WHEN 用户滚动到列表底部时，THE Withdraw_Record_Popup SHALL 自动加载下一页提现记录
|
||||
|
||||
### 需求 6：申请提现弹窗样式调整
|
||||
|
||||
**用户故事：** 作为用户，我希望申请提现弹窗更加简洁，标题明确告知我需要输入金额。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Withdraw_Popup SHALL 展示标题"请输入提现金额"
|
||||
2. THE Withdraw_Popup SHALL 展示一个金额输入框，仅允许输入正整数
|
||||
3. THE Withdraw_Popup SHALL 在输入框下方展示提示文字"每次提现最低一元起"
|
||||
4. THE Withdraw_Popup SHALL 移除现有的"可提现金额"显示区域，仅保留输入框和提示
|
||||
5. WHEN 用户输入金额并点击确认时，THE Withdraw_Popup SHALL 验证输入金额为大于等于1的正整数
|
||||
6. IF 用户输入的金额超过待提现金额，THEN THE Withdraw_Popup SHALL 弹出系统提示"超出待提现金额"
|
||||
7. WHEN 验证通过并提交成功时，THE Withdraw_Popup SHALL 关闭弹窗并弹出系统提示"申请已提交"
|
||||
|
||||
### 需求 7：邀请记录区域改为表格布局
|
||||
|
||||
**用户故事：** 作为用户，我希望邀请记录以表格形式展示，以便更清晰地查看每位下级用户的信息。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Record_Section SHALL 以表格形式展示邀请记录，包含"用户昵称""UID""注册日期""佣金"四列
|
||||
2. THE Record_Section SHALL 展示表头行，列标题分别为"用户昵称""UID""注册日期""佣金"
|
||||
3. THE Record_Section SHALL 移除现有的卡片式布局和用户头像展示
|
||||
4. THE Record_Section SHALL 仅展示当前用户的直属下级用户记录
|
||||
5. WHEN 邀请记录列表为空时，THE Record_Section SHALL 展示"暂无邀请记录"的空状态提示
|
||||
6. WHEN 用户上拉到页面底部时，THE Record_Section SHALL 自动加载下一页邀请记录
|
||||
7. THE Record_Section 的佣金列 SHALL 以红色文字展示佣金金额
|
||||
|
||||
### 需求 8：导航栏调整
|
||||
|
||||
**用户故事：** 作为用户，我希望导航栏中的"规则说明"按钮移至 banner 区域，导航栏保持简洁。
|
||||
|
||||
#### 验收标准
|
||||
|
||||
1. THE Invite_Page 的自定义导航栏 SHALL 移除右侧的"规则说明"按钮
|
||||
2. THE Invite_Page 的自定义导航栏 SHALL 仅保留返回按钮和"邀请新用户"标题
|
||||
|
|
@ -135,7 +135,7 @@ public class UserService : BaseService<User, long>, IUserService
|
|||
Headimg = user.Avatar,
|
||||
Mobile = maskedMobile,
|
||||
MobileIs = mobileIs,
|
||||
Vip = 0, // 用户等级，待接入业务逻辑
|
||||
Vip = user.UserLevel, // 用户等级（1普通用户 2合伙人 3渠道合伙人）
|
||||
Day = registrationDays
|
||||
};
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user