SxsnWechat/docs/superpowers/specs/2026-05-23-family-member-channel-select-design.md

小程序家庭成员渠道选择 设计文档

日期： 2026-05-23 版本： 1.0

---

1. 背景

小程序新增/编辑家庭成员时，需要支持为成员指定渠道。渠道单选，只能从当前登录会员的渠道列表中选择。后端接口已就绪。

---

2. 改动范围

文件	改动类型
SxsnWechat/pagesMy/familyMemberVindicate.vue	新增渠道选择行 + 数据加载/提交逻辑

---

3. UI 设计

在「成员信息」表单区域，「就读学校」行之后新增一行：

渠道        [请选择渠道 ▼]

• 样式与现有 pre 行完全一致（左侧标签 209rpx + 右侧内容右对齐）
• 使用微信小程序原生 <picker> 组件（mode="selector"），与项目现有风格一致
• 渠道为非必填，可不选（成员继承家长渠道）
• 右侧显示已选渠道名称，未选时显示「请选择渠道」（灰色占位）

---

4. 数据流

4.1 新增成员

1. 页面 onLoad 时调 GET /app/channel/list 获取会员渠道列表，存入 channelList
2. 用户选择渠道（可不选），存入 selectedChannelId
3. 点击保存 → 校验通过 → 调 POST /core/family/member 新增成员
4. 成功后：
   • 若 selectedChannelId 有值 → 调 POST /app/member/setChannels?memberId={新成员id}&channelIds={selectedChannelId}
   • 若无值 → 跳过渠道设置
5. 跳转

4.2 编辑成员

1. 页面 onLoad 时并行调：
   • GET /app/channel/list 获取会员渠道列表
   • GET /app/member/channelList?memberId=xxx 获取成员当前渠道（取第一个，单选）
2. 回显已选渠道
3. 点击保存 → 调 PUT /core/family/member 更新成员
4. 成功后调 POST /app/member/setChannels?memberId=xxx&channelIds={selectedChannelId}
   • 若未选渠道，channelIds 传空字符串（清空成员渠道，继承家长）
5. 跳转

---

5. 接口

接口	方法	说明
/app/channel/list	GET	获取会员渠道列表（需登录）
/app/member/channelList?memberId=xxx	GET	获取成员当前渠道（编辑时回显）
/app/member/setChannels	POST	设置成员渠道，参数：memberId、channelIds

---

6. 错误处理

场景	处理
获取渠道列表失败	Toast 提示，渠道选择行不显示（不阻断保存）
setChannels 失败	Toast 提示错误信息，但不阻断页面跳转（成员已保存成功）
渠道列表为空	渠道行显示「暂无可用渠道」，禁用选择

---

7. 不在本次范围内

• 家庭成员列表页展示渠道信息（已在管理端实现）
• 报名时按成员渠道过滤活动