fix(client): request complete server-paged order workbench

src/modules/first-leg/views/FirstLegOrdersView.vue

@@ -112,7 +112,7 @@ async function cancelOrder(order: FirstLegOrder) {
     await store.cancelOrder(command.id, command.expectedVersion, command.reason)
     pendingCancellation.value = undefined
     ElMessage.success('订单已取消')
-    await store.load({ includeDrafts: true })
+    await loadOrderPage()
     if (isDetailPage.value) await router.push({ name: 'first-leg-orders' })
   } catch (error) {
     if (error === 'cancel' || error === 'close') return
@@ -135,7 +135,7 @@ const appliedFilters = ref<QueryModel>({ ...filters.value })
 const queryFields = computed<QueryField[]>(() => [
   { key: 'cargoKeyword', label: '入仓码 / SKU', type: 'input', placeholder: '请输入入仓码或 SKU', props: { 'aria-label': '入仓码或 SKU' } },
   { key: 'receivingWarehouseId', label: '收货仓', type: 'select', placeholder: '全部', options: availableWarehouses.value.map((item) => ({ label: item.name, value: item.id })), props: { 'aria-label': '收货仓' } },
-  { key: 'channelName', label: '渠道名称', type: 'select', placeholder: '全部', options: [...new Set(store.orders.map((item) => item.channelName).filter(Boolean))].map((name) => ({ label: name, value: name })), props: { 'aria-label': '渠道名称' } },
+  { key: 'channelName', label: '渠道名称', type: 'select', placeholder: '全部', options: store.queryChannelNames.map((name) => ({ label: name, value: name })), props: { 'aria-label': '渠道名称' } },
   { key: 'createdRange', label: '创建时间', type: 'daterange', placeholder: '请选择创建时间', props: { 'aria-label': '创建时间' } },
   { key: 'status', label: '当前状态', type: 'select', placeholder: '全部', options: FIRST_LEG_ORDER_STATUSES.filter(item => item.code !== 'CANCELLED').map((item) => ({ label: item.label, value: item.code })), props: { 'aria-label': '当前状态' } },
   { key: 'destinationType', label: '目的仓类型', type: 'select', placeholder: '全部', options: [{ label: 'FBA 仓', value: 'FBA' }, { label: '海外仓', value: 'OVERSEAS' }, { label: '私人地址', value: 'PRIVATE' }], props: { 'aria-label': '目的仓类型' } },
@@ -500,49 +500,47 @@ useUnsavedWorkRegistration({
   dirty: editorDirty,
 })
 
-function matchesAppliedFilters(order: FirstLegOrder) {
-  const statusValue = appliedFilters.value.status
-  const createdRangeValue = appliedFilters.value.createdRange
-  const textValue = (key: string) => typeof appliedFilters.value[key] === 'string' ? String(appliedFilters.value[key]).trim().toLowerCase() : ''
-  const receivingWarehouseId = textValue('receivingWarehouseId')
-  const channelName = textValue('channelName')
-  const cargoKeyword = textValue('cargoKeyword')
-  const destinationType = textValue('destinationType')
-  const trackingNumber = textValue('trackingNumber')
-  const status = typeof statusValue === 'string' ? statusValue as FirstLegOrderStatus | '' : ''
-  const createdRange = Array.isArray(createdRangeValue) ? createdRangeValue.filter((value): value is string => typeof value === 'string') : []
-  const matchesWarehouse = !receivingWarehouseId || order.receivingWarehouseId.toLowerCase() === receivingWarehouseId
-  const matchesChannel = !channelName || order.channelName.toLowerCase() === channelName
-  const matchesCargo = !cargoKeyword || [order.businessSummary.inboundCode, ...order.skuNos, ...order.items.map((item) => item.sku)]
-    .filter(Boolean).some((value) => String(value).toLowerCase().includes(cargoKeyword))
-  const matchesDestinationType = !destinationType || order.destinationType.toLowerCase() === destinationType
-  const matchesTrackingNumber = !trackingNumber || order.trackingNumber.toLowerCase().includes(trackingNumber)
-  const matchesStatus = !status || order.status === status
-  const matchesDate = createdRange.length !== 2 || (order.createdAt.slice(0, 10) >= createdRange[0] && order.createdAt.slice(0, 10) <= createdRange[1])
-  return matchesWarehouse && matchesChannel && matchesCargo && matchesDestinationType && matchesTrackingNumber && matchesStatus && matchesDate
-}
+const orderQueueCounts = computed(() => store.queueCounts)
+const pagedOrders = computed(() => store.orders)
 
-const queryMatchedOrders = computed(() => store.orders.filter(matchesAppliedFilters))
-const orderQueueCounts = computed(() => ({
-  all: queryMatchedOrders.value.length,
-  fee: queryMatchedOrders.value.filter((order) => order.businessSummary.customerFeeConfirmationRequired).length,
-  customs: queryMatchedOrders.value.filter((order) => needsCustomsUpload(eligibleCustomsDetail(order))).length,
-  draft: queryMatchedOrders.value.filter((order) => order.status === 'DRAFT').length,
-}))
-const filteredOrders = computed(() => queryMatchedOrders.value.filter((order) => {
-  if (activeOrderQueue.value === 'fee') return order.businessSummary.customerFeeConfirmationRequired
-  if (activeOrderQueue.value === 'customs') return needsCustomsUpload(eligibleCustomsDetail(order))
-  if (activeOrderQueue.value === 'draft') return order.status === 'DRAFT'
-  return true
-}))
-const pagedOrders = computed(() => {
-  const start = (tablePage.value - 1) * tablePageSize.value
-  return filteredOrders.value.slice(start, start + tablePageSize.value)
-})
-
-function selectOrderQueue(queue: OrderQueue) {
+async function selectOrderQueue(queue: OrderQueue) {
   activeOrderQueue.value = queue
   tablePage.value = 1
+  await loadOrderPage()
+}
+
+async function changeOrderPage(page: number) {
+  tablePage.value = page
+  await loadOrderPage()
+}
+
+async function changeOrderPageSize(size: number) {
+  tablePageSize.value = size
+  tablePage.value = 1
+  await loadOrderPage()
+}
+
+let orderPageRequestVersion = 0
+async function loadOrderPage() {
+  const requestVersion = ++orderPageRequestVersion
+  const text = (key: string) => typeof appliedFilters.value[key] === 'string' ? String(appliedFilters.value[key]).trim() || undefined : undefined
+  const range = Array.isArray(appliedFilters.value.createdRange) ? appliedFilters.value.createdRange : []
+  const requestedPage = tablePage.value
+  await store.load({
+    cargoKeyword: text('cargoKeyword'), receivingWarehouseId: text('receivingWarehouseId'),
+    channelName: text('channelName'), destinationType: text('destinationType'),
+    trackingNumber: text('trackingNumber'), mainStatus: text('status'),
+    createdFrom: range[0] ? `${range[0]}T00:00:00` : undefined,
+    createdTo: range[1] ? `${range[1]}T23:59:59.999` : undefined,
+    queue: activeOrderQueue.value, page: requestedPage, size: tablePageSize.value,
+  })
+  if (requestVersion !== orderPageRequestVersion) return
+  const lastPage = Math.max(1, Math.ceil(store.total / tablePageSize.value))
+  if (!store.loadError && requestedPage > lastPage) {
+    tablePage.value = lastPage
+    await loadOrderPage()
+    return
+  }
   selectedOrders.value = []
   orderTableVersion.value += 1
 }
@@ -586,7 +584,9 @@ function openInboundCodeAssociation(inboundCode: string) {
 }
 
 function updateCustomsDetail(value: MerchantCustomsContainer) {
+  const previous = customsByOrder[customsDialogOrderId.value]
   if (customsDialogOrderId.value) customsByOrder[customsDialogOrderId.value] = value
+  if (!isCreatePage.value && !isDetailPage.value && previous && previous.merchantStatus !== value.merchantStatus) void loadOrderPage()
 }
 
 const detailOrder = computed(() => detailId.value ? store.getById(detailId.value) : undefined)
@@ -652,7 +652,7 @@ async function loadPageData() {
     : Promise.resolve()
   const orderPageRequest = isCreatePage.value || isDetailPage.value
     ? store.loadWarehouseType('DOMESTIC', true)
-    : store.load({ includeDrafts: true })
+    : loadOrderPage()
   const addressRequest = isCreatePage.value ? loadOrderAddresses() : Promise.resolve()
   const [ordersResult, companyResult, destinationResult, policyResult, addressResult] = await Promise.allSettled([
     orderPageRequest,
@@ -673,7 +673,6 @@ async function loadPageData() {
   }
   if (!isCreatePage.value && ordersResult.status === 'rejected' && !store.loadError) supportingDataErrors.value.push(`订单加载失败：${errorMessage(ordersResult.reason)}`)
   if (store.warehouseLoadError) supportingDataErrors.value.push(`公共仓库加载失败：${store.warehouseLoadError}`)
-  if (!isCreatePage.value && store.draftLoadError) supportingDataErrors.value.push(`订单草稿加载失败：${store.draftLoadError}`)
   if (destinationResult.status === 'rejected') supportingDataErrors.value.push(`目的仓加载失败：${errorMessage(destinationResult.reason)}`)
   if (addressResult.status === 'rejected') supportingDataErrors.value.push(`企业地址簿加载失败：${errorMessage(addressResult.reason)}`)
   await autofillWarehouseSelections()
@@ -1528,6 +1527,7 @@ async function retryInboundBilling() {
 }
 
 function handleInboundFeeConfirmed() {
+  if (!isCreatePage.value && !isDetailPage.value) void loadOrderPage()
   if (!feeConfirmationOpen.value) void retryInboundBilling()
 }
 
@@ -1953,7 +1953,7 @@ async function submitBatchImport() {
       batchImportIdempotencyKey.value,
     )
     const result = batchImportResult.value.result
-    if (result.succeeded && auth.hasPermission('order:first-leg:list')) await store.load({ includeDrafts: true })
+    if (result.succeeded && auth.hasPermission('order:first-leg:list')) await loadOrderPage()
     if (result.failed) ElMessage.warning(`导入完成：成功 ${result.succeeded} 条，失败 ${result.failed} 条`)
     else ElMessage.success(`已成功导入 ${result.succeeded} 条订单草稿`)
   } catch (error) {
@@ -2087,37 +2087,13 @@ async function submitOrder() {
 }
 
 async function searchOrders(model: QueryModel) {
-  const createdRange = model.createdRange
-  appliedFilters.value = {
-    ...model,
-    createdRange: Array.isArray(createdRange) ? createdRange.filter((value): value is string => typeof value === 'string') : [],
+  appliedFilters.value = { ...model,
+    createdRange: Array.isArray(model.createdRange) ? model.createdRange.filter((value): value is string => typeof value === 'string') : [],
   }
   tablePage.value = 1
-  try {
-    const statusValue = typeof model.status === 'string' ? model.status as FirstLegOrderStatus | '' : ''
-    const cargoKeyword = typeof model.cargoKeyword === 'string' ? model.cargoKeyword.trim() : ''
-    const range = Array.isArray(createdRange) ? createdRange.filter((value): value is string => typeof value === 'string') : []
-    const query = {
-      keyword: undefined,
-      inboundCode: cargoKeyword || undefined,
-      receivingWarehouseId: typeof model.receivingWarehouseId === 'string' && model.receivingWarehouseId ? model.receivingWarehouseId : undefined,
-      mainStatus: statusValue && statusValue !== 'DRAFT' && statusValue !== 'CANCELLED' ? statusValue : undefined,
-      draftOnly: statusValue === 'DRAFT',
-      includeDrafts: !statusValue,
-      createdFrom: range[0] ? `${range[0]}T00:00:00` : undefined,
-      createdTo: range[1] ? `${range[1]}T23:59:59` : undefined,
-    }
-    await store.load(query)
-    const cargoMatched = cargoKeyword && store.orders.some((order) => order.status !== 'DRAFT' && orderMatchesCargoKeyword(order, cargoKeyword))
-    if (cargoKeyword && !cargoMatched && statusValue !== 'DRAFT') {
-      await store.load({ ...query, keyword: undefined, inboundCode: undefined, fbaCode: cargoKeyword })
-    }
-    selectedOrders.value = []
-    orderTableVersion.value += 1
-  } catch {
-    // Store keeps the recoverable error state rendered below the query toolbar.
-  }
+  await loadOrderPage()
 }
+
 </script>
 
 <template>
@@ -2126,7 +2102,7 @@ async function searchOrders(model: QueryModel) {
     <QueryToolbar v-model="filters" class="first-leg-query-toolbar" layout="grid" :fields="queryFields" ariaLabel="订单查询" @search="searchOrders" />
 
     <div class="client-card order-table-card">
-        <DataTable v-model:page="tablePage" v-model:page-size="tablePageSize" :data="pagedOrders" :columns="visibleOrderColumns" :key="orderTableVersion" :loading="store.loading" :total="filteredOrders.length" :page-sizes="[10, 20, 50]" row-key="id" empty-text="暂无订单" class="prototype-order-table" :row-actions="getOrderRowActions" @selection-change="handleOrderSelectionChange">
+        <DataTable :page="tablePage" :page-size="tablePageSize" @update:page="changeOrderPage" @update:page-size="changeOrderPageSize" :data="pagedOrders" :columns="visibleOrderColumns" :key="orderTableVersion" :loading="store.loading" :total="store.total" :page-sizes="[10, 20, 50]" row-key="id" empty-text="暂无订单" class="prototype-order-table" :row-actions="getOrderRowActions" @selection-change="handleOrderSelectionChange">
           <template #toolbar>
             <nav class="order-queue-tabs" aria-label="订单事项分类">
               <button type="button" :class="{ active: activeOrderQueue === 'all' }" @click="selectOrderQueue('all')">全部</button>