# 页面名:task-detail-relationship(任务详情 - 关系构建) > 本页为 task-detail 系列的变体页面,完整交互说明见 `task-detail.md`。 > 此文件仅记录与 task-detail.html(高优先召回)的差异。 ## 与 task-detail.html 的差异 | 差异点 | task-detail(高优先召回) | task-detail-relationship(关系构建) | |--------|--------------------------|--------------------------------------| | Banner 主题 | `theme-red` 红色 | `theme-pink` 粉色 | | 区域顺序 | ①与我的关系 → ②任务建议 → ③维客线索 → ④备注 → ⑤近期服务记录 | ①维客线索 → ②与我的关系(含近期服务记录)→ ③任务建议 → ④备注 | | 话术样式 | 气泡样式(`.speech-bubble`,带复制按钮) | 竖线样式(`border-l-2`,左侧竖线+左内边距) | | 任务建议标题 | 💡 建议执行 | 💝 关系构建重点 | | 任务建议背景 | 蓝色系 | `from-pink-50 to-rose-50` | | 底部按钮颜色 | `from-primary to-blue-500` | `from-pink-500 to-rose-500` | | 导航栏"放弃"按钮 | 有 | 无 | | 近期服务记录 | 独立区域(第5区域) | 嵌入"与我的关系"卡片内 | | 备注区域 | 有已有备注展示 | 可能为空状态(提示「快点击下方备注按钮,添加客人备注!」) | ## 实现建议 在小程序中,task-detail 系列不需要 4 个独立页面。可以在同一页面通过路由参数 `taskType` 控制: - Banner 主题色 - 区域排列顺序 - 话术样式(气泡 vs 竖线) - 任务建议标题和背景色 - 是否显示"放弃"按钮