订单中心 / 发货订单
AAdmin

发货订单

待发货 备货中 已发货 已完成 已取消 全部
展开筛选
我的赏袋 积分商品
已选 0 条订单
产品信息 发货明细 收货信息
0 条 · 1 每页 跳至
📋 说明面板 / 开发交付文档

📌 功能概述

发货订单管理页(v8.82):后台订单管理。自定义日期选择器修复两处:面板移到 body 层(原在隐藏的高级筛选容器内弹不出)、CSS 花括号结构修复(原误插进 .fin 内部导致面板全宽);实测 260px 面板正常弹出/选日期/筛选。订单按来源拆分「我的赏袋 / 积分商城」两个视图,按状态浏览(待发货默认,全部在最后);多条件筛选(订单/商品/手机号/产品ID/货号/IP系列/产品种类/日期,自定义日期选择器);订单卡片展示;「发货处理」弹窗完成货品勾选、合并订单、包裹拆分、库存校验与发货确认全流程;mock 数据含神秘礼物订单(只显示名称,无卡位类型/库存)。v8.88 更新(2026-08-10):积分商城**限购商品新增发货顺序**——每个品按下单时间独立自增分配发货顺序号(每品各自从 1 开始,互不干涉);同单同品多件共用一个号;下单即锁定,取消订单**空号不补**;号终身绑定订单,**全状态显示**(含已取消);非限购商品订单不显示。主列表「发货顺序」列(限购品显示号、非限购留空),表头可点击按号**升/降序排序**(简单按号排,不同品的号混排,无号的非限购订单固定排最后);号仅展示参考,后台仍可自由选单发货。v8.89 更新(2026-08-10):① 去掉订单卡片头部「积分商品」来源徽标(已切在积分商品 Tab 内,冗余);② 积分商城**无购物车,一个订单只有一个商品**——手写 mock 与批量演示生成器(buildMockOrders)的积分商品订单全部改为单货品(同单同品多件 = qty 多件共用一号),赏袋订单保持多货品。v8.90 更新(2026-08-10):我的赏袋发货处理弹窗新增**同货品多件拆分包裹**——同一货品待发数量 ≥2 且未分配时,操作列出现「拆分」按钮;弹窗默认均分 2 份(3→2+1)、每份数量可手调、份数可增删(≥2 份);校验每份 ≥1、合计 = 待发总数;拆成多行后各行独立分配包裹、独立填发货数量,可分别进不同包裹出多个物流;已分配行先取消分配才能拆;已发货部分不参与拆分;弹窗 mock 赏品数量改为 1-5 件演示拆分。v8.91 更新(2026-08-10):① 拆分按钮从操作列移到「发货/待发」列待发数字(/N)右侧,与数量挨着更直观;② 积分商城订单点「发货」不再打开发货处理弹窗,toast 提示「积分商城发货流程开发中,暂不支持」——积分商城发货流程(先拆包裹再选品)后续单独做。v8.92 更新(2026-08-10):① 拆分按钮对齐优化——无拆分按钮的行放同宽隐藏占位,所有行「发货/待发」数字与按钮位置完全一致;② 拆分弹窗添加/删除份数时自动重新均分(总数 ÷ 份数,余数逐份 +1,如 74 拆 3 份 = 25+25+24),份数最多 = 待发总数,用户只需微调个别份。v8.93 更新(2026-08-10):「发货/待发」列数量组件改版(方案 E)——原窄输入框(40px)+ 竖排小箭头(18px×14px)换成横排 −/+ 大按钮步进器(30px×32px、胶囊圆角),输入框加宽至 60px、整体高 32px,点击面积更大、更舒展,眼神不好的同事也好操作。v8.94 更新(2026-08-10):「发货/待发」列对齐修正——待发数字(/N)固定 40px 宽度,不同位数(/1、/74、/100)不再导致每行组件总宽不同,拆分按钮/占位位置全行对齐。v8.95 更新(2026-08-10):拆分按钮三态化——待发数 ≥2 的行按钮不再直接消失:已分配进包裹的行置灰(点击提示「该货品已分配至包裹,请先取消分配」)、库存为 0 的行置灰(点击提示「库存为0,无法拆分」);仅待发数 <2 的行用隐藏占位(用户看数量即懂)。v8.96 更新(2026-08-10):① 删除「卡位类型」列——商品名称已含卡位类型(如 CUP丨潮音焕场丨亲签限编卡),列冗余;「全部卡位类型」筛选下拉保留;② 弹窗点击蒙版关闭——发货处理弹窗点遮罩关闭、拆分/取消订单/备注弹窗点背景关闭。v8.97 更新(2026-08-10):收件信息区改版——「下单人用户ID」改名为「下单人ID」并独立成区块(白色卡片)放在收件信息左侧,与收件信息区分;收件信息内去掉重复的「下单人 手机号」,只保留 收件人 | 手机 | 地址。v8.98 更新(2026-08-10):发货处理弹窗商品分配 list 按表格布局规范重做(t-flex 水平分布,样板:销卡记录)——表格宽度 100% 填满容器;表头/数据行 flex 布局 space-between,剩余空间均匀分配到列间;列宽 = max(表头宽,数据宽) 偶数化 + 8px 防截断余量(applyFlexCols,商品名称列上限 240px 省略);表头吸顶不滚动;库存/发货待发列居中、操作列右对齐贴右 16px(表头「操作」文字左缘对齐按钮左缘 JS 校准);td 行高 1.6 统一;排序、勾选、步进器、拆分按钮交互全部保留。v8.99 更新(2026-08-10):表格布局规范新增一条并应用——有复选框的表格,勾选列不单独占位,checkbox 与第一个字段(商品名称)保持正常间距(10px)后整体算作一个字段参与列宽分布;表格从 8 列变为 7 列(勾选并入名称列),全选框/行勾选/排序/交互不受影响。v8.100 更新(2026-08-10):两处对齐修正——① 表头全选框与「商品名称」间距修复(原被 `#headerCheck` 的 margin:0 高特异性覆盖,间距为 0,补高特异性规则恢复 10px);② 操作列表头文字左缘对齐「取消」按钮左缘(原校准误匹配数量列拆分占位按钮 + scrollWidth 受列宽干扰,改为限定操作列内找按钮 + Range 测文字宽 + paddingRight 方案)。

🧱 页面结构

模块说明
状态 Tab待发货(默认)/备货中/已发货/已完成/已取消/全部(全部放最后)
来源视图我的赏袋(卡牌+赏品)、积分商城(单商品:单价×数量、订单总额、发货顺序列(v8.88),支持取消订单;无购物车一单一商品(v8.89))
筛选区订单编号/商品标题/手机号/收货人/产品ID/货号/IP系列 + 高级筛选(物流单号/货品发货状态/退货/换货/补偿积分/日期)
订单列表订单卡片:产品信息、发货明细进度条(发货数/总数)、收货信息;仅列表区滚动、分页吸底;积分商品 Tab「发货顺序」表头可点击按号升/降序排序(v8.88)
发货处理弹窗左:订单详情(分组勾选/折叠、合并订单);右:收件信息、发货方式(打单/自行寄件)、合并订单、包裹拆分、货品分配表格(分页吸底、每页 10/20/30/50/80/100/200/500);同货品多件可拆分行(v8.90)

🔍 查询域

主列表筛选
字段类型说明
订单编号文本框模糊匹配,默认为空=全部
商品标题文本框模糊匹配,默认为空=全部
手机号文本框下单人手机号模糊匹配
收货人手机号文本框模糊匹配
收货人姓名文本框模糊匹配
产品 ID文本框模糊匹配(货号或产品名)
商品货号文本框模糊匹配
IP系列下拉单选默认为空=全部;选项:希腊神话/盗墓笔记/红楼梦/道诡异仙/安徒生童话/神秘礼物
产品种类下拉单选默认为空=全部;选项:卡牌/赏品/神秘礼物
物流单号文本框(高级)模糊匹配
货品发货状态下拉(高级)选项:已发货/未发货(按订单内全部/部分货品发货情况过滤)
退货下拉(高级)选项:有/无
换货下拉(高级)选项:有/无
补偿积分下拉(高级)选项:有/无
下单日期日期选择器(高级)下单开始 ~ 结束日期范围,点击弹出日期选择
发货处理弹窗 · 分配表格筛选
字段类型说明
全部订单下拉单选按订单筛选货品(订单号+件数)
全部IP下拉单选按 IP 筛选
全部卡位类型下拉单选按卡位类型筛选(亲签限编卡/限编卡/普卡等)
全部类型下拉单选选项:卡牌/赏品/礼物

📋 功能说明(需求)

我的赏袋

将用户当前赏品和卡牌按产品抽象归类;产品信息展示:产品名称 / IP / 系列 / 货号 / 产品类型;列表展示每个产品的卡牌和赏品的发货数量及总数量;进度条下方展示未发货数量;数据展示 UI 与原型保持一致。

货品退回

将用户未发货的产品退回用户赏袋。点击货品退回弹出弹窗:查询(产品ID/产品名称文本框支持模糊、默认为空=全部;IP系列同之前;产品种类下拉单选=卡牌/赏品;卡位类型下拉复选);列表仅显示订单内未发货的产品(同原型);退回数量默认 disable、勾选对应产品后 enable;退回说明文本域 200 字符;上传凭证图片 200k、9 张。校验:退回数量=0 → 提示「退回货品数量不能为0」;退回数量>实际未发货数量 → 提示「退回货品数量不能大于未发货数量」。通过 → 系统提示「货品退回成功!」并生成退回记录。

货品置换

同产品下的货品可根据库存或用户诉求进行置换。点击货品置换弹出弹窗:查询同退回;列表支持复选,未选择置换货品点【货品置换】→ 提示「请先选择需要置换的货品」;选择货品后点按钮弹出「选择置换产品」弹窗:左侧置换产品默认不勾选,未勾选点【选择置换产品】→ 提示「请先选择需要置换的货品」;勾选后只能选择同产品下的卡牌或赏品;置换数量默认 1,后面为需要置换的产品总数量;列表支持按产品ID/名称筛选、按卡牌/赏品类型筛选;数字为当前产品的售后库存;仅显示有库存的产品;已选择过的产品再次点击不再显示;点【+】提交置换后的货品并填写数量,已分配数量不能>置换数量需校验;提交成功后货品置换产品列表更新(刨除已置换的产品)并生成置换明细;取消置换恢复置换前的产品列表;提交后生成置换记录。货品置换或退回弹窗打开时,订单无法发货和备货:点备货提示「订单货品退回或置换中,无法备货」;点发货提示「订单货品退回或置换中,无法发货」。

积分商城

列表字段增加单价和订单金额;待发货的积分商城订单支持取消订单:弹出二次弹窗,填写取消原因并上传凭证;取消后积分退回、库存、销量重置。积分商城无购物车,一个订单只有一个商品(单货品,数量可多件)。(v8.89)

发货库存联动

已发货的货品自动扣除库存,并生成售后出库记录;发货优化显示产品售后库存(实时库存);库存=0 的货品发货时无法在下拉选中(禁止发货),提交时获取提交时的实时库存。

包裹拆分优化(打单发货)

订单信息展示不变,增加合并订单:勾选后的订单以「订单号+总货品数量」组成订单 tab,支持删除订单;删除订单弹出二次确认弹窗「确认删除订单?删除后包裹内的订单商品也将删除,是否继续」;删除后取消订单及订单内商品勾选,并删除列表页内商品及包裹归属。库存=0 商品在左侧订单及右侧商品列表不能勾选(勾选框 disable)。包裹拆分:包裹内商品发货数量≠0(为0提交不过 → 提示「【包裹1】内存在发货数为0的商品!」);不能有空包裹(未分配商品的包裹存在则提交不过 → 提示「有空包裹【包裹2】」);补齐发货数:点击补齐勾选商品,待发货数>库存 → 数量=最大库存数,待发货数≤库存 → 数量=待发货数。

自行寄件发货

根据包裹填写物流公司以及物流单号。

订单备货导出表格

导出表格增加库存(未发货字段右侧增加库存,库存=导出时实时库存)。

发货明细

点击订单发货数据明细(进度条)弹出发货明细弹窗:根据产品进行 tab 划分,tab 文字=产品名称;产品ID 点击查看产品图鉴;产品名称 20 个字符超过省略;库存(实时)颜色说明——红色=库存0、橘色=库存≤未发货数量、绿色=库存>未发货数量。

积分商品发货顺序(v8.88)

限购商品用户下单后每个品按下单时间独立自增分配发货顺序号(每品各自从 1 开始,互不干涉);同单同品多件共用一个号;下单即锁定,取消订单空号不补、后面不前移;号终身绑定订单,所有状态(待发货/备货中/已发货/已完成/已取消)都显示;非限购商品订单不显示。主列表「发货顺序」列展示,表头点击按号升/降序排序(简单按号排),号仅作展示参考,后台仍可自由选择任意订单发货。

订单详情优化

货品信息:积分商城和我的赏袋布局优化(见原型);积分商城已取消订单详情增加取消信息;已发货订单获取签收信息后 7 天后自动签收(待定)。

🖱️ 交互行为(页面现状)

操作页面行为
状态/来源 Tab点击切换列表数据(状态:待发货默认;来源:我的赏袋/积分商城)
订单分组勾选勾选组标题复选框 → 整组货品勾选/取消;勾选单个货品 → 标题「已选 N」与半选态同步;点标题折叠/展开,折叠状态重渲染保留
合并订单默认只显示当前订单 chip;勾选订单组 → 该订单 chip 加入(订单号+件数),取消勾选 → chip 移除;统计(笔数/件数/剩余未分配)联动
分配至包裹勾选货品 → 点分配按钮 → 货品进包裹并自动填发货数量(待发≤库存按待发,否则按库存);库存 0 货品被过滤并提示;分配后列表不自动切换
包裹 tab点击包裹名筛选该包裹货品;下拉菜单:填满本包裹/清空本包裹/取消全部分配/删除包裹;包裹计数=实际发货量实时联动
批量按钮有勾选才可点:填充可发货数量/清空数量/取消分配;无勾选置灰
发货数量输入未分配货品也可手动填写;横排 −/+ 步进按钮加减(v8.93 方案 E 大按钮);改动后包裹计数/底部合计/确认按钮同步
拆分数量(v8.90)待发数 ≥2 且未分配的行,待发数字(/N)右侧显示「拆分」(v8.91 起;无按钮行同宽占位对齐,v8.92);已分配包裹/库存 0 的行按钮置灰,点击 toast 提示原因(v8.95 三态);弹窗默认均分 2 份(3→2+1),可手调每份数量;添加/删除份数自动重新均分(≥2 份、≤待发总数);每份 ≥1、合计 = 待发总数才可确认;拆分后各行独立填数量、独立分配包裹(可进不同包裹)
每页条数分页栏选择 10/20/30/50/80/100/200/500 条,切换后重排分页
确认发货校验空包裹、包裹内发货数为 0、库存不足;库存不足弹窗列出货品(待发/库存),可「移除库存不足商品」或「仍然发货」;成功 toast 后自动关闭弹窗
自行寄件切换「自行寄件发货」→ 按包裹填写物流公司/物流单号,缺失时拦截提示
取消订单(积分商城)待发货积分订单点取消 → 二次弹窗填原因+上传凭证 → 确认后订单状态变已取消
发货顺序排序(积分商城)点击「发货顺序」表头 → 按号升/降序排列(简单按号排,不同品号混排);再点切换方向;无号的非限购订单固定排最后;排序不限制发货选择(号仅展示参考)
备注订单备注弹窗:历史备注回显 + 文本域多次追加保存

📐 数据口径

指标口径(业务)
待发货数量订单内货品尚未发货的总数(mock 1-100)
已发货数量货品已发出数量(发货明细进度条 = 已发/总数)
未发货数量待发货数量 - 已发货数量
库存三态:缺货(0,红色)/ 不足(小于待发货数量,橙色)/ 充足(≥待发货数量)
可发货数量待发货数≤库存取待发货数,待发货数>库存取库存数(取小)
可拆数量(v8.90)行内待发数(数量-已发数)≥2 才可拆分;拆分后各行待发数之和 = 原待发数;已发货部分留在订单卡片进度条,不参与拆分
包裹发货数包裹内货品实际填写发货数量合计
合并订单统计勾选订单的笔数、货品件数、剩余未分配(跟随勾选实时联动)
发货顺序号(v8.88)限购商品每个品独立从 1 自增(按下单时间排序);同单同品多件共用一个号;下单即锁定、取消空号不补;非限购商品无号

❌ 错误提示清单

页面按钮/操作场景提示
列表页订单备货点击(原型示意)订单备货(原型示意)
列表页导出订单/导出记录/退回记录/置换记录点击(原型示意)xx(原型示意)
列表页取消订单 - 确认取消未填写取消原因请填写取消原因
发货处理弹窗分配至(快捷分配)未勾选任何商品请先勾选商品
发货处理弹窗拆分数量某份数量小于 1(输入 0 自动变 1)第 N 份数量不能为 0
发货处理弹窗拆分数量各份数量合计 ≠ 待发总数拆分数量合计需等于待发总数 X 件(当前合计 Y)
发货处理弹窗拆分数量已分配进包裹的行点「拆分」(按钮置灰,v8.95)该货品已分配至包裹,请先取消分配
发货处理弹窗拆分数量库存为 0 的行点「拆分」(按钮置灰,v8.95)库存为0,无法拆分
发货处理弹窗拆分数量份数超过待发总数(每份至少 1 件)最多可拆 N 份(每份至少 1 件)
订单列表发货(积分商城 Tab)积分商城订单点「发货」toast:积分商城发货流程开发中,暂不支持(不弹发货处理弹窗)
发货处理弹窗分配至(快捷分配)勾选的商品库存全部为 0所选商品库存为0,无法分配
发货处理弹窗分配至(快捷分配)部分勾选商品库存为 0已将 N 件分配至包裹X(M 件库存为0已过滤)
发货处理弹窗归属包裹下拉选择库存为 0 商品的包裹库存为0,无法分配
发货处理弹窗填充可发货数量未勾选商品请先勾选商品
发货处理弹窗清空数量未勾选商品请先勾选商品
发货处理弹窗取消分配未勾选商品请先勾选商品
发货处理弹窗确认发货(自行寄件)有货品的包裹未填物流公司或物流单号请填写 XX 的物流公司和单号
发货处理弹窗确认发货存在未分配商品的空包裹有 N 个空包裹(XX),请先删除或分配商品
发货处理弹窗确认发货包裹内存在发货数量为 0 的商品XX 中有 N 件商品发货数量为0,请填写
发货处理弹窗确认发货存在待发数大于库存的货品弹窗「以下商品库存不足」(共 N 件),逐条列包裹·货品·待发/库存,可选「移除库存不足商品」或「仍然发货」

🔲 状态说明

状态处理
默认来源=我的赏袋、状态=待发货;弹窗默认勾选当前订单,关联订单收起
空数据筛选无结果显示 0 条
缺货/不足库存列红色「缺货」/橙色「不足」;库存 0 货品分配被过滤
禁用态批量按钮无勾选置灰;弹窗打开时背景页面不可滚动
错误提示toast 提示:请先勾选商品/库存为0无法分配/存在空包裹/包裹内发货数为0等

取消订单

取消原因*
请填写取消原因
凭证图片(选填)
📷
点击上传凭证图片
已上传凭证移除

订单备注

添加备注

拆分发货数量

待发总数 0
+ 添加一份 已分配 0 / 0 件
拆分后各行独立分配包裹、独立填写发货数量(原行发货数量需重新填写);已发货部分不参与拆分。

发货处理 v3.4

订单详情
下单人ID 收件信息||
发货方式 | 寄件人 | 物流公司
合并订单
包裹拆分
+ 新建包裹
分配至:
商品名称 类型 库存 发货/待发 来源订单 归属包裹 操作