统一海外仓新增页样式与字段校验

AGENTS.md

@@ -73,11 +73,12 @@
 
 ## UI 与交互
 
+- 后续客户端新增、新建、下单操作统一执行 [Client 界面样式规范](../../docs/Client界面样式规范.md) 的“新增页面”章节，作为当前通用外观依据；列表按同文列表条款。只读取本轮适用章节，不因规范更新批量改造其他操作或公共外框。
 - 视觉还原、布局/交互承载方式变更或真实页面验收时读取 `../../docs/Admin-Client前端原型还原验收规则.md`，只为受影响操作形成原型核对矩阵；纯文案、逻辑或测试修改不自动读取。自动检查与人工视觉验收分开报告，无视觉变化时标记“无需视觉验收”。
-- 已向客户讲解或确认过的产品原型是页面视觉与布局实现的直接事实来源。字段顺序、字段分组、字段摆放、列宽、控件宽高、对齐方式、换行方式、区块层级、上下左右边距、内边距、间隙、留白、圆角、边框、阴影、背景色、文字颜色和字号均必须按原型还原，不得只参考大致风格后自行重新排版。
+- 已向客户讲解或确认过的产品原型是页面字段、分组、摆放及承载方式的直接依据；新增页的通用外观以当前 Client 样式规范明确替代的条款为准。未被替代的列宽、控件宽高、对齐方式、换行方式、区块层级、边距、圆角、边框、阴影、背景色、文字颜色和字号仍按原型还原，不得只参考大致风格后自行重新排版。
 - 原型中的按钮位置、顺序、尺寸、圆角、边框、背景色、文字色、图标、悬停态、激活态、禁用态和危险语义必须直接按原型实现；不得擅自改为文字链接、不同颜色、不同按钮类型、折叠菜单或自创交互效果，也不得增加原型没有的上浮、缩放、渐变线、装饰图标或其他视觉元素。
 - 原型已经给出明确图标、字符图标、图片资源或按钮内图标时，直接使用原型中的同一方案和资源，不得以 Lucide、Element Plus 默认图标、手绘图标或个人偏好替换。仅当原型没有定义对应图标时，才按本节的默认图标语义补齐。
-- 上述原型还原规则优先于本文件中“延续现有视觉体系”、默认组件样式和默认图标库等一般性规则。只有用户当前明确要求、阶段范围、真实字段长度、响应式、可访问性或接口事实与原型冲突时才允许做最小调整，并须在修改前说明具体差异、原因和影响范围；不得以技术实现方便为由偏离原型。
+- 当前 Client 样式规范明确替代的外观及上述原型还原规则，优先于本文件中“延续现有视觉体系”、默认组件样式和默认图标库等一般性规则。后续用户明确确认的例外优先；阶段范围、真实字段长度、响应式、可访问性或接口事实与原型冲突时只做最小调整，并须在修改前说明具体差异、原因和影响范围，不得以技术实现方便为由偏离。
 - 详情、新增、编辑、审核等操作采用独立页面、居中弹框、侧滑面板或其他承载方式，必须逐页面按对应原型确认，不得全局写死为某一种容器。原型为独立页面时使用正式路由和页面布局；原型为居中弹框时使用模态弹框；只有原型明确为侧滑面板时才使用抽屉。不得因为已有公共组件或改动方便，把原型中的独立页面改成弹框、把弹框改成抽屉，或反向替换。
 - 延续现有客户工作台的可信、简洁和服务型视觉语言，与内部管理后台保持品牌关联但不照搬高密度管理界面。
 - 优先使用 Element Plus 和 Lucide 图标；不使用表情符号代替功能图标，不引入第二套组件库。

docs/business-index.md

@@ -38,3 +38,5 @@
 | 履约、海外仓与财务 | 入库计费、柜次进度、船期、海外仓贴标/转运/废弃/退货换标、消息和客户账单 | `src/modules/first-leg/`、`overseas-warehouse/`、`finance/`、`notifications/`；按服务端权限核对客户可见字段、客户隔离和只读/写入边界 |
 
 客户侧边界：仍以服务端权限和客户可见字段为准；PDA、平台后台操作和内部证据不因全量验收自动暴露到 Client。财务按 `../../docs/财务管理/` 与 `src/modules/finance/routes.ts` 定位。
+
+- 货物废弃：有箱唛按具体箱选择，备注选填；无箱唛但有托盘时只填申请总箱数与必填备注，预留相关托盘供PDA扫描现场箱唛自动计数。详情展示废弃备注、托盘、实际废弃箱唛与实际数量；现场扫描清单与申请选箱快照分别展示。

src/modules/cross-border/PROTOTYPE_MATRIX.md

@@ -32,3 +32,6 @@
 | 两类业务 | 列表、详情、承运安排 | 既有独立路由及只读承运摘要 | 本轮不改变承载；Client 不新增编辑路由 | 既有行为回归 |
 
 统一表单组件和转换逻辑各自位于应用内部，运行时不跨应用引用。两端业务组件源码一致性另作定向检查；下单数据不允许混入客户标识，Admin 在 API 参数显式选择客户，Client 由认证会话确定客户。
+
+
+2026-10-29 用户截图调整：采购待确认支持确认或必填原因驳回；四张实收/库存数量卡片置顶，商品及收件信息置底。本土卡车数量改托数，托数及预算须为正数。采购及卡车先等待Finance余额/授信冻结成功，再以同一幂等键建单；不足保留表单并提示原因。自动检查与人工视觉验收分别记录；待人工1920×1080、100%截图确认。

src/modules/cross-border/api/businessOrders.ts

@@ -95,7 +95,7 @@ export interface TruckCreate {
   destinationContactPhone: string
   pickupAt: string
   deliveryAt: string
-  packageCount: number
+  palletCount: number
   totalWeightKg: number
   totalVolumeCbm: number
   budgetAmount?: number

src/modules/cross-border/api/orderBudgets.ts

@@ -0,0 +1,13 @@
+import { apiRequest } from '@/api/http'
+interface BudgetResult { status: string; usable: boolean; amountCny: number | string; message: string; orderNo: string | null }
+const base = '/merchant/v1/last-leg/order-budgets'
+// 资金回执成功才继续下单；超时保留当前幂等键，允许用户再次核对。
+export async function requireOrderBudget(kind: 'procurement' | 'trucking', key: string, amount: number, currency: string) {
+  const url = `${base}/${kind}/${encodeURIComponent(key)}`
+  let result = await apiRequest<BudgetResult>({ method: 'POST', url, data: { amount, currency } })
+  for (let attempt = 0; result.status === 'FREEZE_PENDING' && attempt < 12; attempt++) {
+    await new Promise(resolve => setTimeout(resolve, 1000))
+    result = await apiRequest<BudgetResult>({ method: 'GET', url })
+  }
+  if (!result.usable) throw new Error(result.message || '余额及授信校验未完成，请稍后重试')
+}

src/modules/cross-border/api/procurement.ts

@@ -118,6 +118,8 @@ export interface ProcurementWorkflow {
   orderNo: string
   version: number
   status: string
+  rejectionReason: string | null
+  photosNeedUpdate: boolean
   receivedQuantity: number
   stockQuantity: number
   reservedQuantity: number
@@ -144,6 +146,9 @@ export function confirmProcurement(orderNo: string, data: { version: number; ide
   return apiRequest<ProcurementWorkflow>({ method: 'POST', url: `${endpoint}/${encodeURIComponent(orderNo)}/confirm`, data })
 }
 
+export function rejectProcurement(orderNo: string, data: { version: number; idempotencyKey: string; reason: string }) {
+  return apiRequest<ProcurementWorkflow>({ method: 'POST', url: `${endpoint}/${encodeURIComponent(orderNo)}/reject`, data })
+}
 export function getProcurementFile(orderNo: string, fileId: string) {
   return apiBlobRequest({ method: 'GET', url: `${endpoint}/${encodeURIComponent(orderNo)}/files/${encodeURIComponent(fileId)}/content` })
 }

src/modules/cross-border/businessOrders.test.mjs

@@ -119,7 +119,7 @@ test('uses the shared dense order-list and detail visual language', () => {
   assert.match(view, /\.detail-grid div \{[^}]*min-height: 34px;[^}]*grid-template-columns: 76px minmax\(0, 1fr\)/)
 })
 
-function transportHarness(kind = 'trucking', failFirst = false) {
+function transportHarness(kind = 'trucking', failFirst = false, budgetCheck = async () => {}) {
   const calls = []
   const script = view.match(/<script setup lang="ts">([\s\S]*?)<\/script>/)[1]
   const compiled = ts.transpileModule(script, { compilerOptions: { target: ts.ScriptTarget.ES2022, module: ts.ModuleKind.ESNext } }).outputText
@@ -130,7 +130,7 @@ function transportHarness(kind = 'trucking', failFirst = false) {
     computed: getter => ({ get value() { return typeof getter === 'function' ? getter() : getter.get() } }),
     reactive: value => value, ref: value => ({ value }), onMounted: () => {}, watch: () => {},
     useAuthStore: () => ({ hasPermission: () => true }), useRouter: () => ({ push: async () => {} }), useRoute: () => ({ params: {} }),
-    ...demandHelpers, poolOrderStatusLabels: {},
+    ...demandHelpers, poolOrderStatusLabels: {}, requireOrderBudget: budgetCheck,
     ElMessage: { success: () => {}, error: () => {} },
     createTransport: async (business, payload) => { calls.push({ business, payload: { ...payload } }); if (failFirst && calls.length === 1) throw new Error('retry'); },
   })
@@ -155,7 +155,7 @@ test('truck requires both contacts vehicle and minute times without inheriting l
 
 test('truck retry submits the complete new contract with identical local times and idempotency key', async () => {
   const current = transportHarness('trucking', true)
-  Object.assign(current.form, { vehicleType: 'PALLET_30', origin: 'Los Angeles', destination: 'Ontario', originContactName: 'A', originContactPhone: '+1-555-0100', destinationContactName: 'B', destinationContactPhone: '+1-555-0101', pickupAt: '2026-10-20T09:30:00', deliveryAt: '2026-10-20T15:45:00' })
+  Object.assign(current.form, { vehicleType: 'PALLET_30', estimatedPalletCount: 3, budgetAmount: 100, origin: 'Los Angeles', destination: 'Ontario', originContactName: 'A', originContactPhone: '+1-555-0100', destinationContactName: 'B', destinationContactPhone: '+1-555-0101', pickupAt: '2026-10-20T09:30:00', deliveryAt: '2026-10-20T15:45:00' })
   await current.submit()
   assert.equal(current.form.destinationContactName, 'B')
   await current.submit()
@@ -164,11 +164,12 @@ test('truck retry submits the complete new contract with identical local times a
   const second = current.calls[1].payload
   assert.equal(first.idempotencyKey, second.idempotencyKey)
   assert.equal(second.vehicleType, 'PALLET_30')
+  assert.equal(second.palletCount, 3)
   assert.equal(second.originContactPhone, '+1-555-0100')
   assert.equal(second.destinationContactName, 'B')
   assert.equal(second.pickupAt, '2026-10-20T09:30:00')
   assert.equal(second.deliveryAt, '2026-10-20T15:45:00')
-  for (const field of ['transportType', 'containerType', 'palletCount', 'contactName', 'contactInfo', 'requestedDate']) assert.equal(Object.hasOwn(second, field), false)
+  for (const field of ['transportType', 'containerType', 'packageCount', 'contactName', 'contactInfo', 'requestedDate']) assert.equal(Object.hasOwn(second, field), false)
 })
 
 test('truck details render saved minute times and unknown pool demand without timezone conversion', () => {
@@ -208,3 +209,17 @@ test('looseboard requires both times and rejects backwards schedule', () => {
   current.rules.value.deliveryAt[1].validator({}, '2026-10-20T10:29:00', error => { failure = error })
   assert.ok(failure)
 })
+
+
+test('truck creation waits for budget freeze and never submits after insufficient funds', async () => {
+  let release
+  const gate = new Promise(resolve => { release = resolve })
+  const current = transportHarness('trucking', false, () => gate)
+  Object.assign(current.form, { vehicleType: 'PALLET_30', estimatedPalletCount: 3, budgetAmount: 100, origin: 'LA', destination: 'ONT', originContactName: 'A', originContactPhone: '1', destinationContactName: 'B', destinationContactPhone: '2', pickupAt: '2026-10-20T09:00:00', deliveryAt: '2026-10-20T15:00:00' })
+  const pending = current.submit(); await Promise.resolve(); await Promise.resolve()
+  assert.equal(current.calls.length, 0)
+  release(); await pending; assert.equal(current.calls.length, 1)
+  const failed = transportHarness('trucking', false, async () => { throw new Error('余额及授信不足') })
+  Object.assign(failed.form, { ...current.form, vehicleType: 'PALLET_30', estimatedPalletCount: 3, budgetAmount: 100, origin: 'LA', destination: 'ONT', originContactName: 'A', originContactPhone: '1', destinationContactName: 'B', destinationContactPhone: '2', pickupAt: '2026-10-20T09:00:00', deliveryAt: '2026-10-20T15:00:00' })
+  await failed.submit(); assert.equal(failed.calls.length, 0); assert.equal(failed.form.budgetAmount, 100)
+})

src/modules/cross-border/components/BusinessOrdersView.vue

@@ -3,6 +3,7 @@ import { computed, onMounted, reactive, ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage, type FormInstance } from 'element-plus'
 import TransportDemandForm from './TransportDemandForm.vue'
+import { requireOrderBudget } from '../api/orderBudgets'
 import { createTransportDemandForm, transportDemandError, buildTransportDemand, type TransportDemandForm as DemandFormModel } from '../transportDemandForm'
 import DataTable, { type DataTableColumn } from '@/components/common/DataTable.vue'
 import QueryToolbar, { type QueryField, type QueryModel } from '@/components/common/QueryToolbar.vue'
@@ -118,6 +119,7 @@ const queryFields = computed<QueryField[]>(() => [
 ])
 
 const form = reactive<BusinessForm>(emptyForm())
+watch(() => JSON.stringify(form), () => { submitKey.value = '' })
 
 const detailFields = computed(() => {
   if (!detail.value) return []
@@ -252,6 +254,7 @@ async function loadDetail() {
 }
 
 async function submit() {
+  if (submitting.value) return
   const failure = transportDemandError(props.kind === 'trucking' ? 'truck' : 'looseboard', form)
   if (failure) { ElMessage.error(failure); return }
   if (!await formRef.value?.validate().catch(() => false)) return
@@ -259,13 +262,17 @@ async function submit() {
   const stableSubmitKey = submitKey.value || idempotencyKey()
   submitKey.value = stableSubmitKey
   try {
-    if (props.kind === 'trucking') await createTransport('trucking', { ...buildTransportDemand('truck', form), idempotencyKey: stableSubmitKey })
+    if (props.kind === 'trucking') {
+      const payload = { ...buildTransportDemand('truck', form), idempotencyKey: stableSubmitKey }
+      await requireOrderBudget('trucking', stableSubmitKey, payload.budgetAmount!, payload.currency)
+      await createTransport('trucking', payload)
+    }
     else await createTransport('looseboard', { ...buildTransportDemand('looseboard', form), idempotencyKey: stableSubmitKey })
     ElMessage.success('订单提交成功')
     resetForm()
     if (props.createPage) await router.push({ name: listRouteName.value })
     else { mode.value = 'list'; await load() }
-  } catch (cause) { ElMessage.error(errorMessage(cause)) }
+  } catch (cause) { if (/已释放|已过期/.test(errorMessage(cause))) submitKey.value = ''; ElMessage.error(errorMessage(cause)) }
   finally { submitting.value = false }
 }
 
@@ -274,8 +281,8 @@ onMounted(() => { if (props.detailPage) void loadDetail(); else if (!props.creat
 </script>
 
 <template>
-  <section v-loading="loading" class="business-orders client-ui" :aria-busy="loading">
-    <header v-if="mode === 'create'" class="page-head" :class="{ 'looseboard-page-head': props.kind === 'looseboard' }">
+  <section v-loading="loading" class="business-orders client-ui" :class="{ 'business-orders--create': mode === 'create' }" :aria-busy="loading">
+    <header v-if="mode === 'create'" class="page-head">
       <div>
         <h2>{{ configuration.title }}下单</h2>
 
@@ -337,7 +344,6 @@ onMounted(() => { if (props.detailPage) void loadDetail(); else if (!props.creat
 <style scoped>
 .business-orders { display: grid; gap: var(--client-section-gap); }
 .page-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
-.looseboard-page-head { max-width: 1180px; padding-right: 30px; box-sizing: border-box; }
 .page-head h2 { margin: 0; color: #111827; font-size: 26px; }
 .page-head p { margin: 7px 0 0; color: #64748b; font-size: 14px; }
 .business-table-card { overflow: hidden; border: 1px solid var(--client-border); border-radius: var(--client-radius); background: #fff; }
@@ -362,6 +368,11 @@ onMounted(() => { if (props.detailPage) void loadDetail(); else if (!props.creat
 .arrangement-grid dt { white-space: normal; overflow-wrap: anywhere; }
 .detail-grid dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: var(--navy); font-size: 12px; font-weight: 600; line-height: 1.4; }
 .form-card :deep(.el-card__body) { padding: 0; }
+.business-orders--create { --client-action: #2f7bff; --client-action-hover: #1d5fe0; --client-border: #d5dce8; --client-control-height: 44px; --client-font-size: 14px; width: 100%; min-width: 0; gap: 12px; background: #f4f7fc; }
+.business-orders--create .page-head { flex-wrap: wrap; gap: 16px; }
+.business-orders--create .page-head h2 { color: #1f2937; font-weight: 700; }
+.business-orders--create .page-head :deep(.el-button) { height: auto; min-height: 44px; padding: 10px 18px; border-radius: 6px; color: #1d5fe0; font-size: 14px; box-shadow: none; }
+.business-orders--create .form-card { min-width: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
 
 @media (max-width: 767px) {
   .business-orders { gap: 14px; }

src/modules/cross-border/components/ProcurementDetailPanel.vue

@@ -25,31 +25,17 @@ const totals = computed(() => feeTotals(props.detail.fees))
 
 <template>
   <el-alert v-if="fileError" :title="fileError" type="error" :closable="false" />
-  <section class="procurement-section" aria-label="商品与收件信息">
-    <h3>商品与收件信息</h3>
-    <dl class="procurement-grid">
-      <div><dt>采购方向</dt><dd>{{ directionLabel(detail.order.procurementDirection) }}</dd></div>
-      <div><dt>商品名称</dt><dd>{{ detail.order.productName }}</dd></div>
-      <div><dt>商品规格</dt><dd>{{ text(detail.order.productSpecification) }}</dd></div>
-      <div><dt>采购品类</dt><dd>{{ text(detail.order.purchaseCategory) }}</dd></div>
-      <div><dt>采购数量</dt><dd>{{ detail.order.purchaseQuantity }} 件</dd></div>
-      <div><dt>预算单价</dt><dd>{{ money(detail.order.budgetUnitPrice, detail.order.currency) }}</dd></div>
-      <div><dt>预算合计</dt><dd>{{ money(detail.budget.totalAmount, detail.budget.currency) }}</dd></div>
-      <div><dt>采购仓</dt><dd>{{ detail.order.actualWarehouseName || detail.order.plannedWarehouseName || '待审核指定' }}<span v-if="detail.order.actualWarehouseCode">（{{ detail.order.actualWarehouseCode }}）</span></dd></div>
-      <div><dt>收件人</dt><dd>{{ detail.order.contactName }}</dd></div>
-      <div><dt>联系电话</dt><dd>{{ detail.order.contactPhone }}</dd></div>
-      <div class="wide"><dt>收货地址</dt><dd>{{ detail.order.receivingAddress }}</dd></div>
-      <div v-if="detail.order.productUrl" class="full"><dt>商品链接</dt><dd><a v-if="productHref(detail.order.productUrl)" :href="productHref(detail.order.productUrl)" target="_blank" rel="noopener noreferrer">查看商品</a><span v-else>{{ text(detail.order.productUrl) }}</span></dd></div>
-    </dl>
-  </section>
-  <section class="procurement-section" aria-label="分批收货">
-    <h3>收货记录</h3>
+  <section class="procurement-section" aria-label="采购数量统计">
     <dl class="procurement-grid money-grid">
       <div><dt>累计收货</dt><dd>{{ workflow.receivedQuantity }} 件</dd></div>
       <div><dt>采购库存</dt><dd>{{ workflow.stockQuantity }} 件</dd></div>
       <div><dt>出库处理中</dt><dd>{{ workflow.reservedQuantity }} 件</dd></div>
       <div><dt>可出库</dt><dd>{{ workflow.availableQuantity }} 件</dd></div>
     </dl>
+  </section>
+  <section class="procurement-section" aria-label="分批收货">
+    <h3>收货记录</h3>
+
     <el-table :data="workflow.receipts" border stripe empty-text="暂无收货记录" row-key="id">
       <el-table-column label="批次" width="80" align="center"><template #default="{ $index }">{{ $index + 1 }}</template></el-table-column>
       <el-table-column prop="quantity" label="收货数量（件）" width="145" align="right" />
@@ -78,6 +64,23 @@ const totals = computed(() => feeTotals(props.detail.fees))
       <el-table-column label="扣款结果" min-width="160" align="center"><template #default="{ row }"><el-tag :type="feeTone(row as ProcurementFee)" size="small">{{ feeStatus(row as ProcurementFee) }}</el-tag></template></el-table-column>
     </el-table>
   </section>
+  <section class="procurement-section" aria-label="商品与收件信息">
+    <h3>商品与收件信息</h3>
+    <dl class="procurement-grid">
+      <div><dt>采购方向</dt><dd>{{ directionLabel(detail.order.procurementDirection) }}</dd></div>
+      <div><dt>商品名称</dt><dd>{{ detail.order.productName }}</dd></div>
+      <div><dt>商品规格</dt><dd>{{ text(detail.order.productSpecification) }}</dd></div>
+      <div><dt>采购品类</dt><dd>{{ text(detail.order.purchaseCategory) }}</dd></div>
+      <div><dt>采购数量</dt><dd>{{ detail.order.purchaseQuantity }} 件</dd></div>
+      <div><dt>预算单价</dt><dd>{{ money(detail.order.budgetUnitPrice, detail.order.currency) }}</dd></div>
+      <div><dt>预算合计</dt><dd>{{ money(detail.budget.totalAmount, detail.budget.currency) }}</dd></div>
+      <div><dt>采购仓</dt><dd>{{ detail.order.actualWarehouseName || detail.order.plannedWarehouseName || '待审核指定' }}<span v-if="detail.order.actualWarehouseCode">（{{ detail.order.actualWarehouseCode }}）</span></dd></div>
+      <div><dt>收件人</dt><dd>{{ detail.order.contactName }}</dd></div>
+      <div><dt>联系电话</dt><dd>{{ detail.order.contactPhone }}</dd></div>
+      <div class="wide"><dt>收货地址</dt><dd>{{ detail.order.receivingAddress }}</dd></div>
+      <div v-if="detail.order.productUrl" class="full"><dt>商品链接</dt><dd><a v-if="productHref(detail.order.productUrl)" :href="productHref(detail.order.productUrl)" target="_blank" rel="noopener noreferrer">查看商品</a><span v-else>{{ text(detail.order.productUrl) }}</span></dd></div>
+    </dl>
+  </section>
   <el-dialog :model-value="!!previewUrl" :title="previewName" width="800px" append-to-body @close="clearPreview">
     <img v-if="previewImage" :src="previewUrl" :alt="previewName" style="display: block; max-width: 100%; max-height: 70vh; margin: auto" />
     <a v-else :href="previewUrl" :download="previewName">下载 {{ previewName }}</a>
@@ -91,7 +94,7 @@ h3 { margin: 0 0 10px; padding-bottom: 7px; border-bottom: 1px solid var(--borde
 .procurement-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
 .procurement-grid > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 8px; padding: 9px 12px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); min-width: 0; }
 .procurement-grid dt { font-size: 12px; color: var(--muted); }.procurement-grid dd { margin: 0; font-size: 13px; line-height: 1.6; color: var(--navy); overflow-wrap: anywhere; }
-.procurement-grid .wide { grid-column: span 2; }.money-grid > div { grid-template-columns: minmax(0, 1fr); }.money-grid dd { font-size: 16px; font-weight: 600; }
+.procurement-grid .wide { grid-column: span 2; }.money-grid { gap: 16px; border: 0; }.money-grid > div { grid-template-columns: minmax(0, 1fr); padding: 18px; border: 1px solid var(--border); border-radius: 8px; background: #f8fbff; }.money-grid dd { font-size: 16px; font-weight: 600; }
 .procurement-grid .full { grid-column: 1 / -1; }
 .procurement-section :deep(.el-table .cell) { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
 .procurement-section :deep(.el-table .el-button.is-link) { display: flex; justify-content: flex-start; max-width: 100%; height: auto; margin: 0; padding: 3px 0; white-space: normal; text-align: left; }

src/modules/cross-border/components/TransportDemandForm.vue

@@ -14,6 +14,8 @@ const props = withDefaults(defineProps<{
 const emit = defineEmits<{ submit: []; cancel: [] }>()
 const formRef = ref<FormInstance>()
 const rules = computed(() => transportDemandRules(props.kind, props.model))
+const isCreate = computed(() => !props.editing)
+const createPopperClass = computed(() => isCreate.value ? 'transport-create-popper' : undefined)
 defineExpose({
   validate: () => formRef.value?.validate() ?? Promise.resolve(false),
   clearValidate: (fields?: string | string[]) => formRef.value?.clearValidate(fields),
@@ -21,50 +23,54 @@ defineExpose({
 </script>
 
 <template>
-  <el-form ref="formRef" class="transport-demand-form" :model="model" :rules="rules" label-position="top" :disabled="disabled || submitting">
+  <el-form ref="formRef" class="transport-demand-form" :class="{ 'transport-demand-form--create': isCreate }" :model="model" :rules="rules" label-position="top" :disabled="disabled || submitting">
     <slot name="customer" />
     <section class="transport-demand-section">
       <h3>运输信息</h3>
-      <div class="transport-demand-grid">
-        <el-form-item v-if="kind === 'truck'" class="transport-demand-wide" label="车辆类型" prop="vehicleType">
-          <el-select v-model="model.vehicleType" placeholder=""><el-option label="15拖" value="PALLET_15" /><el-option label="30拖" value="PALLET_30" /></el-select>
+      <div class="transport-demand-grid transport-demand-route-grid">
+        <el-form-item v-if="kind === 'truck'" class="transport-demand-wide transport-demand-vehicle" label="车辆类型" prop="vehicleType">
+          <el-select v-model="model.vehicleType" :popper-class="createPopperClass" :placeholder="isCreate ? '请选择车辆类型' : ''"><el-option label="15拖" value="PALLET_15" /><el-option label="30拖" value="PALLET_30" /></el-select>
         </el-form-item>
         <el-form-item :label="kind === 'truck' ? '取货地' : '起运地'" prop="origin"><el-input v-model.trim="model.origin" maxlength="255" placeholder="城市 / 港口 / 州" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '送达地' : '目的地'" prop="destination"><el-input v-model.trim="model.destination" maxlength="255" placeholder="城市 / 州" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '取货联系人' : '起运地联系人'" prop="originContactName"><el-input v-model.trim="model.originContactName" maxlength="128" placeholder="" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '送达联系人' : '目的地联系人'" prop="destinationContactName"><el-input v-model.trim="model.destinationContactName" maxlength="128" placeholder="" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '取货联系电话' : '起运地联系电话'" prop="originContactPhone"><el-input v-model.trim="model.originContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '送达联系电话' : '目的地联系电话'" prop="destinationContactPhone"><el-input v-model.trim="model.destinationContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '取货地址' : '起运详细地址'"><el-input v-model.trim="model.originAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '送达地址' : '目的详细地址'"><el-input v-model.trim="model.destinationAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
+        <el-form-item v-if="!isCreate" :label="kind === 'truck' ? '送达地' : '目的地'" prop="destination"><el-input v-model.trim="model.destination" maxlength="255" placeholder="城市 / 州" /></el-form-item>
+        <el-form-item :label="kind === 'truck' ? '取货联系人' : '起运地联系人'" prop="originContactName"><el-input v-model.trim="model.originContactName" maxlength="128" :placeholder="isCreate ? (kind === 'truck' ? '请输入取货联系人姓名' : '请输入起运地联系人姓名') : ''" /></el-form-item>
+        <el-form-item v-if="!isCreate" :label="kind === 'truck' ? '送达联系人' : '目的地联系人'" prop="destinationContactName"><el-input v-model.trim="model.destinationContactName" maxlength="128" placeholder="" /></el-form-item>
+        <el-form-item :label="kind === 'truck' ? '取货联系电话' : '起运地联系电话'" prop="originContactPhone"><el-input v-model.trim="model.originContactPhone" type="tel" maxlength="128" :placeholder="isCreate ? (kind === 'truck' ? '请输入取货联系电话' : '请输入起运地联系电话') : ''" /></el-form-item>
+        <template v-if="isCreate">
+          <el-form-item :label="kind === 'truck' ? '送达地' : '目的地'" prop="destination"><el-input v-model.trim="model.destination" maxlength="255" placeholder="城市 / 州" /></el-form-item>
+          <el-form-item :label="kind === 'truck' ? '送达联系人' : '目的地联系人'" prop="destinationContactName"><el-input v-model.trim="model.destinationContactName" maxlength="128" :placeholder="kind === 'truck' ? '请输入送达联系人姓名' : '请输入目的地联系人姓名'" /></el-form-item>
+        </template>
+        <el-form-item :label="kind === 'truck' ? '送达联系电话' : '目的地联系电话'" prop="destinationContactPhone"><el-input v-model.trim="model.destinationContactPhone" type="tel" maxlength="128" :placeholder="isCreate ? (kind === 'truck' ? '请输入送达联系电话' : '请输入目的地联系电话') : ''" /></el-form-item>
+        <el-form-item class="transport-demand-address" :label="kind === 'truck' ? '取货地址' : '起运详细地址'"><el-input v-model.trim="model.originAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
+        <el-form-item class="transport-demand-address" :label="kind === 'truck' ? '送达地址' : '目的详细地址'"><el-input v-model.trim="model.destinationAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
       </div>
     </section>
     <section class="transport-demand-section">
       <h3>货物信息</h3>
-      <div class="transport-demand-grid" :class="kind === 'looseboard' ? 'transport-demand-cargo-four' : 'transport-demand-cargo-three'">
-        <el-form-item v-if="kind === 'looseboard'" label="商品名称"><el-input v-model.trim="model.productName" maxlength="255" placeholder="" /></el-form-item>
-        <el-form-item v-if="kind === 'looseboard'" label="预计托数" prop="estimatedPalletCount"><el-input-number v-model="model.estimatedPalletCount" :min="0" :precision="0" controls-position="right" placeholder="" /></el-form-item>
-        <el-form-item v-if="kind === 'truck'" label="件数" prop="packageCount"><el-input-number v-model="model.packageCount" :min="0" :precision="0" controls-position="right" placeholder="" /></el-form-item>
-        <el-form-item label="总重量 (kg)" prop="totalWeightKg"><el-input-number v-model="model.totalWeightKg" :min="0" :precision="3" controls-position="right" placeholder="" /></el-form-item>
-        <el-form-item label="总体积 (m³)" prop="totalVolumeCbm"><el-input-number v-model="model.totalVolumeCbm" :min="0" :precision="6" controls-position="right" placeholder="" /></el-form-item>
-        <el-form-item v-if="kind === 'looseboard'" label="件数" prop="packageCount"><el-input-number v-model="model.packageCount" :min="0" :precision="0" controls-position="right" placeholder="" /></el-form-item>
+      <div class="transport-demand-grid" :class="kind === 'looseboard' && !isCreate ? 'transport-demand-cargo-four' : 'transport-demand-cargo-three'">
+        <el-form-item v-if="kind === 'looseboard'" label="商品名称"><el-input v-model.trim="model.productName" maxlength="255" :placeholder="isCreate ? '请输入商品名称（选填）' : ''" /></el-form-item>
+        <el-form-item v-if="kind === 'looseboard'" label="预计托数" prop="estimatedPalletCount"><el-input-number v-model="model.estimatedPalletCount" :min="0" :precision="0" controls-position="right" :placeholder="isCreate ? '请输入预计托数' : ''" /></el-form-item>
+        <el-form-item v-if="kind === 'truck'" label="托数" prop="estimatedPalletCount"><el-input-number v-model="model.estimatedPalletCount" :min="1" :precision="0" controls-position="right" :placeholder="isCreate ? '请输入托数' : ''" /></el-form-item>
+        <el-form-item label="总重量 (kg)" prop="totalWeightKg"><el-input-number v-model="model.totalWeightKg" :min="0" :precision="3" controls-position="right" :placeholder="isCreate ? '请输入总重量' : ''" /></el-form-item>
+        <el-form-item label="总体积 (m³)" prop="totalVolumeCbm"><el-input-number v-model="model.totalVolumeCbm" :min="0" :precision="6" controls-position="right" :placeholder="isCreate ? '请输入总体积' : ''" /></el-form-item>
+        <el-form-item v-if="kind === 'looseboard'" label="件数" prop="packageCount"><el-input-number v-model="model.packageCount" :min="0" :precision="0" controls-position="right" :placeholder="isCreate ? '请输入件数' : ''" /></el-form-item>
       </div>
     </section>
     <section class="transport-demand-section">
       <h3>费用与时效</h3>
       <div class="transport-demand-grid">
         <el-form-item label="预算总价" prop="budgetAmount"><div class="transport-demand-budget">
-          <el-input-number v-model="model.budgetAmount" :min="0" :precision="2" controls-position="right" placeholder="" />
-          <el-select v-model="model.currency" aria-label="预算币种" placeholder=""><el-option label="USD" value="USD" /><el-option label="CNY" value="CNY" /></el-select>
+          <el-input-number v-model="model.budgetAmount" :min="0" :precision="2" controls-position="right" :placeholder="isCreate ? (kind === 'truck' ? '请输入预算总价' : '请输入预算总价（选填）') : ''" />
+          <el-select v-model="model.currency" :popper-class="createPopperClass" aria-label="预算币种" placeholder=""><el-option label="USD" value="USD" /><el-option label="CNY" value="CNY" /></el-select>
         </div></el-form-item>
         <div />
-        <el-form-item :label="kind === 'truck' ? '取货时间' : '取货时间'" prop="pickupAt"><el-date-picker v-model="model.pickupAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" @change="formRef?.validateField('deliveryAt').catch(() => undefined)" /></el-form-item>
-        <el-form-item :label="kind === 'truck' ? '送达时间' : '送货时间'" prop="deliveryAt"><el-date-picker v-model="model.deliveryAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" /></el-form-item>
-        <el-form-item class="transport-demand-wide" label="备注"><el-input v-model="model.remark" type="textarea" :rows="3" maxlength="1000" show-word-limit placeholder="" /></el-form-item>
+        <el-form-item :label="kind === 'truck' ? '取货时间' : '取货时间'" prop="pickupAt"><el-date-picker v-model="model.pickupAt" :popper-class="createPopperClass" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" :placeholder="isCreate ? '请选择取货日期和时间' : ''" @change="formRef?.validateField('deliveryAt').catch(() => undefined)" /></el-form-item>
+        <el-form-item :label="kind === 'truck' ? '送达时间' : '送货时间'" prop="deliveryAt"><el-date-picker v-model="model.deliveryAt" :popper-class="createPopperClass" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" :placeholder="isCreate ? (kind === 'truck' ? '请选择送达日期和时间' : '请选择送货日期和时间') : ''" /></el-form-item>
+        <el-form-item class="transport-demand-wide" label="备注"><el-input v-model="model.remark" type="textarea" :rows="3" maxlength="1000" :show-word-limit="!isCreate" :placeholder="isCreate ? '请输入运输要求或其他补充信息（选填）' : ''" /><span v-if="isCreate" class="transport-demand-character-count">{{ model.remark.length }} / 1000</span></el-form-item>
       </div>
     </section>
     <footer class="transport-demand-actions">
-      <el-button :disabled="submitting" @click="emit('cancel')">取消</el-button>
+      <el-button :disabled="submitting" @click="emit('cancel')">{{ isCreate ? '返回列表' : '取消' }}</el-button>
       <el-button v-if="canSubmit" type="primary" :loading="submitting" :disabled="disabled" @click="emit('submit')">{{ editing ? '保存修改' : '提交订单' }}</el-button>
     </footer>
   </el-form>
@@ -84,4 +90,49 @@ defineExpose({
 .transport-demand-budget { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 100px; gap: 10px; }
 .transport-demand-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 18px 24px; }
 .transport-demand-actions :deep(.el-button + .el-button) { margin-left: 0; }
+
+.transport-demand-form--create {
+  --el-component-size: 44px;
+  --el-color-primary: #2f7bff;
+  --el-text-color-regular: #1f2937;
+  --el-text-color-placeholder: #b0b7c3;
+  max-width: none;
+  min-width: 0;
+  background: transparent;
+  color: #1f2937;
+  font: 14px/1.5 "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
+}
+.transport-demand-form--create .transport-demand-section { margin-bottom: 12px; padding: 0; border: 0; }
+.transport-demand-form--create .transport-demand-section h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; color: #1f2937; font-size: 18px; font-weight: 700; }
+.transport-demand-form--create .transport-demand-section h3::before { content: ''; width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #2f7bff; }
+.transport-demand-form--create .transport-demand-section:nth-of-type(2) h3::before { background: #0ea5a4; }
+.transport-demand-form--create .transport-demand-grid { min-width: 0; gap: 12px 20px; padding: 16px; border: 1px solid #e3e8f0; border-radius: 10px; background: #fff; }
+.transport-demand-form--create .transport-demand-route-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
+.transport-demand-form--create .transport-demand-route-grid > .el-form-item { grid-column: span 2; }
+.transport-demand-form--create .transport-demand-route-grid > .transport-demand-vehicle { grid-column: 1 / -1; }
+.transport-demand-form--create .transport-demand-route-grid > .transport-demand-address { grid-column: span 3; }
+.transport-demand-form--create :deep(.el-form-item) { margin: 0; }
+.transport-demand-form--create .transport-demand-vehicle { width: calc((100% - 40px) / 3); }
+.transport-demand-form--create :deep(.el-form-item__label) { height: auto; margin-bottom: 6px; padding: 0; color: #374151; font-size: 14px; font-weight: 600; line-height: 20px; }
+.transport-demand-form--create :deep(.el-form-item.is-required .el-form-item__label::before) { color: #e5484d; }
+/* Show validation beside the label without adding height below the control. */
+.transport-demand-form--create :deep(.el-form-item__content) { min-width: 0; line-height: 20px; }
+.transport-demand-form--create :deep(.el-form-item__error) { position: absolute; top: auto; bottom: calc(100% + 6px); right: 0; left: auto; width: auto; max-width: calc(100% - 120px); padding: 0; font-size: 12px; line-height: 20px; text-align: right; }
+.transport-demand-form--create :deep(.el-input__wrapper), .transport-demand-form--create :deep(.el-select__wrapper), .transport-demand-form--create :deep(.el-textarea__inner) { border: 1px solid #d5dce8; border-radius: 6px; background: #fff; box-shadow: none; font-family: inherit; font-size: 14px; }
+.transport-demand-form--create :deep(.el-input__wrapper), .transport-demand-form--create :deep(.el-select__wrapper) { min-height: 44px; padding: 10px 14px; }
+.transport-demand-form--create :deep(.el-input__inner) { height: 22px; color: #1f2937; line-height: 22px; }
+.transport-demand-form--create :deep(.el-input-number .el-input__wrapper) { padding-right: 40px; }
+.transport-demand-form--create :deep(.el-input-number.is-controls-right .el-input-number__increase), .transport-demand-form--create :deep(.el-input-number.is-controls-right .el-input-number__decrease) { width: 32px; }
+.transport-demand-form--create :deep(.el-textarea__inner) { min-height: 110px; padding: 11px 14px; color: #1f2937; line-height: 20px; resize: vertical; }
+.transport-demand-form--create :deep(.el-input__inner::placeholder), .transport-demand-form--create :deep(.el-textarea__inner::placeholder) { color: var(--el-text-color-placeholder); opacity: 1; }
+.transport-demand-form--create :deep(.el-input__wrapper.is-focus), .transport-demand-form--create :deep(.el-select__wrapper.is-focused), .transport-demand-form--create :deep(.el-textarea__inner:focus) { outline: 2px solid #2f7bff; outline-offset: 0; }
+.transport-demand-form--create :deep(.el-form-item.is-error .el-input__wrapper), .transport-demand-form--create :deep(.el-form-item.is-error .el-select__wrapper), .transport-demand-form--create :deep(.el-form-item.is-error .el-textarea__inner) { border-color: #e5484d; box-shadow: none; }
+.transport-demand-form--create :deep(.el-input.is-disabled .el-input__wrapper), .transport-demand-form--create :deep(.el-select__wrapper.is-disabled), .transport-demand-form--create :deep(.el-textarea.is-disabled .el-textarea__inner) { background: #f6f9ff; }
+.transport-demand-form--create :deep(.el-input.is-disabled .el-input__inner), .transport-demand-form--create :deep(.el-textarea.is-disabled .el-textarea__inner) { color: #98a2b3; -webkit-text-fill-color: #98a2b3; }
+.transport-demand-character-count { width: 100%; margin-top: 4px; color: #6b7280; font-size: 13px; text-align: right; }
+.transport-demand-form--create .transport-demand-actions { flex-wrap: wrap; gap: 12px; padding: 0; }
+.transport-demand-form--create .transport-demand-actions :deep(.el-button) { height: auto; min-height: 44px; margin-left: 0; padding: 10px 18px; border-radius: 6px; color: #1d5fe0; font-size: 14px; box-shadow: none; }
+.transport-demand-form--create .transport-demand-actions :deep(.el-button--primary) { padding: 12px 28px; color: #fff; }
+.transport-demand-form--create .transport-demand-actions :deep(.el-button.is-disabled) { color: #98a2b3; }
+:global(.transport-create-popper.el-popper) { --el-color-primary: #2f7bff; border: 1px solid #d5dce8; box-shadow: none; }
 </style>

src/modules/cross-border/procurement.test.mjs

@@ -1,11 +1,14 @@
 import assert from 'node:assert/strict'
 import test from 'node:test'
 import { readFileSync } from 'node:fs'
+import { createRequire } from 'node:module'
 import { runInNewContext } from 'node:vm'
 import ts from 'typescript'
 import * as vue from 'vue'
 import { parse, compileScript } from 'vue/compiler-sfc'
 
+const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
+
 let nextKey = 0
 const crypto = { randomUUID: () => `test-key-${++nextKey}` }
 function moduleFrom(source, require = () => { throw new Error('unexpected import') }) {
@@ -72,10 +75,11 @@ function viewHarness({ createPage = false, detailPage = false, api = {}, storage
     require(name) {
       if (name === 'vue') return { ...vue, onBeforeUnmount: callback => dispose.push(callback), watch: (...args) => { const stop = vue.watch(...args); dispose.push(stop); return stop } }
       if (name === 'vue-router') return { useRoute: () => route, useRouter: () => ({ push: async target => pushes.push(target) }) }
-      if (name === 'element-plus') return { ElMessage: { success: () => {} }, ElMessageBox: { confirm: async () => {} } }
+      if (name === 'element-plus') return { ElMessage: { success: () => {} }, ElMessageBox: { confirm: async () => {}, prompt: async (...args) => { const value = api.rejectionReason ?? '照片不清晰'; const valid = args[2].inputValidator(value); if (valid !== true) throw new Error(valid); return { value } } } }
       if (name === '@/api/types') return { ApiError }
       if (name === '@/api/session') return { accessTokenIdentity: token => token }
       if (name === '@/modules/auth/public') return { useAuthStore: () => auth }
+      if (name === '../api/orderBudgets') return { requireOrderBudget: api.requireOrderBudget || (async () => {}) }
       if (name === '../api/procurement') return { ...defaults, ...api }
       if (name === '../procurementPresentation') return presentation
       if (name === '../procurementSubmission') return submission
@@ -85,9 +89,36 @@ function viewHarness({ createPage = false, detailPage = false, api = {}, storage
   }
   runInNewContext(ts.transpileModule(source, { compilerOptions: { target: ts.ScriptTarget.ES2022, module: ts.ModuleKind.CommonJS } }).outputText, context)
   const state = context.exports.default.setup(props, { expose: () => {} })
+  state.formRef.value = {
+    validate: async () => { await new Schema(state.formRules).validate(state.form); return true },
+    clearValidate: () => {},
+  }
   return { state, props, route, auth, pushes, storage, dispose: () => dispose.forEach(callback => callback()) }
 }
 
+test('procurement required fields validate individually and blank submissions never call the API', async () => {
+  const calls = []
+  const harness = viewHarness({ createPage: true, api: { createProcurement: async payload => { calls.push(payload); return { order: { orderNo: 'PO-VALID' } } } } })
+  try {
+    const fields = ['procurementDirection', 'productName', 'purchaseQuantity', 'budgetUnitPrice', 'currency', 'contactName', 'contactPhone', 'receivingAddress']
+    const source = readFileSync(new URL('./views/ProcurementView.vue', import.meta.url), 'utf8')
+    for (const field of fields) {
+      assert.match(source, new RegExp(`<el-form-item[^>]*prop="${field}"`))
+      const schema = new Schema({ [field]: harness.state.formRules[field] })
+      await assert.rejects(schema.validate({ [field]: '' }), error => Boolean(error.fields[field]))
+    }
+    await assert.rejects(new Schema(harness.state.formRules).validate({ ...draft(), productName: '   ' }))
+    await harness.state.submit()
+    assert.equal(calls.length, 0)
+    assert.equal(harness.state.submitting.value, false)
+    assert.equal(harness.state.submitError.value, '')
+    Object.assign(harness.state.form, draft(), { budgetUnitPrice: '0' })
+    await harness.state.submit()
+    assert.equal(calls.length, 1)
+    assert.equal(calls[0].budgetUnitPrice, 0)
+  } finally { harness.dispose() }
+})
+
 test('create summary follows the current form, preserves cents and clears with the draft', () => {
   const harness = viewHarness({ createPage: true })
   try {
@@ -165,7 +196,7 @@ test('submission double-click sends once and definitive validation rejection per
   let reject, calls = 0
   const harness = viewHarness({ createPage: true, api: { createProcurement: () => { calls++; return new Promise((_, failure) => { reject = failure }) } } })
   try {
-    Object.assign(harness.state.form, draft()); const first = harness.state.submit(); await harness.state.submit(); assert.equal(calls, 1)
+    Object.assign(harness.state.form, draft()); const first = harness.state.submit(); await harness.state.submit(); await flush(); assert.equal(calls, 1)
     reject(new ApiError('invalid', 'A0422')); await first
     assert.equal(harness.state.submitting.value, false); assert.equal(harness.storage.size, 0)
   } finally { harness.dispose() }
@@ -265,3 +296,27 @@ test('bill-settled manual fees show review results without counting a balance de
   assert.equal(presentation.feeTone(bill('REJECTED')), 'danger')
   assert.equal(presentation.feeTotals([bill('PENDING'), bill('APPROVED'), bill('REJECTED')]).paid, '0.00')
 })
+
+
+test('insufficient balance and credit blocks procurement creation and preserves the draft', async () => {
+  let creates = 0
+  const harness = viewHarness({ createPage: true, api: { requireOrderBudget: async () => { throw new Error('余额及授信不足') }, createProcurement: async () => { creates++ } } })
+  try {
+    Object.assign(harness.state.form, draft()); await harness.state.submit()
+    assert.equal(creates, 0); assert.equal(harness.state.submitError.value, '余额及授信不足')
+    assert.equal(harness.state.form.productName, draft().productName)
+  } finally { harness.dispose() }
+})
+
+test('customer rejection requires a reason and carries current order version', async () => {
+  const calls = []
+  const harness = viewHarness({ detailPage: true, api: { rejectProcurement: async (orderNo, command) => { calls.push({ orderNo, ...command }); return { orderNo, status: 'RECEIVING', version: 2, rejectionReason: command.reason } } } })
+  try {
+    await flush(); await harness.state.rejectReceived()
+    assert.equal(calls.length, 1); assert.equal(calls[0].orderNo, 'PO-1'); assert.equal(calls[0].version, 1)
+    assert.equal(calls[0].reason, '照片不清晰'); assert.equal(harness.state.workflow.value.status, 'RECEIVING')
+  } finally { harness.dispose() }
+  const blank = viewHarness({ detailPage: true, api: { rejectionReason: '   ', rejectProcurement: async () => { throw new Error('不得发送空原因') } } })
+  try { await flush(); await blank.state.rejectReceived(); assert.match(blank.state.confirmError.value, /请填写驳回原因/) }
+  finally { blank.dispose() }
+})

src/modules/cross-border/procurementPresentation.ts

@@ -3,7 +3,7 @@ import type { Amount, ProcurementCreate, ProcurementFee } from './api/procuremen
 export const procurementStatuses: Record<string, string> = {
   PENDING_REVIEW: '待审核', RECEIVING: '收货中', WAIT_CUSTOMER_CONFIRM: '待客户确认', CONFIRMED: '已确认',
   IN_TRANSIT: '运输中', DELIVERING: '派送中', COMPLETED: '签收完成',
-  REJECTED: '已拒绝', CANCELLED: '已取消', EXCEPTION_CLOSED: '异常关闭',
+  REJECTED: '已拒绝', CANCELLED: '已取消',
 }
 export const feePurposes: Record<string, string> = {
   SAMPLE_PAYMENT: '样品货款', INTERNATIONAL_ESTIMATE: '预估国际运费', INTERNATIONAL_FREIGHT: '实际国际运费',
@@ -12,7 +12,7 @@ export const feePurposes: Record<string, string> = {
 export function statusLabel(status: string | null | undefined, direction?: string | null) { return regionText(status ? procurementStatuses[status] || '待核对进度' : '—', direction) }
 export function statusTone(status: string | null | undefined): 'success' | 'warning' | 'danger' | 'info' | 'primary' {
   if (status === 'COMPLETED' || status === 'CONFIRMED') return 'success'
-  if (status === 'REJECTED' || status === 'EXCEPTION_CLOSED') return 'danger'
+  if (status === 'REJECTED') return 'danger'
   if (status === 'CANCELLED') return 'info'
   if (status === 'IN_TRANSIT' || status === 'DELIVERING') return 'primary'
   return 'warning'

src/modules/cross-border/transportDemandForm.test.mjs

@@ -7,7 +7,7 @@ import ts from 'typescript'
 const source = readFileSync(new URL('./transportDemandForm.ts', import.meta.url), 'utf8')
 const code = ts.transpileModule(source, { compilerOptions: { target: ts.ScriptTarget.ES2022, module: ts.ModuleKind.ESNext } }).outputText.replace(/^export /gm, '')
 const { createTransportDemandForm, transportDemandError, buildTransportDemand } = runInNewContext(`${code}\n({ createTransportDemandForm, transportDemandError, buildTransportDemand })`)
-const valid = () => ({ ...createTransportDemandForm(), vehicleType: 'PALLET_15', origin: ' LA ', destination: ' ONT ', originContactName: ' 发货人 ', originContactPhone: ' +1-555-0100 ', destinationContactName: ' 收货人 ', destinationContactPhone: ' +1-555-0101 ', pickupAt: '2026-10-20T09:30:45', deliveryAt: '2026-10-20T15:45:12' })
+const valid = () => ({ ...createTransportDemandForm(), vehicleType: 'PALLET_15', estimatedPalletCount: 3, budgetAmount: 100, origin: ' LA ', destination: ' ONT ', originContactName: ' 发货人 ', originContactPhone: ' +1-555-0100 ', destinationContactName: ' 收货人 ', destinationContactPhone: ' +1-555-0101 ', pickupAt: '2026-10-20T09:30:45', deliveryAt: '2026-10-20T15:45:12' })
 
 test('initial form leaves contacts and times blank, zeroes cargo and distinguishes blank budget from zero', () => {
   const form = createTransportDemandForm()
@@ -15,8 +15,8 @@ test('initial form leaves contacts and times blank, zeroes cargo and distinguish
   for (const key of ['estimatedPalletCount', 'packageCount', 'totalWeightKg', 'totalVolumeCbm']) assert.equal(form[key], 0)
   assert.equal(form.budgetAmount, undefined)
   assert.equal(form.currency, 'USD')
-  assert.equal(buildTransportDemand('truck', valid()).budgetAmount, undefined)
-  assert.equal(buildTransportDemand('truck', { ...valid(), budgetAmount: 0 }).budgetAmount, 0)
+  assert.throws(() => buildTransportDemand('truck', { ...valid(), budgetAmount: undefined }), /预算/)
+  assert.throws(() => buildTransportDemand('truck', { ...valid(), budgetAmount: 0 }), /预算/)
 })
 
 for (const kind of ['truck', 'looseboard']) {
@@ -53,6 +53,8 @@ test('truck accepts only the two vehicle types and does not submit looseboard ca
   const truck = buildTransportDemand('truck', { ...valid(), productName: 'cargo', estimatedPalletCount: 3 })
   assert.equal(Object.hasOwn(truck, 'productName'), false)
   assert.equal(Object.hasOwn(truck, 'estimatedPalletCount'), false)
+  assert.equal(truck.palletCount, 3)
+  assert.equal(Object.hasOwn(truck, 'packageCount'), false)
   const loose = buildTransportDemand('looseboard', { ...valid(), vehicleType: '', productName: ' cargo ', estimatedPalletCount: 3, packageCount: 8 })
   assert.equal(Object.hasOwn(loose, 'vehicleType'), false)
   assert.equal(loose.productName, 'cargo')

src/modules/cross-border/transportDemandForm.ts

@@ -53,10 +53,10 @@ export function transportDemandRules(kind: TransportDemandKind, form: TransportD
   }
   if (kind === 'truck') rules.vehicleType = [{ required: true, message: '请选择车辆类型', trigger: 'change' }]
   for (const [field, label] of [['packageCount', '件数'], ['estimatedPalletCount', '预计托数'], ['totalWeightKg', '总重量'], ['totalVolumeCbm', '总体积']] as const) {
-    if (field === 'estimatedPalletCount' && kind !== 'looseboard') continue
+    if (field === 'packageCount' && kind === 'truck') continue
     rules[field] = [{ required: true, type: 'number', min: 0, message: `${label}须为不小于 0 的数字`, trigger: 'change' }]
   }
-  rules.budgetAmount = [{ type: 'number', min: 0, message: '预算总价不能小于 0', trigger: 'change' }]
+  rules.budgetAmount = [{ required: kind === 'truck', type: 'number', min: kind === 'truck' ? 0.01 : 0, message: '请输入大于 0 的预算总价', trigger: 'change' }]
   const pickupLabel = kind === 'truck' ? '取货时间' : '取货时间', deliveryLabel = kind === 'truck' ? '送达时间' : '送货时间'
   rules.pickupAt = [{ required: true, message: `请选择${pickupLabel}`, trigger: 'change' }]
   rules.deliveryAt = [{ required: true, message: `请选择${deliveryLabel}`, trigger: 'change' }, {
@@ -81,6 +81,8 @@ export function transportDemandError(kind: TransportDemandKind, form: TransportD
     if (!Number.isFinite(form[field]) || form[field] < 0) return `${label}须为不小于 0 的数字`
   }
   if (!Number.isInteger(form.packageCount) || kind === 'looseboard' && !Number.isInteger(form.estimatedPalletCount)) return '件数和预计托数须为整数'
+  if (kind === 'truck' && (!Number.isSafeInteger(form.estimatedPalletCount) || form.estimatedPalletCount <= 0)) return '请输入大于 0 的托数'
+  if (kind === 'truck' && (form.budgetAmount == null || !Number.isFinite(form.budgetAmount) || form.budgetAmount <= 0)) return '请输入大于 0 的预算总价'
   if (form.budgetAmount != null && (!Number.isFinite(form.budgetAmount) || form.budgetAmount < 0)) return '预算总价不能小于 0'
   if (!['USD', 'CNY'].includes(form.currency)) return '请选择预算币种'
   return undefined
@@ -99,7 +101,7 @@ function commonPayload(form: TransportDemandForm) {
 }
 
 type CommonPayload = ReturnType<typeof commonPayload>
-type TruckPayload = CommonPayload & { vehicleType: 'PALLET_15' | 'PALLET_30' }
+type TruckPayload = Omit<CommonPayload, 'packageCount'> & { palletCount: number; vehicleType: 'PALLET_15' | 'PALLET_30' }
 type LooseboardPayload = CommonPayload & { productName: string | undefined; estimatedPalletCount: number }
 
 export function buildTransportDemand(kind: 'truck', form: TransportDemandForm): TruckPayload
@@ -109,6 +111,6 @@ export function buildTransportDemand(kind: TransportDemandKind, form: TransportD
   if (failure) throw new Error(failure)
   const common = commonPayload(form)
   return kind === 'truck'
-    ? { ...common, vehicleType: form.vehicleType as 'PALLET_15' | 'PALLET_30' }
+    ? { ...(({ packageCount: _packages, ...rest }) => rest)(common), palletCount: form.estimatedPalletCount, vehicleType: form.vehicleType as 'PALLET_15' | 'PALLET_30' }
     : { ...common, productName: form.productName.trim() || undefined, estimatedPalletCount: form.estimatedPalletCount }
 }

src/modules/cross-border/views/ProcurementView.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, onBeforeUnmount, reactive, ref, shallowRef, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
 import { ApiError } from '@/api/types'
 import { accessTokenIdentity } from '@/api/session'
 import { useAuthStore } from '@/modules/auth/public'
@@ -9,8 +9,9 @@ import DataTable, { type DataTableColumn } from '@/components/common/DataTable.v
 import QueryToolbar, { type QueryField, type QueryModel } from '@/components/common/QueryToolbar.vue'
 import type { TableAction } from '@/components/common/tableActions'
 import ProcurementDetailPanel from '../components/ProcurementDetailPanel.vue'
-import { confirmProcurement, createProcurement, getProcurement, getProcurementWorkflow, listProcurements, type ProcurementDetail, type ProcurementSummary, type ProcurementWorkflow } from '../api/procurement'
+import { rejectProcurement, confirmProcurement, createProcurement, getProcurement, getProcurementWorkflow, listProcurements, type ProcurementDetail, type ProcurementSummary, type ProcurementWorkflow } from '../api/procurement'
 import { procurementDirections, directionLabel, regionText, buildProcurementCreate, dateTime, draftBudgetTotal, emptyProcurementDraft, money, procurementStatuses, statusLabel, statusTone } from '../procurementPresentation'
+import { requireOrderBudget } from '../api/orderBudgets'
 import { procurementRequestKey } from '../procurementSubmission'
 
 const props = withDefaults(defineProps<{ createPage?: boolean; detailPage?: boolean }>(), { createPage: false, detailPage: false })
@@ -22,6 +23,17 @@ const canList = computed(() => auth.hasPermission('merchant:cross-border:procure
 const identity = computed(() => auth.token ? accessTokenIdentity(auth.token) : null)
 const companyName = computed(() => auth.profile.tenantName || (auth.user?.tenantName && !/^企业租户 \d+$/.test(auth.user.tenantName) ? auth.user.tenantName : ''))
 const form = reactive(emptyProcurementDraft())
+const formRef = ref<FormInstance>()
+const formRules: FormRules<typeof form> = {
+  procurementDirection: [{ required: true, message: '请选择采购方向', trigger: 'change' }],
+  productName: [{ required: true, whitespace: true, message: '请输入商品名称', trigger: 'blur' }],
+  purchaseQuantity: [{ required: true, whitespace: true, message: '请输入采购数量', trigger: 'blur' }],
+  budgetUnitPrice: [{ required: true, whitespace: true, message: '请输入预算单价', trigger: 'blur' }],
+  currency: [{ required: true, message: '请选择预算币种', trigger: 'change' }],
+  contactName: [{ required: true, whitespace: true, message: '请输入收件人姓名', trigger: 'blur' }],
+  contactPhone: [{ required: true, whitespace: true, message: '请输入联系电话', trigger: 'blur' }],
+  receivingAddress: [{ required: true, whitespace: true, message: '请输入完整收货地址', trigger: 'blur' }],
+}
 const summaryQuantity = computed(() => /^\d+$/.test(form.purchaseQuantity) && Number.isSafeInteger(Number(form.purchaseQuantity)) && Number(form.purchaseQuantity) > 0 ? String(Number(form.purchaseQuantity)) : '—')
 const summaryUnitPrice = computed(() => draftBudgetTotal({ ...form, purchaseQuantity: '1' }) ?? '—')
 const summaryCurrencyName = computed(() => form.currency === 'USD' ? '美元' : '人民币')
@@ -101,21 +113,40 @@ async function confirmReceived() {
     if (cause !== 'cancel' && cause !== 'close' && active && owner === identity.value && targetOrder === orderNo.value) confirmError.value = message(cause)
   } finally { confirming.value = false }
 }
+// 驳回携带当前版本和必填原因，失败保留当前采购详情。
+async function rejectReceived() {
+  if (!canConfirm.value || confirming.value || !workflow.value) return
+  const owner = identity.value, targetOrder = orderNo.value
+  confirming.value = true; confirmError.value = ''
+  try {
+    const answer = await ElMessageBox.prompt('请说明采购结果不符合要求的原因，平台将重新上传照片。', '驳回采购结果', { inputType: 'textarea', inputValidator: value => !!value?.trim() && value.trim().length <= 1000 || '请填写驳回原因，最多1000字', confirmButtonText: '提交驳回', cancelButtonText: '取消' })
+    if (!active || owner !== identity.value || targetOrder !== orderNo.value || !workflow.value) return
+    const result = await rejectProcurement(targetOrder, { version: workflow.value.version, idempotencyKey: procurementRequestKey(), reason: answer.value.trim() })
+    if (!active || owner !== identity.value || targetOrder !== orderNo.value) return
+    workflow.value = result; ElMessage.success('已驳回，等待平台重新上传照片')
+  } catch (cause) {
+    if (cause !== 'cancel' && cause !== 'close' && active && owner === identity.value && targetOrder === orderNo.value) confirmError.value = message(cause)
+  } finally { confirming.value = false }
+}
 function search() { if (query.page === 1) void loadList(); else query.page = 1 }
 function resetQuery() { const reload = query.page === 1; Object.assign(query, { page: 1, orderNo: '', purchaseCategory: '', productName: '', status: '' }); if (reload) void loadList() }
-function resetForm() { submitError.value = ''; submittedOrder.value = ''; Object.assign(form, emptyProcurementDraft()); createAttempt = null }
+function resetForm() { submitError.value = ''; submittedOrder.value = ''; Object.assign(form, emptyProcurementDraft()); formRef.value?.clearValidate(); createAttempt = null }
 async function submit() {
   if (submitting.value || !canCreate.value || !identity.value || submittedOrder.value) return
   const owner = identity.value; submitting.value = true; submitError.value = ''
   try {
+    if (!formRef.value || !await formRef.value.validate().catch(() => false)) return
+    if (!active || owner !== identity.value) return
     const payload = buildProcurementCreate(form, companyName.value, '')
     const fingerprint = JSON.stringify([owner, payload])
     if (createAttempt?.fingerprint !== fingerprint) createAttempt = { fingerprint, key: procurementRequestKey() }
+    await requireOrderBudget('procurement', createAttempt.key, Number((payload.budgetUnitPrice * payload.purchaseQuantity).toFixed(2)), payload.currency)
+    if (!active || owner !== identity.value) return
     const result = await createProcurement({ ...payload, idempotencyKey: createAttempt.key })
     if (!active || owner !== identity.value) return
     createAttempt = null; submittedOrder.value = result.order.orderNo; ElMessage.success('采购订单已提交')
     if (canList.value) await router.push({ name: 'cross-border-procurement-detail', params: { orderNo: result.order.orderNo } })
-  } catch (cause) { if (active && owner === identity.value) submitError.value = message(cause) }
+  } catch (cause) { if (/已释放|已过期/.test(message(cause))) createAttempt = null; if (active && owner === identity.value) submitError.value = message(cause) }
   finally { submitting.value = false }
 }
 watch(() => [mode.value, orderNo.value, query.page, query.size, identity.value], (values, previous) => {
@@ -146,9 +177,9 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
       </div>
     </template>
     <section v-else-if="mode === 'detail'" v-loading="loading" class="procurement-detail" aria-label="采购订单详情">
-      <header class="procurement-heading"><div><el-button link type="primary" @click="returnToList">← 返回列表</el-button><h2>{{ detail?.order.orderNo || '采购订单详情' }}</h2></div><div><el-tag v-if="detail" :type="statusTone(workflow?.status || detail.order.status)">{{ statusLabel(workflow?.status || detail.order.status, detail.order.procurementDirection) }}</el-tag><el-button v-if="canConfirm" type="primary" :loading="confirming" @click="confirmReceived">确认采购结果</el-button><el-button :disabled="loading || confirming" @click="loadDetail">刷新</el-button></div></header>
+      <header class="procurement-heading"><div><el-button link type="primary" @click="returnToList">← 返回列表</el-button><h2>{{ detail?.order.orderNo || '采购订单详情' }}</h2></div><div><el-tag v-if="detail" :type="statusTone(workflow?.status || detail.order.status)">{{ statusLabel(workflow?.status || detail.order.status, detail.order.procurementDirection) }}</el-tag><el-button v-if="canConfirm" type="danger" :disabled="confirming" @click="rejectReceived">驳回</el-button><el-button v-if="canConfirm" type="primary" :loading="confirming" @click="confirmReceived">确认采购结果</el-button><el-button :disabled="loading || confirming" @click="loadDetail">刷新</el-button></div></header>
       <div v-if="error" class="procurement-error" role="alert"><span>{{ error }}</span><el-button :disabled="loading" @click="loadDetail">重新加载</el-button></div>
-      <template v-else-if="detail && workflow"><el-alert v-if="confirmError" :title="confirmError" type="error" :closable="false" /><ProcurementDetailPanel :detail="detail" :workflow="workflow" /></template><el-skeleton v-else :rows="8" animated />
+      <template v-else-if="detail && workflow"><el-alert v-if="confirmError" :title="confirmError" type="error" :closable="false" /><el-alert v-if="workflow.rejectionReason" title="采购结果驳回原因" :description="workflow.rejectionReason" type="warning" :closable="false" /><ProcurementDetailPanel :detail="detail" :workflow="workflow" /></template><el-skeleton v-else :rows="8" animated />
     </section>
     <section v-else class="procurement-create" aria-label="采购下单">
       <header class="procurement-create-heading">
@@ -182,18 +213,18 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
             <div class="procurement-summary-value">{{ form.currency }}<small>{{ summaryCurrencyName }}</small></div>
           </article>
         </section>
-        <el-form :model="form" label-position="top" :disabled="submitting" @submit.prevent="submit">
+        <el-form ref="formRef" :model="form" :rules="formRules" label-position="top" :disabled="submitting" scroll-to-error @submit.prevent="submit">
           <section class="procurement-form-section" aria-labelledby="procurement-product-heading">
             <h3 id="procurement-product-heading"><span class="procurement-section-dot" aria-hidden="true" />商品与预算</h3>
             <div class="procurement-form-card">
-              <el-form-item class="procurement-direction" label="采购方向" for="procurement-direction" required><el-select id="procurement-direction" v-model="form.procurementDirection" popper-class="procurement-create-select"><el-option v-for="(label, value) in procurementDirections" :key="value" :label="label" :value="value" /></el-select></el-form-item>
+              <el-form-item class="procurement-direction" label="采购方向" for="procurement-direction" prop="procurementDirection" required><el-select id="procurement-direction" v-model="form.procurementDirection" popper-class="procurement-create-select"><el-option v-for="(label, value) in procurementDirections" :key="value" :label="label" :value="value" /></el-select></el-form-item>
               <div class="procurement-form-grid">
                 <el-form-item label="采购品类" for="procurement-category"><el-input id="procurement-category" v-model.trim="form.purchaseCategory" maxlength="128" placeholder="请输入品类" /></el-form-item>
-                <el-form-item label="商品名称" for="procurement-product" required><el-input id="procurement-product" v-model.trim="form.productName" maxlength="255" placeholder="请输入商品名称" /></el-form-item>
+                <el-form-item label="商品名称" for="procurement-product" prop="productName" required><el-input id="procurement-product" v-model.trim="form.productName" maxlength="255" placeholder="请输入商品名称" /></el-form-item>
                 <el-form-item label="商品规格" for="procurement-specification"><el-input id="procurement-specification" v-model.trim="form.productSpecification" maxlength="500" placeholder="规格、型号" /></el-form-item>
-                <el-form-item label="采购数量（件）" for="procurement-quantity" required><el-input id="procurement-quantity" v-model.trim="form.purchaseQuantity" inputmode="numeric" maxlength="18" placeholder="正整数" /></el-form-item>
-                <el-form-item label="预算单价" for="procurement-price" required><el-input id="procurement-price" v-model.trim="form.budgetUnitPrice" inputmode="decimal" maxlength="20" placeholder="请明确填写；免费样品填 0" /></el-form-item>
-                <el-form-item label="预算币种" for="procurement-currency" required><el-select id="procurement-currency" v-model="form.currency" popper-class="procurement-create-select"><el-option label="美元 USD" value="USD" /><el-option label="人民币 CNY" value="CNY" /></el-select></el-form-item>
+                <el-form-item label="采购数量（件）" for="procurement-quantity" prop="purchaseQuantity" required><el-input id="procurement-quantity" v-model.trim="form.purchaseQuantity" inputmode="numeric" maxlength="18" placeholder="正整数" /></el-form-item>
+                <el-form-item label="预算单价" for="procurement-price" prop="budgetUnitPrice" required><el-input id="procurement-price" v-model.trim="form.budgetUnitPrice" inputmode="decimal" maxlength="20" placeholder="请明确填写；免费样品填 0" /></el-form-item>
+                <el-form-item label="预算币种" for="procurement-currency" prop="currency" required><el-select id="procurement-currency" v-model="form.currency" popper-class="procurement-create-select"><el-option label="美元 USD" value="USD" /><el-option label="人民币 CNY" value="CNY" /></el-select></el-form-item>
                 <el-form-item class="full" label="商品链接" for="procurement-url"><el-input id="procurement-url" v-model.trim="form.productUrl" maxlength="2000" placeholder="https://..." /></el-form-item>
               </div>
               <div class="procurement-budget-total">货款预算总上限：{{ money(budgetTotal, form.currency) }}</div>
@@ -202,9 +233,9 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
           <section class="procurement-form-section" aria-labelledby="procurement-recipient-heading">
             <h3 id="procurement-recipient-heading"><span class="procurement-section-dot procurement-section-dot--recipient" aria-hidden="true" />{{ regionText('最终国内收件资料', form.procurementDirection) }}</h3>
             <div class="procurement-form-card procurement-form-grid">
-              <el-form-item label="收件人" for="procurement-contact" required><el-input id="procurement-contact" v-model.trim="form.contactName" maxlength="128" placeholder="实际收件人姓名" /></el-form-item>
-              <el-form-item label="联系电话" for="procurement-phone" required><el-input id="procurement-phone" v-model.trim="form.contactPhone" maxlength="64" type="tel" placeholder="快递可联系的电话" /></el-form-item>
-              <el-form-item class="full" :label="regionText('完整国内地址', form.procurementDirection)" for="procurement-address" required><el-input id="procurement-address" v-model.trim="form.receivingAddress" maxlength="1000" :placeholder="form.procurementDirection === 'DOMESTIC_TO_OVERSEAS' ? '国家、州/省、市、邮编及详细地址' : '省、市、区县、街道及详细门牌'" /></el-form-item>
+              <el-form-item label="收件人" for="procurement-contact" prop="contactName" required><el-input id="procurement-contact" v-model.trim="form.contactName" maxlength="128" placeholder="实际收件人姓名" /></el-form-item>
+              <el-form-item label="联系电话" for="procurement-phone" prop="contactPhone" required><el-input id="procurement-phone" v-model.trim="form.contactPhone" maxlength="64" type="tel" placeholder="快递可联系的电话" /></el-form-item>
+              <el-form-item class="full" :label="regionText('完整国内地址', form.procurementDirection)" for="procurement-address" prop="receivingAddress" required><el-input id="procurement-address" v-model.trim="form.receivingAddress" maxlength="1000" :placeholder="form.procurementDirection === 'DOMESTIC_TO_OVERSEAS' ? '国家、州/省、市、邮编及详细地址' : '省、市、区县、街道及详细门牌'" /></el-form-item>
               <el-form-item class="full" label="采购要求" for="procurement-requirements">
                 <el-input id="procurement-requirements" v-model="form.remark" type="textarea" :rows="4" maxlength="1000" resize="vertical" aria-describedby="procurement-requirements-count" />
                 <div id="procurement-requirements-count" class="procurement-character-count">{{ form.remark.length }} / 1000</div>
@@ -236,7 +267,7 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
   --client-font-size: 14px;
   --el-color-primary: #2f7bff;
   --el-text-color-regular: #1f2937;
-  --el-text-color-placeholder: #6b7280;
+  --el-text-color-placeholder: #b0b7c3;
   min-width: 0;
   color: #1f2937;
   font: 14px/1.5 "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
@@ -265,14 +296,16 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
 .procurement-create :deep(.el-form-item__label) { height: auto; margin-bottom: 6px; padding: 0; color: #374151; font-size: 14px; font-weight: 600; line-height: 20px; }
 .procurement-create :deep(.el-form-item.is-required .el-form-item__label::before) { color: #e5484d; }
 .procurement-create :deep(.el-form-item__content) { min-width: 0; line-height: 20px; }
+.procurement-create :deep(.el-form-item__error) { position: absolute; top: auto; bottom: calc(100% + 6px); right: 0; left: auto; width: auto; max-width: calc(100% - 120px); padding: 0; font-size: 12px; line-height: 20px; text-align: right; }
 .procurement-create :deep(.procurement-direction) { width: calc((100% - 40px) / 3); margin-bottom: 12px; }
 .procurement-create :deep(.el-select) { width: 100%; }
 .procurement-create :deep(.el-input__wrapper), .procurement-create :deep(.el-select__wrapper), .procurement-create :deep(.el-textarea__inner) { border: 1px solid #d5dce8; border-radius: 6px; background: #fff; box-shadow: none; font-family: inherit; font-size: 14px; }
 .procurement-create :deep(.el-input__wrapper), .procurement-create :deep(.el-select__wrapper) { min-height: 44px; padding: 10px 14px; }
 .procurement-create :deep(.el-input__inner) { height: 22px; color: #1f2937; line-height: 22px; }
 .procurement-create :deep(.el-textarea__inner) { min-height: 110px !important; padding: 11px 14px; color: #1f2937; line-height: 20px; }
-.procurement-create :deep(.el-input__inner::placeholder), .procurement-create :deep(.el-textarea__inner::placeholder) { color: #6b7280; }
+.procurement-create :deep(.el-input__inner::placeholder), .procurement-create :deep(.el-textarea__inner::placeholder) { color: var(--el-text-color-placeholder); opacity: 1; }
 .procurement-create :deep(.el-input__wrapper.is-focus), .procurement-create :deep(.el-select__wrapper.is-focused), .procurement-create :deep(.el-textarea__inner:focus) { outline: 2px solid #2f7bff; outline-offset: 0; }
+.procurement-create :deep(.el-form-item.is-error .el-input__wrapper), .procurement-create :deep(.el-form-item.is-error .el-select__wrapper), .procurement-create :deep(.el-form-item.is-error .el-textarea__inner) { border-color: #e5484d; box-shadow: none; }
 .procurement-create :deep(.el-input.is-disabled .el-input__wrapper), .procurement-create :deep(.el-select__wrapper.is-disabled), .procurement-create :deep(.el-textarea.is-disabled .el-textarea__inner) { background: #f6f9ff; }
 .procurement-character-count { width: 100%; margin-top: 4px; color: #6b7280; font-size: 13px; text-align: right; }
 .procurement-budget-total { margin-top: 10px; color: #6b7280; font-size: 13px; line-height: 20px; overflow-wrap: anywhere; }

src/modules/overseas-warehouse/api/warehouseServices.ts

@@ -132,7 +132,7 @@ export function getDiscard(discardNo: string) {
 export function listDiscardCandidates(inboundCode?: string) {
   return apiRequest<DiscardCandidate[]>({ method: 'GET', url: '/merchant/v1/last-leg/cargo-discards/inventory-candidates', params: { inboundCode: inboundCode || undefined } })
 }
-export function createDiscard(payload: { items: Array<{ orderId?: string; returnCartonId?: string; inventoryPositionId?: string; cartonIds?: string[]; skuCode: string; discardPackages: number }>; idempotencyKey: string; remark?: string }) {
+export function createDiscard(payload: { items: Array<{ orderId?: string; returnCartonId?: string; inventoryPositionId?: string; cartonIds?: string[]; skuCode: string; discardPackages: number }>; idempotencyKey: string; remark?: string; requestedPackages?: number }) {
   return apiRequest<Record<string, unknown>>({ method: 'POST', url: '/merchant/v1/last-leg/cargo-discards', data: payload })
 }
 export function cancelDiscard(discardNo: string) {

src/modules/overseas-warehouse/views/ReturnOrdersView.test.mjs

@@ -2,6 +2,7 @@ import assert from 'node:assert/strict'
 import { readFileSync } from 'node:fs'
 import test from 'node:test'
 import ts from 'typescript'
+import { createRequire } from 'node:module'
 
 const view = readFileSync(new URL('./ReturnOrdersView.vue', import.meta.url), 'utf8')
 const api = readFileSync(new URL('../api/returnOrders.ts', import.meta.url), 'utf8')
@@ -118,7 +119,7 @@ test('新建退货预报使用独立路由页面，编辑仍保留加宽弹框',
 
 test('新建预报铺满工作区，基础字段等宽对齐且数量输入保持紧凑', () => {
   assert.match(view, /return-create-surface \{ width:100%; min-width:0;[^}]*margin:0;/)
-  assert.match(view, /<el-form label-width="130px" class="return-create-form">/)
+  assert.match(view, /<el-form ref="createFormRef"[^>]*:model="form"[^>]*:rules="createFormRules"[^>]*label-position="top"/)
   assert.match(view, /return-create-form :deep\(\.el-input\), \.return-create-body \.return-create-form :deep\(\.el-select\) \{ width:100%; max-width:none;/)
   assert.match(view, /:deep\(\.el-table \.el-input-number\) \{ width:120px;/)
   assert.match(view, /<el-table class="return-forecast-table"[^>]*>/)
@@ -314,3 +315,37 @@ test('贴标入口保留完成入库门禁与退货来源，箱号只作为目
     { name: 'overseas-labeling-create', query: { returnNo: 'RT-TEST', warehouseId: 'WH-TEST', cartonMark: 'RC-TEST' } },
   ])
 })
+
+test('新增退货校验海外仓与联系人，空白联系人无效，客户参考号可选', async () => {
+  const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
+  const source = view.slice(view.indexOf('const createFormRules:'), view.indexOf('const selectedOperationWarehouse ='))
+  const code = ts.transpileModule(source, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
+  const rules = new Function(code + '\nreturn createFormRules')()
+  const validator = new Schema(rules)
+  await assert.rejects(validator.validate({ overseasWarehouseId: '', warehouseContactName: ' ', warehouseContactPhone: '' }), error => {
+    assert.deepEqual(Object.keys(error.fields).sort(), ['overseasWarehouseId', 'warehouseContactName', 'warehouseContactPhone'])
+    return true
+  })
+  await validator.validate({ overseasWarehouseId: 'WH', warehouseContactName: 'Contact', warehouseContactPhone: '123456', customerReferenceNo: '' })
+})
+
+test('新增校验失败或正在提交时不继续创建，编辑保持既有校验路径', async () => {
+  const start = view.indexOf('async function submit()')
+  const end = view.indexOf('  const items =', start)
+  const code = view.slice(start, end) + '\nreturn "continue"\n}'
+  const creating = { value: false }, props = { createPage: true }
+  let validations = 0
+  const formRef = { value: { validate: async () => { validations++; throw new Error('required') } } }
+  const submit = new Function('creating', 'props', 'createFormRef', code + '\nreturn submit')(creating, props, formRef)
+  assert.equal(await submit(), undefined)
+  assert.equal(validations, 1)
+  creating.value = true
+  assert.equal(await submit(), undefined)
+  assert.equal(validations, 1)
+  creating.value = false
+  props.createPage = false
+  assert.equal(await submit(), 'continue')
+  props.createPage = true
+  formRef.value.validate = async () => true
+  assert.equal(await submit(), 'continue')
+})

src/modules/overseas-warehouse/views/ReturnOrdersView.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, onActivated, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue'
-import { ElMessage } from 'element-plus'
+import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
 import { ArrowLeft, ChevronDown, Plus } from '@lucide/vue'
 import { useRoute, useRouter } from 'vue-router'
 import QueryToolbar, { type QueryField, type QueryModel } from '@/components/common/QueryToolbar.vue'
@@ -97,6 +97,12 @@ interface SkuDraft { id: number; skuCode: string; productNameZh: string; expecte
 let skuSequence = 0
 function emptySku(): SkuDraft { return { id: ++skuSequence, skuCode: '', productNameZh: '', expectedQuantity: 1 } }
 const form = reactive({ overseasWarehouseId: '', warehouseContactName: '', warehouseContactPhone: '', customerReferenceNo: '', remark: '', needRelabel: false, items: [emptySku()] })
+const createFormRef = ref<FormInstance>()
+const createFormRules: FormRules = {
+  overseasWarehouseId: [{ required: true, message: '请选择海外仓', trigger: 'change' }],
+  warehouseContactName: [{ required: true, whitespace: true, message: '请输入联系人', trigger: 'blur' }],
+  warehouseContactPhone: [{ required: true, whitespace: true, message: '请输入联系电话', trigger: 'blur' }],
+}
 const selectedOperationWarehouse = computed(() => operationWarehouses.value.find(item => String(item.id) === form.overseasWarehouseId))
 function normalizedSku(value: string) { return value.trim().toUpperCase() }
 const duplicateSkuIds = computed(() => {
@@ -107,7 +113,7 @@ const duplicateSkuIds = computed(() => {
   }
   return new Set([...grouped.values()].filter(ids => ids.length > 1).flat())
 })
-function resetForm() { Object.assign(form, { overseasWarehouseId: '', warehouseContactName: '', warehouseContactPhone: '', customerReferenceNo: '', remark: '', needRelabel: false, items: [emptySku()] }) }
+function resetForm() { createFormRef.value?.clearValidate(); Object.assign(form, { overseasWarehouseId: '', warehouseContactName: '', warehouseContactPhone: '', customerReferenceNo: '', remark: '', needRelabel: false, items: [emptySku()] }) }
 function warehouseLabel(warehouse: MerchantWarehouse) { return `${warehouse.warehouseName} · ${warehouse.warehouseCode}` }
 function operationWarehouseLabel(warehouseId: string) {
   const warehouse = operationWarehouses.value.find(item => String(item.id) === String(warehouseId))
@@ -117,6 +123,7 @@ function selectOperationWarehouse() {
   const warehouse = operationWarehouses.value.find(item => String(item.id) === form.overseasWarehouseId)
   form.warehouseContactName = warehouse?.contactName || ''
   form.warehouseContactPhone = warehouse?.contactPhone || ''
+  if (props.createPage) createFormRef.value?.clearValidate(['warehouseContactName', 'warehouseContactPhone'])
 }
 async function loadOperationWarehouses() {
   operationWarehousesLoading.value = true
@@ -251,6 +258,8 @@ function openRelabel(order: Pick<ReturnOrderSummary, 'returnNo' | 'overseasWareh
   void router.push({ name: 'overseas-labeling-create', query: { returnNo: order.returnNo, warehouseId: String(order.overseasWarehouseId), ...(cartonMark ? { cartonMark } : {}) } })
 }
 async function submit() {
+  if (creating.value) return
+  if (props.createPage && !await createFormRef.value?.validate().catch(() => false)) return
   const items = form.items.map(({ skuCode, productNameZh, expectedQuantity }) => ({ skuCode: skuCode.trim(), productNameZh: productNameZh.trim(), expectedQuantity }))
   if (!form.overseasWarehouseId || items.some(item => !item.skuCode || item.expectedQuantity <= 0)) { ElMessage.warning('请填写操作仓、SKU 和预报数量'); return }
   if (!form.warehouseContactName.trim() || !form.warehouseContactPhone.trim()) { ElMessage.warning('请填写海外仓联系人和联系电话'); return }
@@ -314,30 +323,38 @@ onBeforeUnmount(clearPhotoUrls)
 </script>
 
 <template>
-  <section class="return-orders-page">
+  <section class="return-orders-page" :class="{ 'return-orders-create client-ui': props.createPage }">
     <template v-if="props.createPage">
       <article class="return-create-surface">
         <header class="return-create-header">
           <div><h2>新建退货预报</h2></div>
           <el-button @click="returnToList"><ArrowLeft :size="16" />返回列表</el-button>
         </header>
-        <div class="return-create-body">
-          <el-form label-width="130px" class="return-create-form">
-            <el-form-item label="海外仓" required><el-select v-model="form.overseasWarehouseId" filterable clearable :loading="operationWarehousesLoading" :disabled="Boolean(operationWarehousesError)" placeholder="" @change="selectOperationWarehouse"><el-option v-for="warehouse in operationWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="String(warehouse.id)" /></el-select><div v-if="operationWarehousesError" class="warehouse-error">{{ operationWarehousesError }}</div></el-form-item>
-            <el-form-item label="客户参考号"><el-input v-model="form.customerReferenceNo" placeholder="" /></el-form-item>
-            <el-form-item label="海外仓联系人" required><el-input v-model="form.warehouseContactName" :readonly="Boolean(selectedOperationWarehouse?.contactName)" placeholder="" /></el-form-item>
-            <el-form-item label="海外仓联系电话" required><el-input v-model="form.warehouseContactPhone" :readonly="Boolean(selectedOperationWarehouse?.contactPhone)" placeholder="" /></el-form-item>
-            <el-form-item label="备注" class="return-form-wide"><el-input v-model="form.remark" type="textarea" :rows="2" placeholder="" /></el-form-item>
-          </el-form>
-          <div class="items-title"><span>SKU 预报明细</span><el-button text type="primary" @click="addItem"><Plus :size="15" />添加 SKU</el-button></div>
-          <div class="return-relabel-option"><span>是否换标</span><el-radio-group v-model="form.needRelabel" aria-label="是否换标"><el-radio-button :value="false">不换标</el-radio-button><el-radio-button :value="true">需要换标</el-radio-button></el-radio-group></div>␍          <el-table class="return-forecast-table" :data="form.items" row-key="id" size="small">
-            <el-table-column label="操作" width="80" fixed="left"><template #default="{ $index }"><el-button link type="danger" :disabled="form.items.length === 1" @click="removeItem($index)">删除</el-button></template></el-table-column>
-            <el-table-column label="SKU" width="300"><template #default="{ row }"><div><el-input v-model="row.skuCode" :class="{ 'duplicate-sku-input': duplicateSkuIds.has(row.id) }" placeholder="" @blur="row.skuCode = row.skuCode.trim()" /><div v-if="duplicateSkuIds.has(row.id)" class="duplicate-sku-error">该 SKU 已在明细中填写</div></div></template></el-table-column>
-            <el-table-column label="中文品名" min-width="320"><template #default="{ row }"><el-input v-model="row.productNameZh" placeholder="" /></template></el-table-column>
-            <el-table-column label="预报数量" width="150"><template #default="{ row }"><el-input-number v-model="row.expectedQuantity" :min="1" controls-position="right" placeholder="" /></template></el-table-column>
-          </el-table>
-        </div>
-        <footer class="return-create-actions"><el-button @click="cancelCreate">取消</el-button><el-button type="primary" :loading="creating" @click="submit">提交预报</el-button></footer>
+        <el-form ref="createFormRef" class="return-create-body" :model="form" :rules="createFormRules" label-position="top" :disabled="creating" scroll-to-error @submit.prevent="submit">
+          <section class="return-create-section">
+            <h3>基础信息</h3>
+            <div class="return-create-form">
+              <el-form-item label="海外仓" prop="overseasWarehouseId"><el-select v-model="form.overseasWarehouseId" filterable clearable :loading="operationWarehousesLoading" :disabled="Boolean(operationWarehousesError)" placeholder="请选择海外仓" popper-class="return-create-popper" @change="selectOperationWarehouse"><el-option v-for="warehouse in operationWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="String(warehouse.id)" /></el-select><div v-if="operationWarehousesError" class="warehouse-error">{{ operationWarehousesError }}</div></el-form-item>
+              <el-form-item label="海外仓联系人" prop="warehouseContactName"><el-input v-model="form.warehouseContactName" :readonly="Boolean(selectedOperationWarehouse?.contactName)" placeholder="请输入海外仓联系人" /></el-form-item>
+              <el-form-item label="海外仓联系电话" prop="warehouseContactPhone"><el-input v-model="form.warehouseContactPhone" type="tel" :readonly="Boolean(selectedOperationWarehouse?.contactPhone)" placeholder="请输入海外仓联系电话" /></el-form-item>
+              <el-form-item label="客户参考号"><el-input v-model="form.customerReferenceNo" placeholder="请输入客户参考号（选填）" /></el-form-item>
+              <el-form-item label="备注" class="return-form-wide"><el-input v-model="form.remark" type="textarea" :rows="3" resize="vertical" placeholder="请输入退货要求或其他补充信息（选填）" /></el-form-item>
+            </div>
+          </section>
+          <section class="return-create-section">
+            <div class="items-title"><h3>SKU 预报明细</h3><el-button type="primary" @click="addItem"><Plus :size="15" />添加 SKU</el-button></div>
+            <div class="return-create-card">
+              <div class="return-relabel-option"><span>是否换标</span><el-radio-group v-model="form.needRelabel" aria-label="是否换标"><el-radio-button :value="false">不换标</el-radio-button><el-radio-button :value="true">需要换标</el-radio-button></el-radio-group></div>
+              <el-table class="return-forecast-table" :data="form.items" row-key="id" size="small">
+                <el-table-column label="操作" width="80" fixed="left"><template #default="{ $index }"><el-button link type="danger" :disabled="form.items.length === 1" @click="removeItem($index)">删除</el-button></template></el-table-column>
+                <el-table-column label="SKU" width="300"><template #default="{ row }"><div><el-input v-model="row.skuCode" :class="{ 'duplicate-sku-input': duplicateSkuIds.has(row.id) }" placeholder="请输入 SKU" @blur="row.skuCode = row.skuCode.trim()" /><div v-if="duplicateSkuIds.has(row.id)" class="duplicate-sku-error">该 SKU 已在明细中填写</div></div></template></el-table-column>
+                <el-table-column label="中文品名" min-width="320"><template #default="{ row }"><el-input v-model="row.productNameZh" placeholder="请输入中文品名（选填）" /></template></el-table-column>
+                <el-table-column label="预报数量" width="150"><template #default="{ row }"><el-input-number v-model="row.expectedQuantity" :min="1" controls-position="right" placeholder="请输入数量" /></template></el-table-column>
+              </el-table>
+            </div>
+          </section>
+        </el-form>
+        <footer class="return-create-actions"><el-button :disabled="creating" @click="cancelCreate">返回列表</el-button><el-button type="primary" :loading="creating" @click="submit">提交预报</el-button></footer>
       </article>
     </template>
 
@@ -600,3 +617,50 @@ onBeforeUnmount(clearPhotoUrls)
 @media (max-width: 900px) { .return-photo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
 @media (max-width: 720px) { .return-detail-header { grid-template-columns:1fr auto; } .return-back { grid-column:1/-1; } .return-pagination { padding:12px; } .return-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
 </style>
+
+<style scoped>
+.return-orders-create { --el-color-primary: #2f7bff; --el-text-color-regular: #1f2937; --el-text-color-placeholder: #b0b7c3; width: 100%; min-width: 0; background: #f4f7fc; color: #1f2937; font: 14px/1.5 "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; }
+.return-orders-create .return-create-surface { min-height: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; }
+.return-orders-create .return-create-header { min-height: 44px; margin-bottom: 12px; padding: 0; border: 0; }
+.return-orders-create .return-create-header h2 { color: #1f2937; font-size: 26px; font-weight: 700; }
+.return-orders-create .return-create-body { padding: 0; }
+.return-orders-create .return-create-section { margin-bottom: 12px; }
+.return-orders-create .return-create-section h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; color: #1f2937; font-size: 18px; font-weight: 700; }
+.return-orders-create .return-create-section h3::before { content: ''; width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #2f7bff; }
+.return-orders-create .return-create-section:nth-of-type(2) h3::before { background: #0ea5a4; }
+.return-orders-create .return-create-form,
+.return-orders-create .return-create-card { min-width: 0; padding: 16px; box-sizing: border-box; border: 1px solid #e3e8f0; border-radius: 10px; background: #fff; }
+.return-orders-create .return-create-form { --el-component-size: 44px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 20px; }
+.return-orders-create .return-create-form :deep(.el-form-item) { min-width: 0; margin: 0; }
+.return-orders-create .return-create-form :deep(.el-form-item__label) { height: auto; margin: 0 0 6px; padding: 0; color: #374151; font-size: 14px; font-weight: 600; line-height: 20px; }
+.return-orders-create .return-create-form :deep(.el-form-item.is-required .el-form-item__label::before) { color: #e5484d; }
+.return-orders-create .return-create-form :deep(.el-form-item__content) { min-width: 0; line-height: 20px; }
+.return-orders-create .return-create-form :deep(.el-form-item__error) { position: absolute; top: auto; bottom: calc(100% + 6px); right: 0; left: auto; width: auto; max-width: calc(100% - 140px); padding: 0; font-size: 12px; line-height: 20px; text-align: right; }
+.return-orders-create :deep(.el-input__wrapper),
+.return-orders-create :deep(.el-select__wrapper),
+.return-orders-create :deep(.el-textarea__inner) { border: 1px solid #d5dce8; border-radius: 6px; box-shadow: none; }
+.return-orders-create .return-create-form :deep(.el-input__wrapper),
+.return-orders-create .return-create-form :deep(.el-select__wrapper) { min-height: 44px; box-sizing: border-box; padding: 10px 14px; }
+.return-orders-create .return-create-form :deep(.el-input__inner) { height: 22px; color: #1f2937; font-size: 14px; line-height: 22px; }
+.return-orders-create .return-create-form :deep(.el-textarea__inner) { min-height: 110px !important; padding: 11px 14px; color: #1f2937; font-size: 14px; line-height: 20px; }
+.return-orders-create :deep(.el-input__inner::placeholder),
+.return-orders-create :deep(.el-textarea__inner::placeholder),
+.return-orders-create :deep(.el-select__placeholder.is-transparent) { color: #b0b7c3; opacity: 1; }
+.return-orders-create :deep(.el-input__wrapper.is-focus),
+.return-orders-create :deep(.el-select__wrapper.is-focused),
+.return-orders-create :deep(.el-textarea__inner:focus) { outline: 2px solid #2f7bff; outline-offset: 0; }
+.return-orders-create :deep(.is-error .el-input__wrapper),
+.return-orders-create :deep(.is-error .el-select__wrapper),
+.return-orders-create :deep(.duplicate-sku-input .el-input__wrapper) { border-color: #e5484d; box-shadow: none; }
+.return-orders-create .items-title { margin: 0 0 10px; }
+.return-orders-create .items-title h3 { margin: 0; }
+.return-orders-create .return-relabel-option { margin: 0 0 12px; color: #374151; }
+.return-orders-create .return-relabel-option :deep(.el-radio-button__inner) { box-shadow: none; }
+.return-orders-create .return-create-actions { gap: 12px; padding: 0; border: 0; background: transparent; }
+.return-orders-create :deep(.el-button) { box-shadow: none; }
+.return-orders-create .return-create-header :deep(.el-button),
+.return-orders-create .return-create-actions :deep(.el-button) { min-height: 44px; margin-left: 0; padding: 10px 18px; border: 1px solid #d5dce8; border-radius: 6px; background: #fff; color: #1d5fe0; font-size: 14px; font-weight: 600; }
+.return-orders-create .return-create-actions :deep(.el-button--primary) { padding: 12px 28px; border-color: #2f7bff; background: #2f7bff; color: #fff; }
+.return-orders-create .return-create-actions :deep(.el-button.is-disabled) { opacity: .55; }
+:global(.return-create-popper.el-popper) { border: 1px solid #e3e8f0; border-radius: 6px; box-shadow: none; }
+</style>

src/modules/overseas-warehouse/views/labelingCreateForm.test.mjs

@@ -0,0 +1,67 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+import { readFileSync } from 'node:fs'
+import { createRequire } from 'node:module'
+import { computed, reactive, ref } from 'vue'
+import ts from 'typescript'
+
+const source = readFileSync(new URL('./WarehouseServiceView.vue', import.meta.url), 'utf8')
+const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
+const rulesSource = source.slice(source.indexOf('const labelingFormRules ='), source.indexOf('const orderInfoCollapsed ='))
+const rulesCode = ts.transpileModule(rulesSource, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
+function harness(mode = 'carton', patch = {}) {
+  const labelingMode = ref(mode)
+  const form = reactive({ warehouse: 'warehouse-a', sourceOrder: 'source-a', contact: '联系人', phone: '12345678', labelDeadline: '2026-11-10T12:00:00', destination: 'FBA-A', deliveryMethod: 'TRUCK', relabel: false, ...patch })
+  const rules = new Function('computed', 'labelingMode', 'form', `${rulesCode}\nreturn labelingFormRules`)(computed, labelingMode, form)
+  return { form, labelingMode, validate: () => new Schema(rules.value).validate(form) }
+}
+
+test('order information reports every missing required field and rejects whitespace contacts', async () => {
+  const state = harness('carton', { warehouse: '', sourceOrder: '', contact: '  ', phone: ' ', labelDeadline: '', destination: '', deliveryMethod: '' })
+  await assert.rejects(state.validate(), error => {
+    assert.deepEqual(Object.keys(error.fields).sort(), ['warehouse', 'sourceOrder', 'contact', 'phone', 'labelDeadline', 'destination', 'deliveryMethod'].sort())
+    return true
+  })
+})
+
+test('SKU-only labeling excludes hidden destination and delivery requirements', async () => {
+  const state = harness('sku', { destination: '', deliveryMethod: '' })
+  await state.validate()
+  state.labelingMode.value = 'carton_and_sku'
+  await assert.rejects(state.validate(), error => Object.keys(error.fields).sort().join(',') === 'deliveryMethod,destination')
+})
+
+test('shipping label file is required only when express printing is selected', async () => {
+  const state = harness('carton', { deliveryMethod: 'EXPRESS', relabel: true })
+  await assert.rejects(state.validate(), error => Boolean(error.fields.shippingLabelFile))
+  state.form.shippingLabelFile = new File(['label'], 'label.pdf', { type: 'application/pdf' })
+  await state.validate()
+  state.form.shippingLabelFile = null
+  state.form.relabel = false
+  await state.validate()
+  state.form.relabel = true
+  state.form.deliveryMethod = 'TRUCK'
+  await state.validate()
+  state.form.deliveryMethod = 'EXPRESS'
+  state.labelingMode.value = 'sku'
+  await state.validate()
+})
+
+test('invalid create fields expand the order section and stop before submission logic', async () => {
+  const start = source.indexOf("async function submit(action:")
+  const end = source.indexOf("  if (props.service === 'transfer' && inventoryTransfer.value", start)
+  const preamble = source.slice(start, end) + '\nreturn "continue"\n}'
+  const code = ts.transpileModule(preamble, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
+  const collapsed = ref(true), saving = ref(false), isLabelingCreate = ref(true)
+  let validations = 0
+  const formRef = ref({ validate: async () => { validations++; throw new Error('invalid') } })
+  const submit = new Function('saving', 'isLabelingCreate', 'orderInfoCollapsed', 'nextTick', 'labelingFormRef', `${code}\nreturn submit`)(saving, isLabelingCreate, collapsed, async () => {}, formRef)
+  assert.equal(await submit(), undefined)
+  assert.equal(collapsed.value, false)
+  assert.equal(validations, 1)
+  isLabelingCreate.value = false
+  assert.equal(await submit(), 'continue')
+  assert.equal(validations, 1)
+  saving.value = true
+  assert.equal(await submit(), undefined)
+})

src/modules/overseas-warehouse/views/transferCreateForm.test.mjs

@@ -0,0 +1,77 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+import { readFileSync } from 'node:fs'
+import { createRequire } from 'node:module'
+import { computed, reactive, ref } from 'vue'
+import ts from 'typescript'
+
+const source = readFileSync(new URL('./WarehouseServiceView.vue', import.meta.url), 'utf8')
+const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
+const ruleSource = source.slice(source.indexOf('const transferFormRules ='), source.indexOf('watch([inventoryTransfer,'))
+const code = ts.transpileModule(ruleSource, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
+function harness(patch = {}) {
+  const form = reactive({ warehouse: 'WH', deliveryMethod: 'WAREHOUSE_PICKUP', address: 'Street 1', pickupContact: 'Contact', pickupPhone: '123456', estimatedArrivalAt: '2026-11-01T12:00:00', relabel: false, ...patch })
+  const inventoryTransfer = ref(false), transferDestinationType = ref('NONE'), labelingMode = ref('carton')
+  const rules = new Function('computed', 'inventoryTransfer', 'transferDestinationType', 'labelingMode', 'form', code + '\nreturn transferFormRules')(computed, inventoryTransfer, transferDestinationType, labelingMode, form)
+  return { form, inventoryTransfer, transferDestinationType, labelingMode, validate: () => new Schema(rules.value).validate(form) }
+}
+const hasFields = (...fields) => error => {
+  assert.deepEqual(Object.keys(error.fields).sort(), fields.sort())
+  return true
+}
+
+test('pickup requires contact and phone; customer delivery hides those requirements', async () => {
+  const state = harness({ pickupContact: ' ', pickupPhone: '' })
+  await assert.rejects(state.validate(), hasFields('pickupContact', 'pickupPhone'))
+  state.form.deliveryMethod = 'CUSTOMER_DELIVERY'
+  await state.validate()
+  state.form.address = ''
+  await assert.rejects(state.validate(), hasFields('address'))
+})
+
+test('inventory transfer excludes inbound address, arrival and pickup fields', async () => {
+  const state = harness({ deliveryMethod: '', address: '', estimatedArrivalAt: '', pickupContact: '', pickupPhone: '' })
+  state.inventoryTransfer.value = true
+  await state.validate()
+  state.form.warehouse = ''
+  await assert.rejects(state.validate(), hasFields('warehouse'))
+})
+
+test('destination switch validates only FBA or private warehouse fields currently visible', async () => {
+  const state = harness()
+  await state.validate()
+  state.transferDestinationType.value = 'FBA'
+  await assert.rejects(state.validate(), hasFields('destination'))
+  state.transferDestinationType.value = 'PRIVATE'
+  await assert.rejects(state.validate(), hasFields('privateDestinationAddress', 'privateDestinationPostalCode', 'privateDestinationContact', 'privateDestinationPhone'))
+  Object.assign(state.form, { privateDestinationAddress: 'Private street', privateDestinationPostalCode: '10000', privateDestinationContact: 'Person', privateDestinationPhone: '123456' })
+  await state.validate()
+  state.transferDestinationType.value = 'NONE'
+  await state.validate()
+})
+
+test('relabeling requires its visible fields, with no delivery method for SKU-only mode', async () => {
+  const state = harness({ relabel: true })
+  await assert.rejects(state.validate(), hasFields('labelDeadline', 'relabelContact', 'relabelPhone', 'relabelDeliveryMethod', 'relabelDestination'))
+  Object.assign(state.form, { labelDeadline: '2026-11-01T12:00:00', relabelContact: 'Contact', relabelPhone: '123456', relabelDestination: 'FBA-A' })
+  state.labelingMode.value = 'sku'
+  await state.validate()
+  state.labelingMode.value = 'carton_and_sku'
+  await assert.rejects(state.validate(), hasFields('relabelDeliveryMethod'))
+  state.form.relabel = false
+  await state.validate()
+})
+
+test('draft and submit stop before business requests when create validation fails; edit remains unchanged', async () => {
+  const start = source.indexOf('  if (isTransferCreate.value) {', source.indexOf('async function submit('))
+  const end = source.indexOf('  const primaryWarehouse =', start)
+  const code = 'return async function submit(action) {' + source.slice(start, end) + '\nreturn action\n}'
+  const isTransferCreate = ref(true)
+  const labelingFormRef = ref({ validate: async () => { throw new Error('required') } })
+  const submit = new Function('isTransferCreate', 'labelingFormRef', 'nextTick', code)(isTransferCreate, labelingFormRef, async () => {})
+  assert.equal(await submit('draft'), undefined)
+  assert.equal(await submit('submit'), undefined)
+  isTransferCreate.value = false
+  assert.equal(await submit('draft'), 'draft')
+  assert.equal(await submit('submit'), 'submit')
+})

src/modules/overseas-warehouse/views/warehouseDisposalForm.test.mjs

@@ -1,8 +1,39 @@
 import assert from 'node:assert/strict'
 import { readFileSync } from 'node:fs'
 import test from 'node:test'
+import { createRequire } from 'node:module'
+import ts from 'typescript'
 
 const view = readFileSync(new URL('./WarehouseServiceView.vue', import.meta.url), 'utf8')
+const { default: Schema } = createRequire(import.meta.resolve('element-plus'))('async-validator')
+
+test('新增废弃逐字段校验仓库、来源单和原因，备注不影响提交资格', async () => {
+  const source = view.slice(view.indexOf('const disposalFormRules:'), view.indexOf('const labelingFormRef ='))
+  const code = ts.transpileModule(source, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText
+  const rules = new Function(code + '\nreturn disposalFormRules')()
+  const validator = new Schema(rules)
+  await assert.rejects(validator.validate({ warehouse: '', sourceOrder: '', reason: '' }), error => {
+    assert.deepEqual(Object.keys(error.fields).sort(), ['reason', 'sourceOrder', 'warehouse'])
+    return true
+  })
+  const form = { warehouse: 'WH-A', sourceOrder: 'document:IN-A', reason: '其他', remark: '' }
+  await validator.validate(form)
+  await assert.rejects(validator.validate({ ...form, sourceOrder: '' }), error => Boolean(error.fields.sourceOrder))
+  await assert.rejects(validator.validate({ ...form, reason: ' ' }), error => Boolean(error.fields.reason))
+})
+
+test('新增废弃校验失败不进入库存提交判断，其他页面不调用废弃表单校验', async () => {
+  const guard = view.match(/  if \(isDisposalCreate\.value && !await labelingFormRef[^\n]+/)[0]
+  let validations = 0
+  const submit = new Function('isDisposalCreate', 'labelingFormRef', 'return async () => {' + guard + '\nreturn "continue"\n}')
+  const formRef = { value: { validate: async () => { validations++; throw new Error('required') } } }
+  assert.equal(await submit({ value: true }, formRef)(), undefined)
+  assert.equal(validations, 1)
+  assert.equal(await submit({ value: false }, formRef)(), 'continue')
+  assert.equal(validations, 1)
+  formRef.value.validate = async () => true
+  assert.equal(await submit({ value: true }, formRef)(), 'continue')
+})
 
 test('货物废弃先选择海外操作仓，再加载并选择该仓入库单', () => {
   assert.match(view, /props\.service === 'disposal'.*操作仓.*v-model="form\.warehouse".*@change="selectDiscardWarehouse"/s)
@@ -11,13 +42,19 @@ test('货物废弃先选择海外操作仓，再加载并选择该仓入库单',
   assert.match(view, /\|\| !primaryWarehouse \|\| invalidCargo/)
 })
 
+test('无箱唛按数量废弃时备注必填，选择箱唛废弃时备注可选', () => {
+  assert.match(view, /props\.service === 'disposal' && discardQuantityMode\.value && !form\.remark\.trim\(\)/)
+  assert.match(view, /请填写废弃备注/)
+  assert.match(view, /props\.service === 'disposal' && discardQuantityMode \? '备注 \*' : '备注'/)
+})
+
 
 test('废弃来源包含通用仓位，选择后带出全部库存且不把选择键提交为订单ID', () => {
   const body = view.match(/function selectDiscardInbound\(orderId: string\) \{([\s\S]*?)\n\}/)[1]
-  const select = new Function('discardSelectedBoxKeys', 'discardBoxSearch', 'selectAllDiscardBoxes', 'discardDocuments', 'cargoRows', 'form', 'cargoSequence', 'orderId', body)
+  const select = new Function('discardRequestedPackages', 'discardSelectedBoxKeys', 'discardBoxSearch', 'selectAllDiscardBoxes', 'discardDocuments', 'cargoRows', 'form', 'cargoSequence', 'orderId', body)
   const cargoRows = { value: [] }; const form = {}
   const source = { orderId: 'inventory:42', sourceType: 'INVENTORY', inventoryPositionId: '42', overseasWarehouseId: '99', inboundCode: 'WT-1', skus: [{ skuCode: 'A', productName: '商品', availablePackages: 100 }] }
-  select({ value: [] }, { value: '' }, () => {}, { value: [{ ...source, orderId: 'document:WT-1', sources: [source] }] }, cargoRows, form, 0, 'document:WT-1')
+  select({ value: 9 }, { value: [] }, { value: '' }, () => {}, { value: [{ ...source, orderId: 'document:WT-1', sources: [source] }] }, cargoRows, form, 0, 'document:WT-1')
   assert.equal(cargoRows.value[0].quantity, 100)
   assert.equal(cargoRows.value[0].sourceInventoryPositionId, '42')
   assert.equal(form.inboundNo, 'WT-1')

src/modules/overseas-warehouse/views/warehouseTransferForm.test.mjs

@@ -322,7 +322,8 @@ test('仓储转运可在新建页直接提交，也可保存草稿后编辑提
   assert.match(view, /v-if="props\.service === 'transfer'"[^>]*type="primary"[^>]*native-type="submit"[^>]*>提交订单/)
   assert.match(view, /await updateTransfer\(editingTransferNo\.value, payload\)/)
   assert.match(view, /await submitTransfer\(transferNo\)/)
-  assert.match(view, /<form [^>]*@submit\.prevent="submit\('submit'\)"/)
+  assert.match(view, /const isLabelingCreate = computed\(\(\) => props.service === 'labeling' && mode.value === 'create'\)/)
+  assert.match(view, /<component :is="isServiceCreate \? ElForm : 'form'"[^>]*@submit\.prevent="submit\('submit'\)"/)
   assert.match(view, /selectedDetail\?\.status !== 'DRAFT'[^>]*[\s\S]*?printTransferCartons[^>]*[\s\S]*?打印预报箱唛/)
   assert.doesNotMatch(view, /row\.__status !== 'DRAFT'.*printTransferCartons\(row\['0'\]\)/s)
   assert.doesNotMatch(view, /selectedDetail\?\.status === 'DRAFT'[^>]*[\s\S]*?>提交订单/)