feat: 完成客户端联调与通用列表组件

src/views/FirstLegOrdersView.test.mjs

@@ -39,10 +39,21 @@ test('renders dynamic cargo lines and responsive drawers', () => {
 })
 
 test('keeps primary mobile order actions touch sized', () => {
-  assert.match(source, /\.order-toolbar-actions :deep\(\.el-button\) \{ min-height: 44px;/)
   assert.match(source, /\.editor-actions :deep\(\.el-button\) \{ min-height: 44px;/)
 })
 
+test('uses the shared query toolbar and data table without metric cards', () => {
+  assert.match(source, /import QueryToolbar, \{ type QueryField, type QueryModel \}/)
+  assert.match(source, /import DataTable, \{ type DataTableColumn \}/)
+  assert.match(source, /const filters = ref<QueryModel>/)
+  assert.match(source, /<QueryToolbar v-model="filters" :fields="queryFields" ariaLabel="头程订单查询" @search="searchOrders">/)
+  assert.match(source, /async function searchOrders\(model: QueryModel\)/)
+  assert.match(source, /await store\.load\(\)/)
+  assert.match(source, /<DataTable v-model:page="tablePage" v-model:page-size="tablePageSize" :data="pagedOrders" :columns="orderColumns"/)
+  assert.match(source, /\{ key: 'actions', label: '操作', width: 180, fixed: 'left', slotName: 'actions' \}/)
+  assert.doesNotMatch(source, /order-metrics|订单概览/)
+})
+
 test('does not expose arbitrary status mutation controls to customers', () => {
   assert.doesNotMatch(source, /setStatusForPreview/)
   assert.doesNotMatch(source, /状态更新|更新状态/)
@@ -51,7 +62,7 @@ test('does not expose arbitrary status mutation controls to customers', () => {
 test('requires an enabled platform receiving warehouse in the order form', () => {
   assert.match(source, /computed\(\(\) => store\.warehouses\)/)
   assert.match(source, /availableWarehouses\.value\.length === 0/)
-  assert.match(source, /label="平台收货仓" required/)
+  assert.match(source, /label="平台收货仓"[^>]*required/)
   assert.match(source, /v-model="form\.receivingWarehouseId"/)
   assert.match(source, /selectedWarehouse\.businessHours/)
   assert.match(source, /detailOrder\.receivingWarehouseSnapshot\?\.name/)
@@ -60,11 +71,22 @@ test('requires an enabled platform receiving warehouse in the order form', () =>
 })
 
 test('collects the backend-required first-leg fields', () => {
-  for (const model of ['destinationCountryCode', 'destinationWarehouseName', 'channelCode', 'channelName', 'pickupMethod', 'taxMode', 'destinationType', 'packageType']) {
+  for (const model of ['destinationCountryCode', 'destinationWarehouseName', 'channelCode', 'channelName', 'pickupMethod', 'taxMode', 'destinationType', 'packageType', 'upc']) {
     assert.match(source, new RegExp(`v-model="(?:form|item)\\.${model}"`))
   }
 })
 
+test('shows field-level validation and concise guidance for required order inputs', () => {
+  assert.match(source, /ref="orderFormRef" :model="form" :rules="orderFormRules"/)
+  assert.match(source, /prop="shipperPartySnapshot\.contactName" required/)
+  assert.match(source, /prop="consigneePartySnapshot\.address" required/)
+  assert.match(source, /:prop="`items\.\$\{index\}\.cargoNameCn`" required/)
+  assert.match(source, /:prop="`items\.\$\{index\}\.grossWeightKg`" required/)
+  assert.match(source, /label="UPC".*required.*v-model="item\.upc"/)
+  assert.match(source, /placeholder="例如：蓝牙音箱"/)
+  assert.match(source, /\.order-form :deep\(\.el-form-item__error\).*position: static/)
+})
+
 test('selects enabled counterparties and stores editable order snapshots', () => {
   assert.match(source, /firstLegPartySource\.listAvailable\('SHIPPER'\)/)
   assert.match(source, /firstLegPartySource\.findAvailable\(id, role\)/)