🏆 领取记录 — 产品需求文档

页面编号：P006  |  版本：v1.0  |  更新日期：2026-05-14

1. 页面定位与目标

领取记录页面展示用户所有已领取的每日任务奖励历史，方便用户追踪奖励发放情况。

入口：每日任务页 → 右上角「领取记录」链接

🧱 2. 模块拆解

2.1 顶部导航栏

• 左侧返回按钮 ‹ → 返回每日任务页
• 标题「领取记录」

2.2 记录列表

• 每条记录为独立白底圆角卡片
• 顶部行：奖励名称（如交易任务 I ~ V）+ 奖励金额（绿色，如 +₹20）
• 底部行：完成时间标签 + 具体时间（YYYY/MM/DD HH:MM 格式）
• 按时间倒序排列，最新记录在最上方

⚙️ 3. 交互规则

📡 4. 数据规格

📋 交易订单（订单详情） — 产品需求文档

页面编号：P012  |  版本：v3.0  |  更新日期：2026-05-14

1. 页面定位与目标

交易订单详情页展示单笔订单的完整信息，包括订单状态、交易金额、银行卡信息、时间线等。页面根据订单的不同状态动态展示对应内容。原型中展示了4种状态的完整示例：交易中（购买USDT）、待处理（购买INR）、交易成功（购买INR）、交易失败（出售INR）。

入口：订单页 → 点击任意订单卡片 → 进入详情

📱 2. 四种状态原型说明

2.1 交易中（第一排左侧）— 购买 USDT

• 订单类型：购买 USDT（绿色）
• 状态标签：橙色胶囊「交易中」
• 提示信息：「交易中，预计 15:12 完成」
• 购买金额：19USDT(₹300.00)
• 奖励金额：₹12.00
• 实际到账：₹312.00
• 支付方式：链上支付（TRC20）
• 交易哈希：a1b2c3d4e5f6...7890（支持复制）
• 订单编号：202505221945001
• 下单时间：2025/05/22 19:45
• 不显示结束时间（交易尚未结束）

2.2 待处理（第一排右侧）— 购买 INR

• 订单类型：购买 INR（绿色）
• 状态标签：紫色胶囊「待处理」
• 提示信息：「待处理，预计 14:58 完成」
• 购买金额：₹200.00
• 奖励金额：₹8.00
• 实际到账：₹208.00
• 支付方式：银行卡
• 银行卡号：6214 **** **** 2451
• 订单编号：202505222030001
• 下单时间：2025/05/22 20:30
• 不显示结束时间（交易尚未开始处理）

2.3 交易成功（第二排左侧）— 购买 INR

• 订单类型：购买 INR（绿色）
• 状态标签：绿色胶囊「交易成功」
• 提示信息：「交易已完成，资金已到账。」
• 购买金额：₹200.00
• 奖励金额：₹8.00
• 实际到账：₹208.00
• 支付方式：银行卡
• 订单编号：250522203000001
• 下单时间：2025/05/22 20:30
• 结束时间：2025/05/22 20:48
• 此页面为动态页面，点击订单列表中的卡片会传入数据并动态渲染

2.4 交易失败（第二排右侧）— 出售 INR

• 订单类型：出售 INR（红色）
• 状态标签：灰色胶囊「交易失败」
• 提示信息：「订单交易失败，请检查后重新尝试」
• 出售金额：₹2,368.96
• 奖励金额：₹15.00
• 实际到账：₹2,353.96
• 支付方式：银行卡
• 银行卡号：6214 **** **** 2456
• 订单编号：202504251421002
• 下单时间：2025/04/25 14:21
• 结束时间：2025/04/25 14:39

🧱 3. 模块拆解

3.1 顶部导航栏

• 左侧返回按钮 ‹ → 返回订单列表
• 标题：统一显示「交易订单」
• 右侧状态标签 — 圆角胶囊形式，颜色随状态变化

3.2 状态提示区域

• 灰色底圆角卡片，左侧感叹号图标 + 提示文案
• 待处理/交易中：显示预计完成时间
• 交易成功/交易失败：显示结果提示文案

3.3 订单信息明细卡片

• 白底圆角卡片，内含多行信息，每行左侧灰色标签 + 右侧数据
• 订单类型 — 购买 INR/USDT（绿色）或 出售 INR（红色）
• 购买金额/出售金额
• 奖励金额 — 绿色加粗，旁边感叹号图标可点击弹窗查看说明
• 实际到账（购买）/ 实际到账（出售）— 旁边感叹号图标可点击弹窗
• 支付方式 — 银行卡
• 银行卡号 — 脱敏格式：6214 **** **** XXXX

3.4 订单编号与时间卡片

• 订单编号 — 系统唯一标识，右侧复制图标可复制
• 下单时间 — 格式 YYYY/MM/DD HH:MM，所有状态均显示
• 结束时间 — 仅「交易成功」和「交易失败」状态显示

3.5 弹窗组件

• 奖励金额说明弹窗 — 点击奖励金额旁感叹号触发，说明「奖励金额会自动发放到平台账户中」，底部「我知道了」按钮关闭
• 实际到账说明弹窗（购买） — 点击实际到账旁感叹号触发，说明「用户购买完成后实际在平台中的到账金额」，底部「我知道了」按钮关闭
• 实际到账说明弹窗（出售） — 点击实际到账旁感叹号触发，说明「此金额为最终到达用户银行卡账户金额」，底部「我知道了」按钮关闭
• 弹窗样式：半透明遮罩 + 白底圆角卡片居中，点击遮罩可关闭

⚙️ 4. 交互规则

🎨 5. 状态样式规范

5.1 详情页状态标签

5.2 订单列表卡片状态

🔄 6. 订单类型与字段差异

订单分为「购买」和「出售」两种类型，部分字段标签和颜色会随类型变化：

购买订单支持两种货币类型：

• 购买 INR — 直接使用 INR 购买，金额标签显示 INR 金额
• 购买 USDT — 通过 USDT 购买，金额标签显示 INR 等值金额

📡 7. 数据规格

🧮 8. 状态流转逻辑

订单状态按以下流程流转：

• 待处理 → 用户提交订单后进入，等待系统分配
• 交易中 → 系统分配完成，正在执行交易
• 交易成功 → 交易执行完毕，资金已到账（终态）
• 交易失败 → 交易执行异常或超时（终态）

时间字段显示逻辑：

• 待处理/交易中 — 仅显示「下单时间」，不显示「结束时间」
• 交易成功 — 显示「下单时间」+「结束时间」
• 交易失败 — 显示「下单时间」+「结束时间」

💳 银行卡详情 — 产品需求文档

页面编号：P009  |  版本：v1.0  |  更新日期：2026-05-14

1. 页面定位与目标

银行卡详情页展示选中银行卡的完整信息、交易统计数据和管理操作，用户可查看该卡的处理状态、切换出售开关、查看最近交易订单或删除银行卡。

入口：银行卡列表 → 点击任意银行卡 → 进入详情

🧱 2. 模块拆解

2.1 顶部导航栏

• 左侧返回按钮 ‹ → 返回银行卡列表
• 标题「银行卡详情」
• 右侧灰色垃圾桶图标 → 触发删除确认弹窗

2.2 银行信息卡片

• 白底圆角卡片，灰色边框
• 上行：「银行」标签 + 银行名称（如 PHONEPE、FREECHARGE 等），文字黑色
• 下行：「卡号」标签 + 卡号（格式：6214 **** **** XXXX），文字黑色
• 数据根据从列表页传入的参数动态展示

2.3 最近10笔交易订单

• 绿色渐变横幅按钮，白色文字 + 右侧箭头
• 点击查看该银行卡最近10笔交易记录

2.4 统计数据卡片

2.5 详情项卡片

⚙️ 3. 交互规则

🗑️ 4. 删除确认弹窗

• 全屏模态弹窗，半透明黑色遮罩
• 白底圆角容器（20px），居中显示
• 顶部灰色圆形垃圾桶图标
• 标题「确认删除」— 黑色文字
• 说明「删除后将无法恢复，确定要删除这张银行卡吗？」— 灰色文字
• 「取消」按钮 — 浅灰底 #f5f5f7，黑色文字
• 「确认删除」按钮 — 红色底 #f6465d，白色文字

📡 5. 数据规格