人才权益搜索页面操作说明

页面信息

  • 页面名称:人才权益搜索
  • 路由:/pages/benefit-search/benefit-search
  • 源码:pages/benefit-search/benefit-search.uvue
  • 当前状态:搜索历史、关键词结果、全部商家排序列表、分页、空状态和失败重试已完成,真实搜索/商家列表接口待接入。

功能点

功能 当前实现 后续接口目标
页面入口 点击人才权益页搜索框进入普通搜索模式;点击分类“全部”携带 mode=all 进入全部商家模式。 增加来源参数用于埋点和初始化列表模式。
关键词搜索 支持输入、键盘搜索确认和搜索按钮提交。 携带关键词请求权益分页列表。
搜索历史 页面内展示演示历史,完成搜索后将新关键词置顶并去重,最多保留 10 条。 根据产品要求决定使用本地持久化或用户级服务端历史。
全部商家 全部模式默认按 sort 从小到大展示跨分类商家,首批 6 条,触底继续加载;包含首屏/下一页失败重试、加载中、到底和空状态。 后台按 sort ASC, id ASC 稳定分页,返回 hasNext 或总数。
搜索结果 在普通搜索或全部模式中按商家名称、地址、分类和优惠文案搜索,展示店铺图片、分类标签、优惠标签和地址。 替换为后台分页搜索结果,并使用权益或商户 ID 跳转详情。
分类详情跳转 根据商家类型进入餐饮/酒店/景区等通用商家详情或影院、购物、医疗、金融、停车/加油、洗车专属详情;通用详情当前携带名称、图片、地址和优惠快照。 后台返回 merchantType、详情业务 ID 和目标动作配置,前端不得仅凭名称判断;详情接口返回后覆盖路由快照。
历史回填 点击历史标签后自动填入关键词并执行搜索。 返回真实搜索结果。
清空历史 点击删除图标后弹出二次确认,确认后清空。 若历史存储在服务端,则同步调用清空接口。
返回 点击左上角图标返回人才权益页。 无。

操作说明

  1. 在人才权益页点击顶部搜索区域进入本页。
  2. 输入权益、商户或服务关键词,点击橙色“搜索”按钮或键盘搜索键。
  3. 点击已有搜索历史可快速再次搜索。
  4. 点击“搜索历史”右侧删除图标,并在确认框中确认,可清空全部历史。
  5. 点击左上角返回图标回到人才权益页。
  6. 从人才权益页点击“全部”时,下方直接展示全部商家;输入关键词后切换为搜索结果,清空关键词恢复全部列表。
  7. 上滑到底加载下一批商家,后台无下一页时展示“已经到底了”。

异常处理

场景 当前处理 接口接入要求
空关键词提交 提示“请输入搜索内容”,不执行搜索。 不发起网络请求。
搜索首屏失败 保留关键词和历史,展示“商家列表加载失败”及重新加载入口,不展示无结果状态。 点击后使用相同关键词重新请求第一页。
搜索下一页失败 保留已有商家,底部展示点击重试且不推进页码。 点击后继续请求失败页。
搜索无结果 未匹配演示店铺时显示“暂未搜索到相关店铺”。 接口返回空数组时沿用该空状态,并提供清除关键词或返回全部权益入口。
清空历史误触 使用二次确认弹窗。 服务端清空失败时保留本地历史并明确提示。
关键词过长 输入框限制为 30 个字符。 后端仍需进行长度和非法字符校验。

接口预留

  • 搜索接口复用《项目接口对接说明》中“搜索/分页获取权益列表”。
  • 建议参数包含:keyword、categoryId、mode、page、pageSize、sortField=sort、sortOrder=asc。
  • 返回字段包含商家 ID、名称、商家类型、分类名称、优惠文案、图片、地址、sort、详情类型、详情业务 ID、可用状态和分页信息。
  • 排序必须稳定:优先 sort ASC,相同排序值再按商家 ID 升序,避免翻页重复或漏项。