chatapp-h5/h5/hyapp/agency-center/original-vue-logic.md

原 Vue Agency Center 逻辑清单

来源：

• chatapp-h5/h5/js/index--RUKA0EA-1776148658686.js
• chatapp-h5/h5/js/pageConfig-BUpLPO7w-1776148658686.js
• chatapp-h5/h5/js/teamBill-BWXvrc1S-1776148658686.js
• chatapp-h5/h5/js/index-CIAVq8iD-1776148658686.js
• 旧静态复刻：chatapp-h5/h5/agency-center/agency-center.js

页面初始化

• 初始化 i18n：读取当前 locale，并调用语言切换逻辑。
• 初始化 Vue Router。
• 初始化 identity store，并设置身份为 AGENCY。
• 清空 payee store。
• 使用 usePageConfig("AGENCY_CENTER", { needsTeamInfo: true, forceRefresh: true, onDataLoaded })。
• 页面 mounted 后触发：
  • identity = "AGENCY"
  • 获取银行卡列表
  • 获取提现/KYC 信息
  • 获取主播工资提现是否可用
  • 清空收款人缓存
• usePageConfig 完成基础数据加载后执行：
  • 获取团队成员数量
  • 获取团队账单概要
  • 获取当前用户成员工作汇总

App 连接与请求头

• 判断是否在 App/WebView 环境。
• 如果已有连接且请求头缓存有效，复用缓存请求头。
• 如果未连接，调用 App bridge 获取 access origin 参数。
• 解析 App 返回参数后写入 HTTP 请求头。
• 关键请求头：
  • Authorization
  • Req-Lang
  • Req-App-Intel
  • Req-Imei
  • Req-Sys-Origin
• 连接失败时可能跳转 /not_app。
• 新 hyapp 页面可沿用 Host Center 的 URL token 模式：从 ?token= 或 hash query 读取 token，再转为 Authorization: Bearer <token> 请求 Java 接口。

用户与团队信息

GET /team/member/profile

• 用途：获取当前用户信息。
• 显式查询参数：无。
• 依赖：Authorization 请求头。
• 原 Vue 展示或缓存字段：
  • id
  • account
  • userNickname
  • name
  • userAvatar
  • ownSpecialId.account
• usePageConfig 中写入 userInfo：
  • id = body.account
  • account = body.account
  • userNickname = body.userNickname
  • userAvatar = body.userAvatar
• 旧静态复刻中保留完整 body 到 state.userProfile，并缓存到 localStorage.userProfile。

GET /team/entry

• 用途：获取当前用户所属团队入口信息。
• 显式查询参数：无。
• 依赖：Authorization 请求头。
• 原 Vue 使用 body.teamProfile || body 作为团队信息。
• 团队 ID 来源：teamProfile.id || body.id。
• 旧静态复刻缓存到 localStorage.teamInfo。
• team/entry 失败或空返回时，团队信息置空。

GET /team/bd-profile

• 用途：获取当前用户所在团队关联的 BD 用户资料。
• 显式查询参数：无。
• 依赖：Authorization 请求头。
• 后端实现：当前登录用户 -> TeamMember.teamId -> BusinessDevelopmentTeamService.getBdUserIdByTeamId(teamId) -> UserProfileDTO。
• 原 Vue agency-center 未直接调用该接口；该接口由 Java 后端已有的 TeamRestController#getTeamBdProfile 提供。

身份与权限

GET /app/h5/identity

• 用途：获取 H5 身份和路由权限。
• 显式查询参数：无。
• 原逻辑根据返回字段生成 roles：
  • freightAgent
  • agent
  • bdLeader
  • bd
  • anchor
  • admin
• 主角色优先级：
  • guest
  • anchor
  • agent
  • bd
  • bdLeader
  • freightAgent
  • admin
• 默认跳转页：
  • admin -> /admin-center
  • freightAgent -> /coin-seller
  • agent -> /agency-center
  • bdLeader -> /bd-leader-center
  • bd -> /bd-center
  • anchor -> /host-center
  • guest -> /apply
• Agency Center 允许 agent 访问；旧权限配置里 freightAgent 也允许访问 /agency-center。
• 如果当前路由不在允许列表中，跳转到主角色默认页。

工资/余额

GET /wallet/bank/balance

• 用途：获取可用工资余额。
• 显式查询参数：无。
• 原 Vue usePageConfig 写入 salaryInfo.currentSalary。
• 展示字段：$${salaryInfo.currentSalary}。
• 原逻辑只在 body 是 number 时使用 body.toFixed(2)，否则展示 0。
• 请求失败时展示 0，并 toast：Failed to load balance. Please try again.
• 新页面如果展示 Agency 可用工资，优先复用这个数据源。

今日任务/主播任务

GET /team/member/work/statistics-now

• 用途：获取当前用户今日工作统计。
• 查询参数：
  • dataType=DAILY
  • memberId=<当前用户 id/account>
• 原 Vue taskInfo：
  • anchorType = "Chat"
  • minutesProgress = min(ownTime + otherTime, 120)
  • minutesTotal = 120
  • giftTask = acceptGiftValue || 0
• 原 Agency Center 组件展示三个格子：
  • Host type
  • Minutes
  • Gift Task
• 旧静态复刻里实际只展示 Minutes，Host type 和 Gift Task HTML 被注释。

成员工作汇总

GET /team/member-work

• 用途：获取当前用户工作目标和结算汇总。
• 查询参数：
  • userId=<当前用户 id>
• 原函数名：fetchMemberWorkTotal。
• 原逻辑：
  • 读取 body.targets || []
  • 跳过 targets[0]
  • 再请求或读取 identity 判断身份
  • 如果是 agent：累加 target.settlementResult.ownSalary + target.settlementResult.memberSalary
  • 如果是 anchor：累加 target.settlementResult.memberSalary
  • 写入 memberWorkTotal = total.toFixed(2)
• 注意：Agency Center 主模板里没有明确展示 memberWorkTotal，这是页面加载时保留的汇总逻辑。

团队成员数量

GET /team/members/count

• 用途：获取团队成员数量。
• 查询参数：
  • id=<teamId>
• 团队 ID 来源：/team/entry 的 teamProfile.id || id。
• 返回使用：
  • body.memberQuantity
• 原点击 Team Member 时会把成员数量带到 URL：
  • /team-member?source=agency-center&members=<memberQuantity>
• 请求失败时旧静态复刻 fallback 为 87，Vue 构建产物 catch 中也有相同 fallback。

团队账单概要

GET /team/bill

• 用途：获取团队账单列表，Agency Center 首页只取第一条作为概要。
• 查询参数：
  • id=<teamId>
• 原逻辑：
  • 读取 body[0]
  • billBelong 形如 YYYYMM，展示为 YYYY.MM
  • hostSalary = settleResult.memberSalary.toFixed(2) || "–"
  • agentSalary = settleResult.ownSalary.toFixed(2) || "–"
  • total = settleResult.totalSalary.toFixed(2) || "–"
• 状态映射：
  • SETTLED -> Completed
  • UNPAID -> In progress
  • HANG_UP -> Out of account
  • PAY_OUT -> Completed
• 状态颜色逻辑：
  • In progress：蓝色
  • Pending：红色
  • Completed：绿色
  • Out of account：灰色
• 注意：Agency Center 首页初始化了 teamBill，但主模板只提供 Team Bill 入口，不直接展示账单卡片。

团队政策

GET /team/release/policy

• 用途：Platform Policy 页面使用，不在 Agency Center 首页直接渲染。
• 查询参数：
  • id=<teamId>
• 原 PlatformPolicy 通过 URL from=agencycenter 判断是否展示代理字段。
• 当 from=agencycenter 时，政策卡片展示：
  • time/hours
  • target
  • host_salary
  • agent_salary
  • total_salary
• 线上 Java 接口需要参数名 id，不能用 teamId。

银行卡与提现信息

GET /wallet/bank-card/list

• 用途：获取银行卡/收款方式列表。
• 显式查询参数：无。
• 原逻辑：
  • bankCards = body
  • defaultBankCard = body.find(item => item.use) || null

GET /wallet/withdraw-info/list

• 用途：获取提现/KYC 信息。
• 显式查询参数：无。
• 原逻辑：
  • 如果 body.length > 0，取第一条
  • passportFrontUrl 按 JSON 字符串解析成 previewUrls
  • 合并成 withdrawInfo
• 点击提现时如果 withdrawInfo 缺失，会弹出补全信息弹窗。

GET /wallet/bank/host-salary/withdraw/enabled

• 用途：控制是否展示 Cash withdraw 入口。
• 显式查询参数：无。
• 原 Agency Center 仍然调用 host-salary 提现开关。
• 返回使用：
  • withdrawEnabled = Boolean(body)

点击提现逻辑

• 计算值：missingWithdrawInfo = withdrawInfo == null || defaultBankCard == null
• 点击 Cash withdraw：
  • 如果缺提现信息或默认银行卡，打开补全信息弹窗。
  • 否则跳转 /cash-withdraw。
• 补全信息弹窗：
  • 标题：prompt
  • 主文案：fill_info_tips
  • 辅助文案：card_issue_tips
  • 按钮：to_improve
  • 按钮跳转 /agency-setting

页面展示结构

• 顶部：
  • GeneralHeader
  • 标题：agency_center
  • 右侧消息图标，点击跳转 /message
  • 原 Agency Center 没有未读红点逻辑。
• 消息页：
  • Message 页面 mounted 后请求 /team/user/apply/record?teamId=<teamId>&status=WAIT。
  • 返回的 WAIT 记录作为待处理入团申请列表展示。
  • 可在新 Agency Center 中复用该 WAIT 记录数量作为消息红点依据；原 Vue 没有单独的 unread 字段或 unread 接口。
  • 原 Message 记录格式：
    • createUserProfile.userAvatar
    • createUserProfile.userNickname
    • createUserProfile.account
    • 操作按钮：Agree、Refuse
  • 同意/拒绝接口：POST /team/process/user/apply，body 为 { id, status }，status 可取 AGREE 或 REJECT。
• 工资卡片：
  • 标题：my_available_salary
  • 右侧按钮：my_salary_details
  • 金额：$${salaryInfo.currentSalary}
• 今日任务卡片：
  • 标题：today_host_task
  • 原 Vue 展示 Host type、Minutes、Gift Task
  • 旧静态复刻只展示 Minutes
• 菜单卡片：
  • Platform policy
  • Exchange coins
  • Transfer
  • Cash withdraw，受提现开关控制
  • Bank Accounts
  • Team Member
  • Team Bill
  • Invite Members

点击跳转

• 消息：/message
• 工资详情：/history-salary
• 平台政策：/platform-policy?from=agencycenter
• 兑换金币：/exchange-gold-coins
• 转账：/transfer
• 提现：/cash-withdraw
• 银行卡/收款信息：/agency-setting
• 团队成员：/team-member?source=agency-center&members=<memberQuantity>
• 团队账单：/team-bill
• 邀请成员：/invite-members
• 补全提现信息：/agency-setting

可复用到新 h5/hyapp/agency-center 的数据源

• 当前用户信息：GET /team/member/profile
  • 可展示头像、昵称、UID、靓号。
• 当前团队信息：GET /team/entry
  • 可取 agency/team 名称、teamId，并作为团队成员、账单、政策接口的前置数据。
• 当前团队关联 BD：GET /team/bd-profile
  • 可展示 BD 的头像/昵称/账号等用户资料；旧 Vue agency-center 未直接调用，但后端已有接口。
• 当前余额/工资：GET /wallet/bank/balance
  • 可作为 Agency Center 的 Salary。
• 今日工作数据：GET /team/member/work/statistics-now?dataType=DAILY&memberId=<当前用户 id/account>
  • 可展示 Minutes，是否保留 Host type/Gift Task 需要按新设计决定。
• 团队成员数量：GET /team/members/count?id=<teamId>
  • 可展示 Team Member 入口右侧数量，或用于跳转参数。
• 团队账单概要：GET /team/bill?id=<teamId>
  • 可展示最近账单、Agent salary、Host salary、Total。
• 提现入口开关：GET /wallet/bank/host-salary/withdraw/enabled
  • 可决定是否展示 Cash withdraw。
• 收款/提现信息：GET /wallet/bank-card/list、GET /wallet/withdraw-info/list
  • 可决定点击提现时直接进入还是提示补充信息。
• 身份权限：GET /app/h5/identity
  • 可判断是否为 agent，非代理时应避免展示代理中心主内容。

新页面实现注意点

• 新页面应放在 h5/hyapp/agency-center/，不要改旧 Vue 构建产物和旧 h5/agency-center。
• 视觉风格参考 h5/hyapp/host-center：浅绿色背景、圆角白色卡片、移动端固定宽度体验、URL token 请求。
• 先完成数据加载再决定展示代理中心或非代理状态，避免接口完成前闪跳。
• 如果需要非代理兜底页，应基于 /app/h5/identity 的 agent 字段判断。
• 如果继续使用政策接口，Java 线上接口参数必须是 id=<teamId>。