家庭成员渠道展示设计文档

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

1. 背景

管理端「家庭成员」列表（familyMember.vue）目前不展示渠道信息。后端 FamilyMemberEntity 已有 channelIds 字段（逗号分隔的渠道 ID），但 FamilyMemberDTO 未暴露，需后端补充渠道名称字段，前端新增列展示。

2. 改动范围

端	文件	改动类型
后端	`FamilyMemberDTO.java`	新增 `channelNames` 字段
后端	`FamilyMemberServiceImpl.java`	重写 `page()` 方法，填充 `channelNames`
前端	`src/views/modules/member/components/familyMember.vue`	新增「所属渠道」列

3. 后端设计

3.1 FamilyMemberDTO 新增字段

@ApiModelProperty(value = "渠道名称，逗号分隔，如「渠道A、渠道B」")
private String channelNames;

3.2 FamilyMemberServiceImpl — 重写 page()

在基类 CrudServiceImpl.page() 结果返回后，批量填充 channelNames：

1. 收集所有行的 channelIds（过滤空值）
2. 解析出所有渠道 ID，去重
3. 一次性查询 ChannelEntity（channelDao.selectBatchIds）
4. 建立 id -> channelName 的 Map
5. 逐行拼接 channelNames（逗号分隔，若 channelIds 为空则 channelNames 为空字符串）

只做一次批量查询，不产生 N+1 问题。

4. 前端设计

文件： src/views/modules/member/components/familyMember.vue

在「就读学校」列后新增：

<el-table-column label="所属渠道">
  <template slot-scope="scope">{{ scope.row.channelNames || '-' }}</template>
</el-table-column>

channelNames 有值时直接展示（如「渠道A、渠道B」）
为空时展示「-」

5. 数据流

GET /core/family/member/page
  → FamilyMemberServiceImpl.page()
    → 基类查询 ht_family_member
    → 批量查 ht_channel（by channelIds）
    → 填充每行 channelNames
  → 返回 PageData<FamilyMemberDTO>
  → 前端列表展示 channelNames

6. 不在本次范围内

管理端修改成员渠道的功能（规格书 §4.4 属于小程序端能力）
渠道筛选/过滤

2026-05-22-family-member-channel-display-design.md 2.2 KB History Raw