优化

src/modules/loading-lists/components/ContainerFeesPanel.vue

@@ -26,6 +26,7 @@ const target = ref<ContainerFeeResource | null>(null)
 const formRef = ref<FormInstance>()
 const form = reactive<ContainerFeeSaveRequest>({ feeItemId: '', direction: 'RECEIVABLE', businessDate: new Date().toISOString().slice(0, 10), amount: 0, currency: 'CNY', settlementIncluded: true, remark: null })
 const rejection = ref('')
+let loadSequence = 0
 
 const canView = computed(() => access.can('firstleg:inbound:fee-detail:view'))
 const canEdit = computed(() => access.can('firstleg:inbound:fee-detail:edit'))
@@ -67,21 +68,28 @@ function resetForm(item?: ContainerFeeResource) {
 
 async function load() {
   if (!accountId.value || !canView.value) return
+  const sequence = ++loadSequence
+  const requestedAccountId = accountId.value
   loading.value = true; error.value = null
   try {
-    const [feeRows, items] = await Promise.all([listContainerFees(props.planId, accountId.value), listApplicableFeeItems()])
+    const [feeRows, items] = await Promise.all([listContainerFees(props.planId, requestedAccountId), listApplicableFeeItems()])
+    if (sequence !== loadSequence || requestedAccountId !== accountId.value) return
     fees.value = feeRows; feeItems.value = items
     costs.value = []
     const currentContainerId = feeRows.find((item) => item.containerBookingId)?.containerBookingId
-    if (currentContainerId) costs.value = await listContainerCostDetails(accountId.value, currentContainerId)
-  } catch (cause) { error.value = getApiErrorDetails(cause, '柜次费用加载失败') }
-  finally { loading.value = false }
+    if (currentContainerId) {
+      const result = await listContainerCostDetails(requestedAccountId, currentContainerId)
+      if (sequence !== loadSequence || requestedAccountId !== accountId.value) return
+      costs.value = result
+    }
+  } catch (cause) { if (sequence === loadSequence && requestedAccountId === accountId.value) error.value = getApiErrorDetails(cause, '柜次费用加载失败') }
+  finally { if (sequence === loadSequence) loading.value = false }
 }
 
-function openCreate() { resetForm(); editorOpen.value = true }
-function openAdjust(item: ContainerFeeResource) { resetForm(item); editorOpen.value = true }
+function openCreate() { if (!canEdit.value || !accountId.value) return; resetForm(); editorOpen.value = true }
+function openAdjust(item: ContainerFeeResource) { if (!canEdit.value || !accountId.value) return; resetForm(item); editorOpen.value = true }
 async function save() {
-  if (!accountId.value || !await formRef.value?.validate().catch(() => false)) return
+  if (!canEdit.value || !accountId.value || !await formRef.value?.validate().catch(() => false)) return
   saving.value = true
   try {
     if (target.value) await adjustContainerFee(props.planId, accountId.value, target.value.id, target.value.sourceVersion, { ...form })
@@ -90,22 +98,30 @@ async function save() {
   } catch (cause) { ElMessage.error(getApiErrorDetails(cause, '费用保存失败').message) }
   finally { saving.value = false }
 }
-async function approve(item: ContainerFeeResource) { await approveContainerFee(props.planId, accountId.value, item.id).then(() => ElMessage.success('费用已审核通过')).then(load).catch((cause) => ElMessage.error(getApiErrorDetails(cause, '审核失败').message)) }
-function openReject(item: ContainerFeeResource) { target.value = item; rejection.value = ''; rejectOpen.value = true }
+async function approve(item: ContainerFeeResource) { if (!canReview.value || !accountId.value) return; await approveContainerFee(props.planId, accountId.value, item.id).then(() => ElMessage.success('费用已审核通过')).then(load).catch((cause) => ElMessage.error(getApiErrorDetails(cause, '审核失败').message)) }
+function openReject(item: ContainerFeeResource) { if (!canReview.value || !accountId.value) return; target.value = item; rejection.value = ''; rejectOpen.value = true }
 async function reject() {
-  if (!target.value || !rejection.value.trim()) return ElMessage.warning('请输入驳回原因')
+  if (!canReview.value || !accountId.value || !target.value) return
+  if (!rejection.value.trim()) return ElMessage.warning('请输入驳回原因')
   saving.value = true
   try { await rejectContainerFee(props.planId, accountId.value, target.value.id, rejection.value.trim()); rejectOpen.value = false; ElMessage.success('费用已驳回'); await load() }
   catch (cause) { ElMessage.error(getApiErrorDetails(cause, '驳回失败').message) } finally { saving.value = false }
 }
 async function voidFee(item: ContainerFeeResource) {
+  if (!canReview.value || !accountId.value) return
   await ElMessageBox.confirm(`确认作废“${item.feeItemName}”费用？作废后将同步财务来源状态。`, '作废费用', { type: 'warning', confirmButtonText: '确认作废' })
   await voidContainerFee(props.planId, accountId.value, item.id, item.sourceVersion).then(() => ElMessage.success('费用已作废')).then(load).catch((cause) => ElMessage.error(getApiErrorDetails(cause, '作废失败').message))
 }
 function money(value: number) { return value.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 }) }
 function initializeCustomer() { accountId.value = customerOptions.value.length === 1 ? customerOptions.value[0].value : '' }
+function clearCustomerContext() {
+  loadSequence += 1
+  fees.value = []; costs.value = []; feeItems.value = []; error.value = null; loading.value = false
+  editorOpen.value = false; rejectOpen.value = false; target.value = null; rejection.value = ''
+  resetForm()
+}
 watch(customerOptions, initializeCustomer, { immediate: true })
-watch(accountId, () => { fees.value = []; costs.value = []; void load() })
+watch(accountId, () => { clearCustomerContext(); void load() })
 watch(() => form.direction, () => { if (!applicableItems.value.some((item) => item.id === form.feeItemId)) form.feeItemId = '' })
 onMounted(() => void load())
 </script>