# Admin 海外仓样式核对记录 ## 范围与依据 本轮用户确认继续“海外仓”模块。范围以 `adminNavigation.ts` 的 `overseas-inventory` 分组为准,包含 10 个菜单、对应独立详情和实际调用的作业弹框。客户服务、海外业务、隐藏产品库和旧箱号页面不在范围内。 视觉采用 [Admin 高密度界面规范](Admin高密度界面规范.md),保留当前路由、字段、权限、服务端状态资格及操作承载方式。原型入口为 `悦/货代SAAS平台后台/prototype-src/modules/03-overseas-warehouse.html`;入库、出库、换标、托盘详情分别见 706、714、720、726 行,尾程列表/详情见 894/927 行,库存详情/流水见 974/1022 行。当前真实业务契约优先于历史原型占位。 ## 修改前逐操作矩阵 页面文件均相对 `apps/admin-web/src/modules/overseas-warehouse/`。原型未覆盖的新操作保留现有承载方式,不新增业务流程。 | 菜单/入口 | 操作及源码证据 | 当前承载与尺寸 | 本轮结论 | |---|---|---|---| | 尾程订单 | `LastMileOrdersView` 查询、导出、查看、更多;`LastMileOrderDetailView` | 独立详情;基本/货物/计划/费用/日志页签 | 纯文字行内按钮、彩色页签、连续信息表、同行返回 | | 尾程订单 | `transferOpen`、`inboundPlanOpen` | 转仓默认宽度、入库计划 720px 居中框 | 保留确认、候选、版本,接入弹框密度 | | 尾程订单 | `containerConvertOpen`、`containerDetailOpen`、`receivingWarehouseOpen` | 预览 1240px、柜详情 1120px、接柜仓 600px | 保留逐柜预览/阻断及当前隐藏入口,不恢复隐藏菜单 | | 尾程订单 | `holdOpen`、`manualNodesOpen` | 暂扣 620px、节点 700px | 保留原因、计费、节点原子提交,紧凑表单 | | 尾程订单 | `WarehouseTransferReviewDialog` | 转运审核 920px | 保留审核/驳回、货物与打托实测、按钮资格 | | 尾程详情 | `feeDialogOpen` | 新增费用 720px | 保留金额/币种/保存流程 | | 入库单 | `InboundOrdersView` 查看、编辑计划、预约;`InboundOrderDetailView` | 独立详情;预约 1080px;计划编辑默认框 | 保留只读费用空态、预约模式,统一按钮与描述表 | | 入库单 | `SmartDispatchDialog` | 1800px 三栏作业框;车型选择 360px | 保留拖拽、锁定、容量、超重与预排车;只压缩普通控件 | | 排车列表 | `DispatchesView` 查看、BOL、更多、取消;`DispatchDetailView` | 独立详情;PDF 原打印流程;取消确认框 | 保留返回目标、直接操作及危险确认 | | 排车列表 | `transferOpen`、`editOpen`、`removePallet` | 转派送 1120px;编辑 900px;移除确认框 | 保留费用/箱唛/托盘事实,描边行内操作 | | 出库单 | `OutboundsView` 新建、查看、取消;`OutboundDetailView` | 新建 1320px;独立详情;取消原因框 | 保留一件代发/退货两模式、选择表、PDA 提交 | | 派送单列表 | `DeliveryOrdersView` 查看、编辑状态、标记退货 | 独立详情;状态 520px;退货 720px | 保留原出库明细可退数量与去向;统一按钮 | | 派送详情 | `DeliveryOrderDetailView` 四页签 | 订单/SKU/费用/操作,内容在页签内 | 彩色页签且所有正文保持可见,去重复正文标题 | | 派送单资料 | `DeliveryDocumentsDialog` 上传、替换、删除、下载、保存、重新加载确认 | 1040px;关闭放弃未保存修改 | 保留文件生命周期,正文单一滚动区 | | 换标单 | `RelabelOrdersView` 新增、审核、查看 | 760px 表单;独立详情 | 保留创建与审核模式、状态候选与必填字段 | | 换标详情 | `RelabelOrderDetailView` 完工证据、总 PDF、明细 PDF 上传/预览 | 连续详情、预览 900px | 保留 PDF 物理预览尺寸与绑定数据,紧凑文件行 | | 托盘管理 | `PalletsView` 汇总、新增、编辑、查看;`PalletDetailView` | 760px 表单;独立详情 | 汇总改紧凑行;保留仓库编辑限制 | | 库存管理 | `InventoryView` 汇总、查看、导出;`InventoryDetailView` | 独立详情,库位/托盘箱号/流水表 | 连续汇总、信息表;不改变库存口径 | | 库存流水 | `InventoryTransactionsView` 导出、返回、关联数据 | 列表深链;共享关联框 1060px | 只为本轮调用显式接入共享框,保留分区域只读权限 | | 退货库存管理 | `ReturnInventoryManagementView mode=inventory` | 库存/流水页签、查询、分页 | 两页签保留各自数据和查询模式 | | 退货箱号管理 | `ReturnInventoryManagementView mode=cartons` 查看、箱唛打印 | 详情 1080px;现有 HTML 打印 | 统一详情按钮/信息表,不修改打印内容或尺寸 | ## 共享边界和验收 - `OverseasDetailShell`、`OverseasReadOnlyDetail`、`InboundCodeRelationshipDialog` 显式 `dense` 接入;默认调用保持原样。 - 公共字号、间距、按钮、页签和键值表只使用公共密度变量与类;模块仅保留业务布局与作业区尺寸。 - 最终全量 `pnpm test --maxWorkers=4`:1,927 项通过;`pnpm typecheck`、`pnpm build` 通过;索引合同 1,050 项通过。新增合同核对 10 个导航入口、两种退货模式、详情祖先样式、Teleport 接入和共享组件关闭状态。 - 尾程与派送详情的 `density-contained-tabs` 保留所有页签正文;智能排车将原操作按钮移入固定 footer 插槽,保留预排车事件与原三栏作业区。 - 页面事件、请求和状态门禁保持原有业务逻辑;本轮没有部署或修改环境数据。复核修正托盘标题的内部 ID 回退,出库仓库名称仅采用同仓关联派送返回的名称;缺失或关联不一致时显示“—”。托盘 DTO 目前未返回库位编码,详情保留空值,不展示 `locationId`。 - 托盘汇总移除与页面 `gap` 叠加的底部间距;删除已被公共按钮组接管的局部间距及空样式规则。 - 默认高并发全量回归出现分散用例的偶发失败;失败项定向复跑通过,随后在不修改断言或超时的情况下限制为 4 并发,全量通过。托盘加载/失败时不展示内部 ID、出库仓库名称匹配/缺失/不一致均有组件回归证据。 - 本地 5173 端口的 Vite 服务进程指向当前 `chongchong-global/apps/admin-web` 工作区;这只证明服务路径,不代替页面视觉证据。 - 全部 10 个菜单及详情/弹框均 **待人工截图确认**,验收为 1920×1080、浏览器缩放 100%。 ## 用户截图复核修正 用户提供尾程详情与国内订单详情截图后,确认上一轮仅接入密度变量不足以达到样板一致:尾程存在重复页头标签、缺少业务摘要、自定义绿色状态边框、页签首项贴边且选中底色缺失、基本信息被两个标题拆断。截图证据为本轮附件 f76bcf5f(尾程)与 151a1d06(国内样板)。 | 操作 | 样板及现状 | 本次修正 | |---|---|---| | 尾程详情页头 | 国内为返回列表、业务编号、状态;尾程额外展示页面标题和编号标签 | 共用页头排版,仅保留业务编号;复制功能缩为轻量图标 | | 状态 | 国内使用带圆点的 StatusBadge;尾程将全部已接入状态画成绿色 | 使用同一状态徽标,待分配按待办语义展示 | | 概览 | 国内摘要位于标题和页签之间;尾程没有 | 展示客户、海外仓、箱数、托数、体积和最近更新,均取当前订单事实 | | 页签 | 原生与 Element 两套样式存在实际差异 | 共用选中底色、字号、内边距、下划线,保留 Element 键盘切换及五页签正文 | | 基本信息 | 国内连续键值表;尾程两个标题与两个表 | 保留全部字段顺序,合并为连续表;长备注按两组字段宽度展示 | 上述截图证明原版本存在差异,不作为修正后视觉通过的证据。 - 按本轮补充要求复核操作按钮:尾程订单、排车按当前行权限和状态统计实际显示操作,3 个及以下全部直显,超过 3 个才出现“更多”;直接操作优先保留查看、编辑/计划、打印。其余海外仓菜单操作列最多 3 个,继续直接显示。 ### 本次截图修正的验证结果 - 新增尾程详情组件回归:单一业务标题、待分配状态语义、紧凑复制、实际摘要(含零箱数)、19 个基本字段、长备注、返回路由与 5 个页签可达。 - 新增尾程/排车权限组合回归:1—3 个操作直接显示,4—5 个操作才显示“更多”,并保留高频操作。公共样式合同校验国内原生与海外 Element 页签共用同一组外观规则。 - 全量执行 251 个测试文件、1,940 项:1,938 项首轮通过;另两项是旧的 230px 列宽及单一标题类名断言,按新规则更新后,其所属两个测试文件定向复跑全部通过。类型检查、生产构建及差异空白检查通过。 - 修正后仍待人工页面截图核对;本次代码与组件验证不作为浏览器视觉验收通过的依据。 ### 折叠按钮文字修正 - 用户截图 f21098e6 确认折叠入口只展示省略号图标。尾程订单、排车列表移除可见“更多”文字,保留悬停提示和无障碍名称;超过 3 个操作才折叠的判断保持不变。 - 本次折叠按钮修正:全量 1,940 项测试、类型检查与生产构建通过。 ### 新建出库单搜索、批量选择与分页(2026-09-15) 依据用户截图 `codex-clipboard-6a1295e8-ae69-44de-86bd-a0dd22446396.png`,仅调整 `OutboundsView` 的新建弹窗: | 操作 | 截图现状 | 修正 | |---|---|---| | 仓库选择 | 下拉框的搜索能力不明显 | 保留可搜索下拉,提示输入名称/编码;选项同时展示名称与编码,可清空重选 | | 订单搜索 | 已有关键词查询 | 保留订单号、入库单号、客户、托盘号、SKU、品名查询,增加搜索图标和无障碍名称;输入后查询或回车生效 | | 批量选择 | 只有逐行复选框 | 表头全选本页;取消本页仅影响本页,翻页保留选择。按用户后续截图要求移除独立“全选筛选结果/清空选择”按钮行,已选总数并入分页左侧 | | 客户/仓库限制 | 提示仅提及同一仓库,但接口还要求单一客户 | 保留同一客户、同一仓库提交限制;跨客户勾选后明确提示,用户可取消勾选并按客户查询 | | 分页 | 每页条数文字不可见;内容过长时分页靠近弹窗底部 | 收窄表单全宽选择器范围,分页条数下拉固定 128px;增加每页 50 条、当前/总页数、跳页;条数变化回到第一页 | | 长列表 | 增加每页条数会拉长整个弹窗 | 候选表格内部滚动,最大高度 360px;分页可换行,退货分支的分页条数宽度同步修正 | 后续截图 `codex-clipboard-1adadeb3-9d55-4c41-81c1-d6dafba87293.png` 确认搜索与批量按钮占行过多:海外仓搜索(280px)和一件代发订单搜索及查询/重置(640px)同排,移除独立批量按钮行,已选数并入分页左侧。普通说明收为单行文字,跨客户警告仍保留,备注默认一行并按输入自动增高至三行。 已增加真实组件回归覆盖分页选择、筛选后跨页勾选、半选状态、每页条数切换、仓库变更清空选择、提交明细数量以及多客户提交门禁。仅使用测试 Mock 验证提交,无真实出库单创建或 PDA 推送。修正后视觉仍待 1920×1080、100% 截图确认。