优化

src/modules/first-leg/components/InboundBillingPanel.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { ref, watch } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
 import { Clock3, PackageCheck, RefreshCw, TriangleAlert } from '@lucide/vue'
+import { confirmMerchantInboundFee } from '@/modules/first-leg/api/inboundBilling'
 import type { MerchantInboundBilling } from '@/modules/first-leg/types/inboundBilling'
 import {
   formatConversionPrecision,
@@ -19,6 +21,7 @@ const props = withDefaults(defineProps<{
   unavailableMessage?: string
   error?: string
   autoOpen?: boolean
+  canConfirm?: boolean
 }>(), {
   data: null,
   loading: false,
@@ -26,16 +29,49 @@ const props = withDefaults(defineProps<{
   unavailableMessage: '还未测量推送',
   error: '',
   autoOpen: false,
+  canConfirm: false,
 })
 
-defineEmits<{
+const emit = defineEmits<{
   retry: []
+  confirmed: []
 }>()
 
 const feeDialogOpen = ref(false)
+const confirming = ref(false)
 watch(() => [props.autoOpen, props.data] as const, ([autoOpen, data]) => {
   if (autoOpen && data) feeDialogOpen.value = true
 }, { immediate: true })
+
+async function confirmFee() {
+  const fee = props.data?.latestFee
+  const orderId = props.data?.inbound.summary.orderId
+  if (!fee || !orderId || !props.canConfirm || confirming.value) return
+  if (fee.customerConfirmationStatus === 'CONFIRMED') {
+    ElMessage.info('当前费用已经确认，无需重复操作')
+    return
+  }
+  try {
+    await ElMessageBox.confirm(
+      `请再次确认费用单 ${fee.feeNo}，合计 ${formatInboundMoney(fee.totalAmount, fee.currency)}。确认后该费用将锁定，平台不能再修改。`,
+      '二次确认费用',
+      { type: 'warning', confirmButtonText: '确认费用无误', cancelButtonText: '返回核对' },
+    )
+  } catch {
+    return
+  }
+  confirming.value = true
+  try {
+    await confirmMerchantInboundFee(orderId, fee.feeVersion)
+    ElMessage.success('费用确认成功，当前费用已锁定')
+    feeDialogOpen.value = false
+    emit('confirmed')
+  } catch (error) {
+    ElMessage.error(error instanceof Error ? error.message : '费用确认失败，请刷新后重试')
+  } finally {
+    confirming.value = false
+  }
+}
 </script>
 
 <template>
@@ -43,8 +79,11 @@ watch(() => [props.autoOpen, props.data] as const, ([autoOpen, data]) => {
     <header class="inbound-billing-heading">
       <h3 id="inbound-billing-title">入库与费用</h3>
       <div v-if="props.data" class="inbound-billing-actions">
-        <el-tag type="success" effect="light">待分柜 · 费用已发布</el-tag>
-        <el-button type="primary" @click="feeDialogOpen = true">确认费用</el-button>
+        <el-tag :type="props.data.latestFee.customerConfirmationStatus === 'CONFIRMED' ? 'success' : 'warning'" effect="light">
+          {{ props.data.latestFee.customerConfirmationStatus === 'CONFIRMED' ? '客户已确认 · 费用已锁定' : '费用已发布 · 待确认' }}
+        </el-tag>
+        <el-button v-if="props.data.latestFee.customerConfirmationStatus !== 'CONFIRMED' && props.canConfirm" type="primary" @click="feeDialogOpen = true">确认费用</el-button>
+        <el-button v-else plain @click="feeDialogOpen = true">查看费用</el-button>
       </div>
     </header>
 
@@ -163,10 +202,10 @@ watch(() => [props.autoOpen, props.data] as const, ([autoOpen, data]) => {
 
     <el-dialog v-model="feeDialogOpen" title="确认测量与计费数据" width="min(980px, 94vw)" append-to-body>
       <dl v-if="props.data" class="inbound-measurements fee-dialog-summary">
-        <div><dt>测量总箱数</dt><dd>{{ formatInboundNumber(props.data.measurementSummary.actualPackageCount, 0) }}</dd></div>
-        <div><dt>测量总毛重</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.actualGrossWeightKg, 'kg') }}</dd></div>
-        <div><dt>测量总体积</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.actualVolumeCbm, 'm³') }}</dd></div>
-        <div><dt>测量总材积重</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.volumeWeightKg, 'kg') }}</dd></div>
+        <div><dt>计费总箱数</dt><dd>{{ formatInboundNumber(props.data.measurementSummary.actualPackageCount, 0) }}</dd></div>
+        <div><dt>计费总毛重</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.actualGrossWeightKg, 'kg') }}</dd></div>
+        <div><dt>外箱规总体积</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.actualVolumeCbm, 'm³') }}</dd></div>
+        <div><dt>外箱规总材积重</dt><dd>{{ formatInboundMeasure(props.data.measurementSummary.volumeWeightKg, 'kg') }}</dd></div>
         <div><dt>计费体积</dt><dd>{{ formatInboundMeasure(props.data.billingBasis.chargeableVolumeCbm, 'm³') }}</dd></div>
         <div><dt>计费重量</dt><dd>{{ formatInboundMeasure(props.data.billingBasis.chargeableWeightKg, 'kg') }}</dd></div>
       </dl>
@@ -179,9 +218,22 @@ watch(() => [props.autoOpen, props.data] as const, ([autoOpen, data]) => {
         <el-table-column label="每箱体积" min-width="105"><template #default="{ row }">{{ formatInboundMeasure(row.unitVolumeCbm, 'm³') }}</template></el-table-column>
         <el-table-column label="总体积" min-width="105"><template #default="{ row }">{{ formatInboundMeasure(row.totalVolumeCbm, 'm³') }}</template></el-table-column>
         <el-table-column label="总材积重" min-width="105"><template #default="{ row }">{{ formatInboundMeasure(row.volumeWeightKg, 'kg') }}</template></el-table-column>
+        <el-table-column prop="calculationRuleVersion" label="箱规规则" min-width="180" />
         <el-table-column prop="boxSpecification" label="备注" min-width="130" />
       </el-table>
-      <template #footer><el-button type="primary" @click="feeDialogOpen = false">确认</el-button></template>
+      <el-alert
+        v-if="props.data?.latestFee.customerConfirmationStatus === 'CONFIRMED'"
+        class="fee-confirmed-alert"
+        :title="`客户已于 ${formatInboundDateTime(props.data.latestFee.customerConfirmedAt)} 确认，费用已锁定，不允许修改。`"
+        type="success"
+        :closable="false"
+        show-icon
+      />
+      <el-alert v-else class="fee-confirmed-alert" title="请核对全部计费数据。点击确认后还会进行一次确认，完成后费用将锁定。" type="warning" :closable="false" show-icon />
+      <template #footer>
+        <el-button @click="feeDialogOpen = false">关闭</el-button>
+        <el-button v-if="props.data?.latestFee.customerConfirmationStatus !== 'CONFIRMED' && props.canConfirm" type="primary" :loading="confirming" @click="confirmFee">确认费用</el-button>
+      </template>
     </el-dialog>
   </section>
 </template>
@@ -214,6 +266,7 @@ watch(() => [props.autoOpen, props.data] as const, ([autoOpen, data]) => {
 .inbound-measurements > div { min-width: 0; padding: 12px; }
 .measurement-detail-table { margin-top: 12px; }
 .fee-dialog-summary { margin-top: 0; }
+.fee-confirmed-alert { margin-top: 14px; }
 .pallet-location-list { margin-top: 9px; border-top: 1px solid var(--border); }
 .pallet-location-list article { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid var(--border); }
 .pallet-location-list article > svg { color: var(--primary); }