fix(first-leg): preserve edit commands and add versioned cancellation

src/modules/first-leg/views/FirstLegOrdersView.test.mjs

@@ -35,7 +35,7 @@ test('opens order creation as a dedicated protected page while keeping draft edi
   assert.match(editorShellSource, /\.editor-page-footer :deep\(\.editor-actions\) \{[^}]*justify-content: center;/)
 })
 
-test('exposes real list, draft, submit, and detail workflow entries without cancellation', () => {
+test('exposes real list, draft, submit, and detail workflow entries', () => {
   assert.match(source, /function openCreate\(\)/)
   assert.match(source, /async function saveDraft\(\)/)
   assert.match(source, /function submitOrder\(\)/)
@@ -45,7 +45,6 @@ test('exposes real list, draft, submit, and detail workflow entries without canc
   assert.match(source, /Promise\.allSettled\(\[\s*orderPageRequest,\s*companyRequest/)
   assert.match(source, /tenantStore\.loadCompanyContext\(\)/)
   assert.match(source, /await store\.loadDetail\(orderId\)/)
-  assert.doesNotMatch(source, /cancelOrder|取消订单/)
 })
 
 test('returns edited submissions to the refreshed order list instead of opening detail', () => {

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

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue'
+import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref, shallowRef, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage, ElMessageBox, type FormInstance, type FormItemRule, type FormRules, type UploadRequestOptions } from 'element-plus'
 import { AlertTriangle, ChevronDown, ChevronUp, Download, FilePlus2, FileText, GripVertical, ImagePlus, MapPin, PackageCheck, Pencil, Plus, RotateCcw, Send, SlidersHorizontal, Trash2, Upload } from '@lucide/vue'
@@ -41,7 +41,7 @@ import {
   type MerchantPricingChannel,
   type InboundCodePolicy,
 } from '@/modules/first-leg/api/firstLeg'
-import { useFirstLegOrdersStore } from '@/modules/first-leg/store/firstLegOrders'
+import { useFirstLegOrdersStore, type DraftEditSession } from '@/modules/first-leg/store/firstLegOrders'
 import { useTenantAdministrationStore } from '@/modules/tenant-management/public'
 import { useAuthStore } from '@/modules/auth/public'
 import { useUnsavedWorkRegistration } from '@/navigation/workspace-tabs/unsavedWork'
@@ -79,6 +79,53 @@ const companyAuditLoaded = ref(false)
 const companySubmissionBlocked = computed(() => companyAuditLoaded.value && tenantStore.company.auditStatus !== 'ACTIVE')
 const canCreateOrder = computed(() => auth.hasPermission('order:first-leg:create'))
 const canEditOrder = computed(() => auth.hasPermission('order:first-leg:edit'))
+const canCancelOrder = computed(() => auth.hasPermission('order:first-leg:cancel'))
+const cancellingOrderId = ref('')
+const pendingCancellation = shallowRef<{ id: string; expectedVersion: number; reason: string; businessNo: string; statusLabel: string }>()
+
+function canOfferCancellation(order: FirstLegOrder) {
+  return canCancelOrder.value && ['DRAFT', 'PENDING_REVIEW', 'WAIT_MEASURE'].includes(order.status)
+}
+
+async function cancelOrder(order: FirstLegOrder) {
+  if (!canOfferCancellation(order) || cancellingOrderId.value) return
+  cancellingOrderId.value = order.id
+  try {
+    let command = pendingCancellation.value
+    if (command && command.id !== order.id) {
+      ElMessage.warning(`请先处理订单 ${command.businessNo} 未确认的取消结果`)
+      return
+    }
+    if (!command) {
+      const target = await store.prepareCancellation(order.id)
+      const { value } = await ElMessageBox.prompt(`订单：${target.businessNo}；当前状态：${target.statusLabel}。请填写取消原因。`, '取消订单', {
+        type: 'warning', inputType: 'textarea', confirmButtonText: '确认取消订单', cancelButtonText: '返回',
+        inputValidator: value => Boolean(value?.trim()) && value.trim().length <= 500 || '请填写 1–500 字取消原因',
+      })
+      command = { ...target, reason: value.trim() }
+      pendingCancellation.value = command
+    } else {
+      await ElMessageBox.confirm(`订单：${command.businessNo}；原状态：${command.statusLabel}；原因：${command.reason}。将查询当前状态并重试原取消请求。`, '重试取消订单', {
+        type: 'warning', confirmButtonText: '重试原请求', cancelButtonText: '返回',
+      })
+    }
+    await store.cancelOrder(command.id, command.expectedVersion, command.reason)
+    pendingCancellation.value = undefined
+    ElMessage.success('订单已取消')
+    await store.load({ includeDrafts: true })
+    if (isDetailPage.value) await router.push({ name: 'first-leg-orders' })
+  } catch (error) {
+    if (error === 'cancel' || error === 'close') return
+    if (error instanceof ApiError && (error.code === 'A0409' || error.status === 409)) {
+      pendingCancellation.value = undefined
+      ElMessage.error(`${error.message}。请刷新订单后重新确认取消。`)
+    } else {
+      ElMessage.error(error instanceof Error ? error.message : '取消失败，请重试原请求')
+    }
+  } finally {
+    cancellingOrderId.value = ''
+  }
+}
 const canSubmitOrder = computed(() => auth.hasPermission('order:first-leg:submit'))
 const canConfirmInboundFee = computed(() => auth.hasPermission('order:first-leg:edit'))
 const availableWarehouses = computed(() => store.warehouses.filter((warehouse) => warehouse.warehouseType === 'DOMESTIC'))
@@ -199,6 +246,7 @@ const activeOrderQueue = ref<OrderQueue>('all')
 const editorOpen = ref(false)
 const orderFormRef = ref<FormInstance>()
 const editingId = ref<string>()
+const editingSession = shallowRef<DraftEditSession>()
 const openingEditor = ref(false)
 const copyingOrderId = ref('')
 const detailId = ref<string>()
@@ -640,6 +688,7 @@ async function loadRouteDraft(id: string) {
   const draft = draftFromOrder(detailedOrder)
   if (draft.destinationType !== 'PRIVATE') await loadDestinationWarehouses(draft.destinationType)
   editingId.value = detailedOrder.id
+  editingSession.value = store.beginDraftEdit(detailedOrder)
   replaceForm(draft)
   await Promise.all(form.items.map(ensureProductImagePreview))
   if (form.receivingWarehouseId) await loadSelectedWarehouse(form.receivingWarehouseId)
@@ -1306,6 +1355,9 @@ function getOrderRowActions(row: object): TableAction[] {
   if (canEditOrder.value && canClientEditFirstLegOrder(order.status)) {
     actions.push({ key: 'edit', label: '编辑', loading: openingEditor.value, run: () => openEdit(order) })
   }
+  if (canOfferCancellation(order)) {
+    actions.push({ key: 'cancel', label: pendingCancellation.value?.id === order.id ? '重试取消' : '取消订单', loading: cancellingOrderId.value === order.id, disabled: Boolean(cancellingOrderId.value), run: () => cancelOrder(order) })
+  }
   if (eligibleCustomsDetail(order)) {
     actions.push({ key: 'customs', label: '报关资料', run: () => openCustomsDocuments(order) })
   }
@@ -1368,6 +1420,7 @@ async function openEdit(order: FirstLegOrder) {
       }
     }
     editingId.value = detailedOrder.id
+    editingSession.value = store.beginDraftEdit(detailedOrder)
     replaceForm(draft)
     await Promise.all(form.items.map(ensureProductImagePreview))
     if (warehouseAvailable) void loadSelectedWarehouse(detailedOrder.receivingWarehouseId)
@@ -1958,8 +2011,9 @@ async function saveDraft() {
   if (!await validateEditorForm()) return
   saving.value = true
   try {
-    const order = await store.saveDraft(cloneDraft(form), tenantStore.company.companyName, editingId.value)
+    const order = await store.saveDraft(cloneDraft(form), tenantStore.company.companyName, editingId.value, editingSession.value)
     editingId.value = order.id
+    editingSession.value = store.beginDraftEdit(order)
     markEditorClean()
     editorOpen.value = false
     if (isCreatePage.value) await router.push({ name: 'first-leg-orders' })
@@ -1994,8 +2048,9 @@ async function submitOrder() {
   try {
     saving.value = true
     const knownCompanyAuditStatus = companyAuditLoaded.value ? tenantStore.company.auditStatus : undefined
-    const savedOrder = await store.saveDraft(cloneDraft(form), tenantStore.company.companyName, editingId.value)
+    const savedOrder = await store.saveDraft(cloneDraft(form), tenantStore.company.companyName, editingId.value, editingSession.value)
     editingId.value = savedOrder.id
+    editingSession.value = store.beginDraftEdit(savedOrder)
     await store.submitSaved(savedOrder.id, knownCompanyAuditStatus)
     markEditorClean()
     editorOpen.value = false
@@ -2358,7 +2413,7 @@ async function searchOrders(model: QueryModel) {
             <el-button link type="primary" class="detail-back-action" @click="router.push({ name: 'first-leg-orders' })">← 返回列表</el-button>
             <div><h2>{{ detailOrder.businessSummary.inboundCode || (detailOrder.status === 'DRAFT' ? '入仓码提交后生成' : '入仓码待生成') }}</h2><p>{{ getFirstLegTransportModeLabel(detailOrder.transportMode) }} · {{ detailOrder.origin || '起运地待更新' }} → {{ detailOrder.destination || '目的地待更新' }}</p></div>
           </div>
-          <div class="detail-heading-actions"><el-tag :type="getFirstLegStatusTone(detailOrder.status)" effect="light">{{ getFirstLegStatusLabel(detailOrder.status) }}</el-tag><el-button v-if="canEditOrder && canClientEditFirstLegOrder(detailOrder.status)" type="primary" plain :loading="openingEditor" @click="openEdit(detailOrder)"><Pencil :size="16" />编辑草稿</el-button></div>
+          <div class="detail-heading-actions"><el-tag :type="getFirstLegStatusTone(detailOrder.status)" effect="light">{{ getFirstLegStatusLabel(detailOrder.status) }}</el-tag><el-button v-if="canEditOrder && canClientEditFirstLegOrder(detailOrder.status)" type="primary" plain :loading="openingEditor" @click="openEdit(detailOrder)"><Pencil :size="16" />编辑草稿</el-button><el-button v-if="canOfferCancellation(detailOrder)" type="danger" plain :loading="cancellingOrderId === detailOrder.id" :disabled="!!cancellingOrderId" @click="cancelOrder(detailOrder)">{{ pendingCancellation?.id === detailOrder.id ? '重试取消' : '取消订单' }}</el-button></div>
         </div>
         <section class="detail-section">
           <h3>订单与运输</h3>