优化

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

@@ -362,6 +362,10 @@ test('estimates by warehouse, destination, tax mode, weight and volume without b
   assert.match(source, /v-for="mode in availablePricingTaxModes"/)
   assert.match(source, /pricingTaxModeLabel\(mode\)/)
   assert.match(source, /priceEstimate\.chargeableQuantity/)
+  assert.match(source, /priceEstimateBreakdown\.actualLabel/)
+  assert.match(source, /priceEstimateBreakdown\.convertedLabel/)
+  assert.match(source, /priceEstimateBreakdown\.basisLabel/)
+  assert.match(source, /两者取大/)
   assert.match(source, /priceEstimate\.unitPrice/)
   assert.match(source, /priceEstimate\.estimatedAmount/)
   assert.match(source, /priceEstimateDisclaimer/)

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

@@ -41,6 +41,7 @@ import {
   validateFirstLegOrderDraft,
 } from '@/modules/first-leg/utils/firstLegOrder'
 import { validateProductImageFile } from '@/modules/first-leg/utils/productImage'
+import { createPriceEstimateBreakdown } from '@/modules/first-leg/utils/priceEstimate'
 
 const store = useFirstLegOrdersStore()
 const tenantStore = useTenantAdministrationStore()
@@ -754,6 +755,11 @@ function formatEstimateQuantity(value: number, unit: string) {
 }
 
 const priceEstimateDisclaimer = computed(() => priceEstimate.value?.disclaimer || '仅供参考，最终以实际结算为准')
+const priceEstimateBreakdown = computed(() => {
+  if (!priceEstimate.value) return null
+  const summary = summarizeFirstLegCargo(form.items)
+  return createPriceEstimateBreakdown(summary.grossWeightKg, summary.volumeCbm, priceEstimate.value.chargeUnit)
+})
 
 function resetPriceEstimate() {
   estimateRequestSequence += 1
@@ -1774,7 +1780,17 @@ async function searchOrders(model: QueryModel) {
                 <strong>{{ selectedPricingChannel?.channelName || priceEstimate.channelCode }}</strong>
                 <small>{{ pricingTaxModeLabel(priceEstimate.pricingTaxMode) }}<template v-if="selectedPricingChannel?.referenceTransit"> · 参考时效 {{ selectedPricingChannel.referenceTransit }}</template></small>
               </div>
-              <div><span>计费量</span><strong>{{ formatEstimateQuantity(priceEstimate.chargeableQuantity, priceEstimate.chargeUnit) }}</strong></div>
+              <div v-if="priceEstimateBreakdown" class="price-estimate__comparison">
+                <span>计费对比</span>
+                <strong>{{ priceEstimateBreakdown.actualLabel }} {{ formatEstimateQuantity(priceEstimateBreakdown.actualQuantity, priceEstimate.chargeUnit) }}</strong>
+                <strong>{{ priceEstimateBreakdown.convertedLabel }} {{ formatEstimateQuantity(priceEstimateBreakdown.convertedQuantity, priceEstimate.chargeUnit) }}</strong>
+                <small>{{ priceEstimateBreakdown.convertedFormula }}</small>
+              </div>
+              <div class="price-estimate__chargeable">
+                <span>{{ priceEstimateBreakdown?.chargeableLabel || '计费量' }}</span>
+                <strong>{{ formatEstimateQuantity(priceEstimate.chargeableQuantity, priceEstimate.chargeUnit) }}</strong>
+                <small v-if="priceEstimateBreakdown">{{ priceEstimateBreakdown.basisLabel }}（两者取大）</small>
+              </div>
               <div><span>基础单价</span><strong>{{ formatEstimateMoney(priceEstimate.unitPrice, priceEstimate.currency) }} / {{ priceEstimate.chargeUnit }}</strong></div>
               <div class="price-estimate__amount"><span>参考运费</span><strong>{{ formatEstimateMoney(priceEstimate.estimatedAmount, priceEstimate.currency) }}</strong></div>
               <small>{{ priceEstimateDisclaimer }}</small>
@@ -2051,10 +2067,13 @@ async function searchOrders(model: QueryModel) {
 .price-estimate__state.is-error > div { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
 .price-estimate__state.is-error strong { color: #7a2e0e; font-size: 13px; }
 .price-estimate__state.is-error span { overflow-wrap: anywhere; }
-.price-estimate__result { display: grid; grid-template-columns: minmax(190px, 1.3fr) repeat(2, minmax(140px, .8fr)) minmax(190px, 1fr); align-items: stretch; }
+.price-estimate__result { display: grid; grid-template-columns: minmax(180px, 1.15fr) minmax(220px, 1.25fr) minmax(170px, .9fr) minmax(140px, .8fr) minmax(190px, 1fr); align-items: stretch; }
 .price-estimate__result > div { display: flex; min-width: 0; min-height: 96px; justify-content: center; flex-direction: column; gap: 7px; padding: 18px 20px; border-right: 1px solid #edf0f5; }
 .price-estimate__result > div > span { color: #8b96a6; font-size: 11px; }
 .price-estimate__result > div > strong { overflow-wrap: anywhere; color: #303b50; font-size: 15px; }
+.price-estimate__comparison strong { font-size: 13px !important; font-weight: 600; }
+.price-estimate__comparison small, .price-estimate__chargeable small { color: #7b8798; font-size: 10px; line-height: 1.4; }
+.price-estimate__chargeable strong { color: #526fd8 !important; font-size: 18px !important; }
 .price-estimate__channel small { color: #7b8798; font-size: 10px; line-height: 1.5; }
 .price-estimate__result .price-estimate__amount { border-right: 0; background: #f8f8ff; }
 .price-estimate__result .price-estimate__amount strong { color: #637fec; font-size: 25px; }