1. 介绍 / 概述
订单管理不是“只看今天订单”的单一页面,而是后台运营人员用于查看当日经营动态、定位目标订单、查看订单详情和处理退款的统一入口。
该页面需要同时满足两类核心使用场景:
- 桌面端:高密度查看订单、快速筛选、快速处理。
- 移动端:在不横向滚动的前提下,完成查看、筛选、详情和退款操作。
本次需求以“用户流程”为主线,覆盖订单管理页面中的经营指标、筛选搜索、订单列表、商品摘要、订单详情、退款处理和多币种展示。
默认用户角色:
- 运营人员:查看订单动态、筛选订单、查看详情、发起退款。
- 客服/值班人员:根据订单号、昵称、手机号、交易单号等快速定位订单并处理售后。
2. 目标
- 让运营人员进入订单页后,先看到“当日销售动态”,再进入订单处理。
- 让用户可以通过状态、设备、搜索维度、日期范围快速定位订单。
- 让桌面端在高密度信息下仍可清晰浏览 20 笔订单,不依赖额外页面跳转。
- 让移动端在常见大屏手机上无需左右滑动即可完成核心操作。
- 让退款流程标准化,支持客诉退款与赠饮退款两种退款类型。
- 让多币种订单在列表、汇总、详情、退款流程中保持金额展示一致。
- 让桌面端和移动端在交互方式上各自最优,但在信息结构和业务规则上保持一致。
3. 用户流程 / 用户故事
UF-001:进入订单管理并查看当日经营动态
入口截图
描述: 作为运营人员,我希望进入订单管理页面后先看到当日经营指标,这样我能快速判断今天的销售和履约情况。
主流程:
- 用户进入订单管理页面。
- 页面顶部展示与其他后台页面风格一致的紧凑页头。
- 页头下方展示 3 张动态指标卡。
- 用户可基于指标判断是否需要进一步筛选订单。
验收标准:
- □页面顶部风格与其他后台页面保持一致,不单独突出“订单工作台”这类概念。
- □页面指标区只保留 3 个指标:
今日支付金额、今日完成订单、客单价。 - □页面不再展示
取消率和近 1 小时趋势。 - □指标数据基于“当日订单”动态计算,而不是基于当前列表页分页结果。
- □顶部指标卡中的“今日”必须按用户当前浏览器本地日期计算。
- □订单列表中的订单时间仍按订单产生时的本地时间语义展示,不因指标卡统计口径调整而改变。
- □桌面端指标卡以 3 列并排展示。
- □移动端指标卡以一屏一张、支持左右滑动的方式展示。
- □实际打开桌面端和移动端页面查看指标区,确认展示方式和交互符合预期。
UF-002:通过筛选与搜索快速定位订单
入口截图
描述: 作为运营人员或客服,我希望通过状态、设备、搜索维度和日期快速缩小订单范围,这样我能尽快找到目标订单。
主流程:
- 用户进入订单页后,先使用顶部快筛或高级筛选。
- 用户可按订单状态筛选。
- 用户可按设备筛选,且设备搜索支持设备编号和点位名称。
- 用户可选择搜索维度,再输入关键字搜索。
- 用户按天选择开始日期和结束日期。
- 用户点击“应用筛选”后查看结果。
- 页面同步展示符合条件的记录数、总金额和成功金额。
验收标准:
- □桌面端筛选区默认紧凑展示,并默认折叠高级筛选。
- □桌面端首行只保留
订单状态、设备筛选、高级筛选入口。 - □桌面端高级筛选区必须包含搜索维度、关键词、开始日期、结束日期、清空、应用筛选。
- □搜索维度至少包括:
订单号、昵称、手机号、商品名称、交易单号、设备编号。 - □日期筛选只按“天”处理,不使用时分秒选择器。
- □设备筛选必须支持按照
设备编号和点位名称搜索。 - □移动端顶部快筛仅保留
订单状态、设备筛选、筛选3 个入口。 - □移动端点击
筛选后,不重复展示顶部快筛中已有的状态和设备筛选内容。 - □移动端的排序与状态选择应使用更易点击的选择面板,不使用难以操作的小型原生下拉。
- □移动端筛选面板底部必须始终显示操作按钮,确保“确认 / 应用筛选”随时可点。
- □页面汇总区需展示
共 X 条、总金额、成功金额。 - □移动端汇总区不得将每个金额项强制占满一整行。
- □实际操作桌面端和移动端筛选,确认能顺利完成筛选、清空和结果查看。
UF-003:在桌面端高密度浏览订单列表
入口截图
描述: 作为桌面端运营人员,我希望在一个信息密度高但阅读不费力的列表中浏览更多订单,这样我能更高效地处理异常和售后。
主流程:
- 用户在桌面端查看订单列表。
- 列表以表格方式展示关键字段。
- 用户横向浏览非固定列信息,右侧固定列始终可见。
- 用户快速判断订单状态、金额与可执行操作。
验收标准:
- □桌面端订单区使用高密度表格列表,而不是大卡片堆叠布局。
- □表格字段顺序为:
点位、商品、时间、设备、取货码、订单号、状态、金额、操作。 - □
订单号位于状态前,不作为固定列。 - □右侧固定列仅包括
状态、金额、操作。 - □右侧关键列在横向滚动时必须保持稳定,不得出现空白、透底、错位或明显分割感。
- □金额列下方不再重复显示支付状态。
- □操作列仅保留
退款和详情两个按钮,不显示返券。 - □不可退款订单的
退款按钮使用统一的禁用样式。 - □每页默认展示 20 笔订单。
- □订单状态为“处理中”等未完成状态时,取货码显示规则统一为
--。 - □已完成订单允许部分记录没有取货码,页面仍需稳定展示。
- □实际查看桌面端订单表格,确认固定列稳定、按钮样式统一、列表浏览顺畅。
UF-004:在移动端快速浏览订单并避免横向滚动
入口截图
描述: 作为移动端值班人员,我希望在手机上快速浏览订单卡片并执行核心操作,这样我无需放大或横向滚动页面。
主流程:
- 用户在移动端打开订单页。
- 顶部保留后台导航入口,可切换到设备、商品管理等页面。
- 用户通过快筛切换订单范围。
- 用户在订单流卡片中查看点位、首商品、金额、状态、时间等信息。
- 用户在卡片上直接点击
退款或详情。
验收标准:
- □移动端保留后台导航入口,支持返回其他后台页面。
- □页面顶部不重复展示导航标题和大号页面标题。
- □移动端订单以独立订单卡片展示,不直接沿用桌面表格的压缩样式。
- □订单卡片在常见大屏手机宽度下无需左右滑动即可完整阅读。
- □在较窄的手机屏幕上,卡片自动切换为更紧凑的单列布局。
- □卡片动作区使用双列等宽按钮布局,不因换行导致按钮尺寸不一致。
- □不可退款订单的移动端退款按钮与桌面端保持同一禁用样式。
- □移动端页面背景、字体、间距风格需与其他后台页面一致。
- □实际在手机页面中查看,确认没有横向滚动,按钮始终可见,弹层不会把页面撑宽。
UF-005:查看订单商品摘要与全部商品
入口截图
描述: 作为运营人员,我希望在列表中优先看到首个商品,同时能在需要时展开查看全部商品,这样我既能保证信息密度,也不会丢失完整商品信息。
主流程:
- 用户在订单列表中看到订单的首个商品摘要。
- 如果订单包含多个商品,页面展示
+N 件入口。 - 用户点击入口后,通过轻量弹层查看该订单的全部商品。
- 用户关闭弹层后继续留在原列表位置。
验收标准:
- □桌面端和移动端列表默认只展示首个商品摘要。
- □多商品订单必须展示
+N 件入口。 - □弹层只需展示
订单号和商品信息,不展示多余元信息。 - □同商品多份时,弹层内按数量展开为多行,便于逐份识别。
- □移动端商品弹层必须完整落在屏幕可视范围内,不能导致页面整体变宽。
- □实际点击查看全部商品,确认桌面端和移动端都能顺畅打开和关闭商品弹层。
UF-006:查看订单详情
入口截图
描述: 作为运营人员,我希望在不离开列表上下文的情况下查看订单详情,这样我可以快速核对信息并返回继续处理其他订单。
主流程:
- 用户在订单列表点击
详情。 - 桌面端从右侧打开详情抽屉。
- 移动端打开居中的详情弹窗。
- 用户查看基础信息、交易信息、商品信息。
- 用户关闭详情后回到原列表位置。
验收标准:
- □桌面端点击详情后,从右侧打开详情抽屉。
- □移动端点击详情后,使用弹窗查看详情,而不是侧边抽屉。
- □详情信息至少包含 3 个分组:
基础信息、交易信息、商品信息。 - □详情字段至少包含:
支付时间、订单编号、交易单号、用户昵称、手机号、设备编号、排队号、出杯口号、取杯码、订单状态、订单类型、支付方式、支付金额、优惠金额、商品名称。 - □查看详情不应导致页面跳转到新页面。
- □实际点击订单详情,确认桌面端抽屉和移动端弹窗都能正常打开、关闭并返回原列表。
UF-007:发起退款
入口截图
描述: 作为运营人员或客服,我希望直接在订单页发起退款,并清楚区分退款类型和退款金额来源,这样我可以更安全地完成售后处理。
主流程:
- 用户在可退款订单上点击
退款。 - 系统打开退款弹层,并预填当前订单的币种与可退款上限。
- 用户选择退款方式:
- 手动输入整单退款金额;或
- 勾选部分商品,按商品全额退款。
- 用户选择退款类型:
客诉退款或赠饮退款。 - 用户可填写退款原因。
- 系统实时计算预计退款金额。
- 用户提交退款申请。
验收标准:
- □只有支付成功的订单允许发起退款。
- □退款弹层必须支持两种退款入口:
整单手动金额退款和部分商品全额退款。 - □部分商品退款通过勾选商品实现,不允许逐行手工输入退款金额。
- □同一笔退款中,整单退款金额与商品退款金额必须互斥,不能同时生效。
- □商品退款按数量拆行,支持同商品多份逐份勾选。
- □退款类型必须支持
客诉退款、赠饮退款两种选项。 - □提交前必须校验退款类型是否合法、退款金额是否大于 0、是否超过订单实付金额。
- □退款原因为选填项,长度上限为 100 字。
- □提交退款时,退款信息中必须带上退款类型及接口识别所需的对应值。
- □退款提交流程应预留后续接入真实接口的能力。
- □提交成功后需给出包含订单号、退款类型、退款模式、退款金额的成功反馈。
- □实际操作退款,确认整单退款和商品退款不能同时选择,退款金额计算正确,提交时校验和结果提示正确。
UF-008:处理多币种订单
入口截图
描述: 作为运营人员,我希望订单金额、汇总金额和退款金额都按订单实际币种展示,这样我不会误判金额或币种。
主流程:
- 系统读取平台的默认币种设置,并识别每笔订单自身的币种。
- 用户在列表中查看订单金额时,金额按订单币种渲染。
- 用户筛选订单后,页面展示符合条件记录的
总金额和成功金额,并按币种聚合。 - 用户发起退款时,退款弹层金额标签和金额计算跟随订单币种。
验收标准:
- □系统支持至少
CNY、USD、EUR、HKD、JPY五种币种显示格式。 - □单笔订单金额展示必须遵循订单自身币种。
- □列表汇总金额必须支持按币种聚合展示,而不是混用单一币种。
- □退款弹层中的整单退款金额标题、可退款上限、预计退款金额都必须跟随订单币种。
- □提交退款时,退款信息中需包含订单币种信息。
- □实际查看不同币种订单,确认列表、汇总和退款弹层中的币种与金额显示保持一致。
4. 功能需求
- FR-1:系统必须提供统一的订单管理页面,覆盖指标、筛选、列表、详情、退款五类核心能力。
- FR-2:订单管理页面的核心价值是“查看当日销售动态 + 处理订单”,而不是单纯展示当天订单。
- FR-3:页面顶部必须展示 3 张动态指标卡:今日支付金额、今日完成订单、客单价。
- FR-4:页面不得展示取消率和近 1 小时趋势。
- FR-5:桌面端筛选区必须采用紧凑的两层结构,并默认收起扩展筛选项。
- FR-6:移动端筛选区必须采用顶部快筛与底部筛选面板结合的方式。
- FR-7:快筛层与完整筛选层之间不得重复展示同一筛选项。
- FR-8:系统必须支持按状态筛选订单。
- FR-9:系统必须支持按设备筛选订单。
- FR-10:设备筛选搜索必须同时支持设备编号和点位名称。
- FR-11:系统必须支持 6 个搜索维度:订单号、昵称、手机号、商品名称、交易单号、设备编号。
- FR-12:日期筛选必须按天处理,不支持时分秒级筛选。
- FR-13:桌面端和移动端都必须提供“应用筛选”和“清空筛选”能力。
- FR-14:系统必须展示筛选结果条数、总金额、成功金额。
- FR-15:桌面端订单列表必须采用高密度表格方案,优先保证信息密度和浏览效率。
- FR-16:桌面端表格列顺序必须固定为:点位、商品、时间、设备、取货码、订单号、状态、金额、操作。
- FR-17:桌面端固定列仅包括状态、金额、操作。
- FR-18:右侧关键列在横向滚动时必须保持连续、稳定,不出现空白、透底或错位问题。
- FR-19:桌面端操作列只保留退款和详情两个动作。
- FR-20:移动端订单列表必须采用独立的订单卡片方案,不能简单压缩桌面表格。
- FR-21:移动端页面在常见大屏手机宽度下不得依赖横向滚动完成核心阅读。
- FR-22:列表默认只展示首商品摘要,支持通过
+N 件查看全部商品。 - FR-23:全部商品查看层仅展示订单号和商品内容。
- FR-24:桌面端订单详情必须通过右侧抽屉展示。
- FR-25:移动端订单详情必须通过弹窗展示。
- FR-26:订单详情必须覆盖基础信息、交易信息、商品信息三组内容。
- FR-27:只有支付成功订单可发起退款。
- FR-28:退款流程必须支持整单手动金额退款与部分商品全额退款两种模式。
- FR-29:退款的两种金额模式必须互斥。
- FR-30:部分商品退款必须基于勾选商品行,而不是输入单行金额。
- FR-31:系统必须支持客诉退款和赠饮退款两种退款类型。
- FR-32:退款提交必须包含退款类型以及接口识别所需的对应值。
- FR-33:退款原因为选填,且长度需受控。
- FR-34:订单管理必须支持多币种金额展示。
- FR-35:列表汇总金额必须支持按币种聚合。
- FR-36:退款金额展示和退款提交信息必须跟随订单币种。
- FR-37:订单数据需支持统一测试数据、伪下单记录以及默认演示数据。
- FR-38:页面在没有外部订单数据时,必须至少提供 20 笔可浏览的默认订单数据。
- FR-39:订单取货码展示必须使用统一规则:未完成订单默认显示
--。 - FR-40:部分已完成订单允许没有取货码,页面不能因此报错或错位。
- FR-41:页面字体、背景、头部结构必须与其他后台页面保持统一风格。
- FR-42:移动端页面必须保留后台导航入口,支持跳转到设备、商品管理等页面。
- FR-43:顶部指标卡中的“今日”必须按用户当前浏览器本地日期计算。
- FR-44:订单列表中的订单时间仍按订单产生时的本地时间语义展示,不因指标卡统计口径调整而改变。