# 用户端首页服务归属展示优化操作日志

操作时间：2026-09-02

操作类型：修改、扩展

影响模块：用户端 Flutter App 首页

## 操作前状态

首页将接口返回的气站名称与配送点名称直接拼接在“当前服务归属”下方，例如“薛海 1”。用户无法判断两个值分别代表气站还是配送点；无配送点与无服务关系也缺少明确说明。

## 具体操作

1. 根据确认的视觉方案一新增独立服务归属卡片，沿用现有安全蓝、白色卡片、圆角和间距令牌。
2. 将气站和配送点拆分为“所属气站”“服务配送点”两行，气站名称使用主要信息字重。
3. 无配送点时显示“服务方式：气站直接服务”；无服务关系时显示“尚未建立服务关系”。
4. 组织名称限制为最多两行，超出部分使用省略号，避免破坏移动端布局。
5. 新增固定数据的本地视觉预览入口，并在 390 × 844 视口完成两轮截图对照。
6. 新增组件测试，覆盖完整关系、气站直服、无关系和长名称四种情况。

## 操作后状态

首页能够明确区分服务主体与履约网点，不再展示难以理解的拼接名称。功能仍只读，不新增点击、状态或接口字段，原有公告加载、刷新和底部导航行为保持不变。

## 代码变更

- `apps/user_app/lib/ui/features/home/home_page.dart`：替换旧的拼接展示，接入独立服务归属卡片。
- `apps/user_app/lib/ui/features/home/service_relation_card.dart`：新增服务归属组件及空值处理。
- `apps/user_app/test/ui/service_relation_card_test.dart`：新增四类组件测试。
- `apps/user_app/tool/home_visual_preview.dart`：新增不依赖账号和网络的视觉验收入口。
- `apps/user_app/design-qa.md` 与 `apps/user_app/design-qa/`：记录视觉验收基线、截图和对照结果。
- `docs/03-用户端App需求.md`：补充首页服务归属展示规则。

## 验证结果

- `flutter analyze`：通过，无问题。
- `flutter test`：通过，共 8 项测试。
- `flutter build web --release --dart-define=API_BASE_URL=http://rest.heqiapp.com`：通过，已生成 Web 发布构建。
- 390 × 844 页面视觉验收：通过；第二轮未发现 P0、P1、P2 问题。
- 边界案例：已覆盖无配送点、无服务关系、长组织名称最多两行。

## 风险评估

- 影响范围仅限用户端首页展示层，不修改 API、数据模型、登录态或服务关系业务规则。
- 组织名称超过两行时会省略尾部内容，这是为保证移动端布局稳定的预期行为。
- 视觉预览使用固定示例数据，仅用于开发验收，不会进入生产路由或伪造业务状态。