web-h5-differences.md 6.1 KB

Web 端(art-design-pro)与 H5 端(mobile-h5)功能差异分析

基于当前代码逐项对比,仅列出存在差异的项,便于后续对齐或确认产品取舍。


一、计划管理(Plans)

差异项 Web 端 H5 端 说明
列表日期筛选 有「日期范围选择器」+ 快捷芯片(全部/今日/明日/昨日/本周);请求时同时支持 dateRange(映射为 startDateFrom/startDateTo)和快捷筛选(createdFrom/createdTo) 仅有快捷芯片,无日期范围选择器;请求只用 createdFrom/createdTo H5 缺少按「计划开始/结束日期」的自定义区间筛选
计划列表 API 参数类型 planApi.list 的 params 类型包含 startDateFrom、startDateTo planApi.list 的 params 类型只有 createdFrom、createdTo,无 startDateFrom/startDateTo 若 H5 要支持按计划日期区间筛选,需在类型和请求里加上这两项
计划表单字段 formData 中有 specification、vehicleNo,并在导出等逻辑中使用 计划详情页表单仅有:计划号、业务类型、往来单位、产品、开始/结束时间、计划量、备注;无规格(specification)、车牌号(vehicleNo) 若产品需要计划维度的规格/车牌,H5 需在计划详情表单和 PlanCreate/PlanUpdate 中补齐
计划列表返回 计划列表页无「返回」按钮(作为主导航页) 有返回按钮 → 回到 /dashboard 属交互差异,可按产品保留

二、出入库管理(Inventory)

差异项 Web 端 H5 端 说明
列表日期筛选 有「日期范围选择器」+ 搜索 + 快捷芯片(全部/今日/明日/昨日/本周) 仅有搜索 + 快捷芯片,无日期范围选择器 H5 无法按自定义日期区间筛出入库列表
「复制URL链接」展示条件 仅当 row.status === '待三方填写' 时显示该按钮 每条记录都显示「复制URL链接」按钮 若需与 Web 一致,H5 应改为仅当 item.status === '待三方填写' 时显示
填写页(三方填写) 无此页面(填写链接指向 H5) 有 /inventory/fill/:id,免登可填,提交前 ensureVehicleExists 设计上由 H5 承载填写页,无需在 Web 复制

三、地磅单(Weighing)

差异项 Web 端 H5 端 说明
列表日期筛选 有「时间范围选择器」+ 搜索 + 快捷芯片(全部/今日/明日/昨日/本周) 仅有搜索 + 快捷芯片,无时间/日期范围选择器 H5 无法按自定义时间区间筛地磅单列表

四、基础资料(Master Data)

差异项 Web 端 H5 端 说明
新增入口 每个 Tab(往来单位/车牌号/货物)各自有「新增」按钮,弹窗内新增/编辑 共用一个浮动按钮(FAB),根据当前 Tab 跳转到对应详情页(如 /master-data/company/detail)新增 交互不同:Web 弹窗 vs H5 独立详情页,功能等价
详情/编辑 弹窗内编辑 独立页面(如 /master-data/company/detail/:id?mode=edit) 同上,属 UI 形态差异
API companyApi/cargoApi/vehicleApi 无 get(id) 三者均有 get(id),供详情页加载单条 H5 因使用详情页而需要 get;Web 弹窗用列表数据即可,无功能冲突

五、API 与类型

差异项 Web 端 H5 端 说明
plansApi.list 参数 类型含 createdFrom/createdTo、startDateFrom/startDateTo 等 类型仅含 createdFrom/createdTo 若 H5 要做「按计划日期区间」筛选,需在类型与请求中增加 startDateFrom/startDateTo
masterDataApi 无 companyApi.get/cargoApi.get/vehicleApi.get 有 get(id) 因 H5 详情页需要,属合理差异

六、已对齐或无需对齐的部分

  • 计划「生成链接交三方填写」:两端均为每次点击调 createLinkForPlan 并复制新链接。
  • 跳转出入库与返回:from=plan(及 H5 兼容 from=plans)时返回 /plans,行为一致。
  • 出入库表单:数量默认 32、车牌号选择/手动输入、提交前 ensureVehicleExists、H5 数量默认值红色提示,已对齐。
  • 填写页(H5):仅 H5 存在,与产品设计一致。
  • 明日/今日/昨日/本周快捷筛选:计划、出入库、地磅单列表在两端均已支持。

七、建议对齐的差异(按优先级)

  1. 出入库列表「复制URL链接」

    • 若产品要求与 Web 一致:H5 改为仅当 item.status === '待三方填写' 时显示「复制URL链接」按钮。
  2. 计划/出入库/地磅单列表「日期范围」

    • 若需要在 H5 上按自定义日期区间筛选:在对应列表页增加日期范围选择器,并在请求中传入 dateFrom/dateTo 或 startDateFrom/startDateTo(计划用后者时需同步 plansApi 类型)。
  3. 计划表单字段

    • 若产品需要在计划中维护「规格」「车牌号」:在 H5 计划详情页表单与接口类型中增加 specification、vehicleNo,并与后端一致。
  4. plansApi.list 类型

    • 若 H5 实现「按计划日期区间」筛选:在 plansApi.ts 的 list 的 params 类型中增加 startDateFrom?、startDateTo?。

八、差异汇总表(仅差异)

模块 差异简述
计划管理 Web 有日期范围筛选与 startDateFrom/To;计划 formData 有 specification、vehicleNo(H5 表单无);plansApi 类型 Web 多 startDateFrom/To
出入库管理 Web 有日期范围筛选;Web 仅「待三方填写」显示复制链接,H5 全部显示
地磅单 Web 有时间/日期范围筛选,H5 无
基础资料 新增/编辑:Web 弹窗 vs H5 详情页;H5 多 get(id)
导航 计划列表:H5 有返回 dashboard,Web 无返回(主站差异,可保留)

如需对某一条做具体改法(例如只改「复制URL链接」条件),可以指定条目我按该方案改代码。