店铺运营管理(二级菜单与平台后台档案)前端实施契约
状态:review-passed
产品 PRD 版本:1.1
前端实施契约版本:1.1
来源变更:CR-20260805-014
确认依据:Freddy 于 2026-08-05 确认平台分组页签使用平台 Logo 增强识别;平台后台管理二级菜单保持纯文字,并沉淀为项目共享设计规则。
交付包:prd-package.json
本契约以既有“店铺管理”列表为“运营归属管理”二级菜单的视觉和交互基线:不重做左侧店铺状态、列表列序、平台筛选、跨 BU 搜索或全部/待分配/缺销售/缺客服筛选。新增的经营表现和平台后台设置只在“平台后台管理”及其单店后台档案中展开。
1. 来源与范围
| 项目 | 内容 |
|---|
| 产品 PRD | prd.md v1.0,CR-20260805-010;接口 URL、字段映射和回读规则紧随各功能说明(§5.1、§5.3、§5.4)。 |
| 迁移方式 | incremental;保留 P-001 原列表,并新增 P-002 平台后台管理与 P-003 单店后台档案。 |
| 覆盖表面 | P-001 运营归属管理原列表;P-002 平台后台管理;P-003 单店后台档案;地址编辑等轻量动作继续使用弹层。 |
| 归属配置 | 沿用现有“配置店铺/编辑店铺归属”字段:目标 BU(必填)、销售员/客服(可选)、生效日期、长期有效和结束日期。 |
| 不覆盖 | 新增店铺、店铺授权、账号密码/凭据、授权状态、订单发货、地址新增/删除、多店物流批量、3PF 仓库编辑。 |
| 特别限制 | 不产生或展示“基础设置待完成/未配置/物流待确认”状态、筛选、待办、告警或完成度;未接入平台指标不虚构评分和表现。 |
2. 页面清单
| 页面 ID | 页面名称 | 页型 | 核心任务 | 原型路径 |
|---|
| P-001 | 运营归属管理 | management list | 按既有列表查找并处理店铺归属。 | prototype/店铺物流配置/index.html |
| P-002 | 平台后台管理 | management list | 查阅实际已接入的平台后台能力与经营表现入口。 | 同一原型内二级菜单。 |
| P-003 | 单店后台档案 | detail page | 深入查看经营表现、平台后台设置和操作记录。 | 同一原型内状态路由。 |
3. 产品功能覆盖矩阵
| 功能 ID | 页面/表面 | PRD 来源 | 已确认产品功能 | 实现目标 | 状态 | 排除依据 |
|---|
| F-001 | P-001 原列表 | PRD §0.4、§0.5 | 原店铺状态、列表、筛选和归属治理 | 保持原列序、平台筛选、跨 BU 搜索、全部/待分配/缺销售/缺客服。 | 实现 | 不新增后台表现列或多字段查询表单。 |
| F-002 | P-001 归属治理 | PRD §0.4 | 原有漏配查询 | 未分配、缺销售、缺客服沿用原筛选。 | 实现 | 配错数据源未核验,不增加伪筛选。 |
| F-003 | P-001 归属配置 | PRD §0.2.2 | 单店/批量配置归属 | 复用现有配置和编辑归属弹窗语义。 | 实现 | 不批量配置物流。 |
| F-004 | P-002 后台管理列表 | PRD §0.5 | 按“全部 / Shopee / Lazada / TikTok Shop”页签分组查阅店铺与经营表现入口。 | 不展示“已接入后台能力”列;能力仅在档案内决定动作。 | 实现 | 不虚构配置完成度、评分、趋势或异常。 |
| F-005 | P-003 经营表现/后台设置 | PRD §0.5、§5.1–§5.4 | 按店铺平台与能力读取/维护既有后台对象。 | Shopee 地址、角色、渠道/COD 仅在已确认能力下展示。 | 实现 | 不新增、不删除、3PF 仓库不编辑。 |
| F-006 | P-003 操作记录 | PRD §6、§0.5 | 平台后台操作审计摘要。 | 显示后台设置与平台回读摘要。 | 实现 | 不记录地址/电话原值。 |
4. 页面设计决策
P-001 运营归属管理
- 产品范式:ERP 归属治理列表
- 页面母版:ManagementPage(
ProLayout + PageContainer + ProTable) - 页面目标:延续原方式查找、筛选、配置店铺归属;不承担平台后台信息。
- 主用户任务:按既有条件筛店铺,批量或单店修正归属。
- 信息优先级:一级:店铺身份、平台与归属;二级:既有归属缺失状态;三级:行级编辑与转移操作。
- 主操作:归属治理筛选、批量配置。
- 密度策略:standard
- 视觉强调:data-first
- 视觉强调对象:原有未分配、缺销售、缺客服状态。
- 动效策略:minimal
- 动效说明:只使用表格、筛选、全页切换、Modal 和反馈组件默认动效。
- 推荐组件:
ProLayout、PageContainer、Tabs、ProTable、Tag、Badge、ModalForm。 - 必须避免:重画原列表、改名原店铺状态、增加总览列/筛选 Chip;把基础设置做成待办;将授权状态包装为后台指标;伪造跨平台评分。
P-002 平台后台管理
- 产品范式:ERP 平台后台对象列表。
- 页面母版:ManagementPage(
PageContainer + Tabs + ProTable)。 - 页面目标:按平台分组查阅店铺后台经营表现,并进入单店后台档案。
- 主用户任务:切换平台页签查阅对应店铺,进入需要维护的单店档案。
- 信息优先级:一级:平台页签、店铺与经营表现;二级:店铺类型;三级:“查看”操作。
- 主操作:查看。
- 密度策略:standard
- 视觉强调:data-first
- 视觉强调对象:当前平台页签、店铺身份和进入档案操作。
- 平台识别:Shopee、Lazada、TikTok Shop 页签在名称左侧使用 16–20px Logo;“平台后台管理”二级菜单保持纯文字。Logo 只辅助识别,名称和选中态仍是可读与可操作的主要依据。
- 动效策略:minimal
- 动效说明:仅使用二级菜单 Tabs、表格和默认页面切换反馈。
- 推荐组件:
PageContainer、Tabs、ProCard、ProTable、Tag、Typography.Link。 - 必须避免:将能力接入当作设置完成度;虚构指标;混入运营归属编辑、账号授权或新增店铺。
P-003 单店后台档案
- 产品范式:ERP 业务档案详情页
- 页面母版:DetailPage(
PageContainer + ProDescriptions + Tabs + ProCard) - 页面目标:在一个完整页内连贯查看同一店铺的经营表现、后台设置和记录。
- 主用户任务:理解当前店铺平台后台表现,按平台能力维护后台设置。
- 信息优先级:一级:店铺身份与经营表现;二级:平台后台设置;三级:审计记录。
- 主操作:进入已接入的平台后台设置。
- 密度策略:standard
- 视觉强调:data-first
- 视觉强调对象:店铺身份、实际表现数据和当前页签。
- 动效策略:minimal
- 动效说明:只使用 Tabs、Modal、DrawerForm 和默认反馈。
- 推荐组件:
PageContainer、ProDescriptions、Tabs、ProTable、DrawerForm、ModalForm、Empty。 - 必须避免:授权/凭据操作、全页悬浮 Drawer、跨平台混排设置字段、无能力写入按钮。
5. 页面-区域-组件映射
| 页面 ID | 区域 | 业务目的 | 组件 | 数据来源 | 状态 |
|---|
| P-001 | 原筛选区 | 平台、跨 BU 店铺搜索、全部/待分配/缺销售/缺客服。 | Select、Input.Search、标准按钮 | 店铺主数据、归属 | 默认/筛选结果为空。 |
| P-001 | 原店铺表 | 展示店铺名称、所属平台、销售员、客服、业务单元、操作。 | ProTable、Tag | 店铺、归属 | 未分配/缺销售/缺客服。 |
| P-001 | 批量配置 | 一次为选中店铺配置归属。 | ModalForm、ProFormSelect、日期与长期有效控制 | 已选店铺、组织人员 | 无选择时禁用。 |
| P-002 | 平台页签与后台店铺表 | 按平台 Logo + 名称切换店铺集合,展示店铺、类型、经营表现接入状态与档案入口。 | Tabs、ProTable、Typography.Link | 店铺主数据、平台指标适配器 | 无指标。 |
| P-003 | 档案头部 | 固定表达当前店铺的平台身份。 | PageContainer、ProDescriptions | 当前店铺上下文 | 默认。 |
| P-003 | 经营表现 | 展示实际接入评分/经营指标和数据时间。 | ProTable 或 Empty | 平台指标适配器 | 无指标中性空态。 |
| P-003 | 平台后台设置 | 展示可读写的既有平台对象。 | ProTable、DrawerForm、ModalForm、Switch | 平台快照、服务端动作门控结果(不展示为字段) | 读取中/只读/无已接入操作。 |
| P-003 | 操作记录 | 追溯后台设置操作。 | ProTable | 审计日志 | 空/分页。 |
6. 普通控件契约
| 控件 ID | 所在区域 | 组件 | 值与默认态 | 限制 | 状态反馈 | 规则来源 |
|---|
| C-001 | 原筛选区 | Select、Input.Search、标准按钮 | 平台、跨 BU 店铺搜索、全部/待分配/缺销售/缺客服 | 保持原位置、文案和筛选含义 | 清空后恢复全部店铺 | PRD §0.4。 |
| C-002 | 原归属状态 | Tag、Badge | 未分配、缺销售、缺客服 | 不增加配错筛选或新状态节点 | 点击既有筛选查询 | PRD §0.4。 |
| C-003 | 批量/单店归属 | ModalForm、ProFormSelect、日期和长期有效控制 | 目标 BU(必填)、销售员/客服(可选)、生效日期、长期有效/结束日期 | 不包含物流字段 | 保存后刷新原列表 | 现有店铺配置弹窗语义。 |
| C-004 | 后台档案入口 | Typography.Link | 平台后台管理行“查看” | 一次只打开一个店铺 | 返回平台后台管理保留筛选和分页 | PRD §0.5。 |
| C-005 | 地址内容编辑 | DrawerForm | 已回读的 Shopee 既有地址字段 | 仅普通店、写权限、update_address 映射表已核验字段;无新增 | 保存后回读再刷新 | PRD §5.3。 |
| C-006 | 地址角色 | ModalForm、Checkbox.Group | 默认/揽收/退件角色 | 与地址内容保存分离;PICKUP_ADDRESS / PICK_UP_ADDRESS 映射须经联调确认 | 确认后回读 | PRD §5.3。 |
| C-007 | 渠道/COD | Switch、Modal | 平台回读值 | 仅 update_channel 映射表已核验字段;3PF/无能力只读 | 确认后写入并回读 | PRD §5.4。 |
| C-008 | 表现摘要/明细 | Tag、Empty 或只读 ProTable | 已接入指标值和数据时间;无指标为空 | 不以授权、同步、设置状态替代指标 | 中性空态 | PRD §0.5。 |
7. 复杂控件契约
| 复杂控件 | 组成与顺序 | 关闭/恢复 | 限制 |
|---|
| 单店后台档案全页 | 返回平台后台管理 → 店铺身份 → 经营表现 / 平台后台设置 / 操作记录 | 返回保留平台后台管理上下文 | 不显示账号授权或运营归属编辑。 |
| 运营归属 Modal | 待分配店铺/当前归属 → 目标 BU(必填)→ 销售员/客服(可选)→ 生效日期 → 长期有效/结束日期 | 取消不改当前归属 | 与现有店铺配置/编辑归属保持一致;仅归属字段可写。 |
| 地址编辑 Drawer | 当前回读字段 → 校验 → 保存 → 平台回读 | 取消不写入;成功后回到档案设置页签 | 仅 Shopee 普通店、已有地址、已核验 Schema;不新增。 |
| 地址角色 Modal | 当前角色 → 目标角色 → 确认 → 平台回读 | 取消保留原值 | 与地址内容编辑分离。 |
| 渠道确认 Modal | 渠道、目标值、影响说明 → 确认 → 平台回读 | 取消保留原值 | 一次只修改一个渠道字段。 |
8. 表格与数据展示契约
| 表面 | 列/内容顺序 | 行操作 | 空值与边界 |
|---|
| 运营归属管理原列表 | 店铺名称、所属平台、销售员、客服、业务单元、操作 | 保留编辑与转移操作 | 不增加评分、表现、站点或归属治理列;不显示基础设置完成度或后台档案入口。 |
| 平台后台管理列表 | 平台页签下的店铺名称、所属平台、店铺类型、后台经营表现、操作 | 查看 | 不展示已接入后台能力;未接入指标只显示中性状态。 |
| 经营表现明细 | 指标名称、数值、数据时间、来源 | 只读 | 未接入显示中性空态。 |
| 平台后台设置/地址 | 对象名称、类型、联系人、电话、完整地址、角色、状态、最近成功同步、操作 | 查看;Shopee 普通店可编辑/设置角色 | 已移除记录只读;无能力不显示动作。 |
| 平台后台设置/渠道 | 渠道名称、启用、COD、最近成功同步、操作 | 单项配置,确认后写入回读 | 不支持字段显示 —;不批量。 |
| 操作记录 | 操作人、操作类型、操作对象、结果摘要、操作时间 | 只读 | 日志不含完整地址、电话原值。 |
9. 状态与权限矩阵
| 角色/状态 | 可见 | 可操作 | 禁用/隐藏原因 | 反馈 |
|---|
| 归属漏配 | 原列表、归属配置 | 按既有权限配置归属 | 缺 BU/运营/客服 | 原有未分配、缺销售、缺客服筛选。 |
| 归属配错 | 当前无额外列表入口 | — | 正式组织/人员/有效期数据尚未核验 | 不显示伪筛选或推测结论。 |
| 正常归属 | 原列表 | 按角色维护归属 | — | 默认。 |
| 平台无读取/写入能力 | 平台后台管理、后台档案页签 | 仅现有读取或无操作 | Open API 未开放、字段/权限未核验 | 中性“暂无已接入操作”。 |
| 后台指标未接入 | 平台后台管理、经营表现页签 | 无 | 未有经核验指标适配器 | 中性“暂无指标”,不显示异常。 |
| 账号管理事项 | 不在本页 | 无 | 账号管理部职责 | 不展示密码、授权、到期、账号同步状态。 |
10. 交互与反馈
| 场景 | 规则 |
|---|
| 原列表筛选 | 保持平台、跨 BU 搜索、全部/待分配/缺销售/缺客服原有筛选结构;不增加新的治理筛选控件。 |
| 批量归属 | 只有选择店铺后可提交;保存成功刷新问题计数和原列表。 |
| 单店归属 | 保存成功刷新原列表行。 |
| 平台设置同步 | 当前对象同步期间按钮 loading;同类同步禁止重复提交。 |
| 地址/角色/渠道写入 | 必须确认或通过表单校验后调用平台;回读成功后再更新有效展示。 |
| 平台能力或指标未接入 | 使用中性空态;不转化为异常、待办或补配置提示。 |
11. 文案
| 场景 | 文案/约束 |
|---|
| 默认页标题 | 店铺运营管理 |
| 单店标题 | 店铺后台档案 · {店铺名} |
| 原列表 | 不展示后台表现数据或后台档案入口;归属治理只在本菜单完成。 |
| 平台后台管理 | 通过平台页签切换店铺集合;行操作使用“查看”进入店铺后台档案。 |
| 档案表现空态 | 当前店铺暂无已接入的平台后台经营指标 |
| 归属配错 | 数据源未核验前不在原列表显示或新增查询入口。 |
| 指标限制 | 不使用“后台健康”,不展示授权、密码、到期、账号同步异常。 |
12. 视觉契约
| 项目 | 约束 |
|---|
| 页面结构 | 原店铺运营管理列表保持原结构与控件位置;单店档案使用独立详情页;地址等局部动作使用 Drawer/Modal。 |
| 主题 | 使用 Ant Design 官方 Token,不新增品牌色、阴影、圆角或图标语言。 |
| 归属问题 | 原列表仅使用既有未分配、缺销售、缺客服表达,不新增状态类别。 |
| 表现数据 | 仅在单店档案内展示;无数据使用 Empty,不用 KPI 卡片制造数据感。 |
13. 来源追踪
| 表面 | 产品来源 | 平台来源 |
|---|
| 店铺运营管理原列表与单店档案 | PRD §0.1–§0.4 | 现有店铺运营管理信息架构。 |
| Shopee 地址、角色、渠道/COD | PRD §5.3、§5.4 | knowledge-vault/platform-apis/shopee-open-api.md。 |
| 平台后台表现 | PRD §0.5 | 具体平台指标接口尚待核验。 |
| Lazada/TikTok 条件能力 | PRD §3.1、§10.3 | 各平台 API 知识条目;未核验不形成 UI 承诺。 |
14. 前端验收清单
- [x] 原店铺状态、列表、筛选和归属配置交互保持不变。
- [x] 新能力只通过“平台后台管理”二级菜单及其后台档案进入。
- [x] 没有基础设置待完成、授权或账号同步类状态。
- [x] 未接入后台指标时使用中性空态,不虚构指标。
- [x] 原型构建、组件检查、守卫检查与同视口视觉验收;同视口视觉以 Freddy 在当前浏览器中的确认作为验收证据。
15. 待决策
| 类型 | 内容 | 影响 |
|---|
| 指标接入 | 平台后台经营指标的具体接口、字段、计算口径与刷新策略尚未核验。 | 仅预留平台后台管理/档案数据位;接入后才展示真实评分和表现。 |
| 配错数据 | 人员 BU 归属、停用状态、归属有效期的正式数据接口及优先级待核验。 | 数据核验后,需在不破坏原筛选结构的前提下另行确认查询入口。 |
| 接入前置项 | Lazada/TikTok 的字段级接口契约、权限和错误码尚未核验。 | 不创建编辑字段或写入操作。 |