fix(payment): show full amount breakdown on payment result page
- Show base amount (充值金额) as first line - Show fee amount with percentage when fee_rate > 0 - Show pay_amount (实付金额) in bold primary color - Show credited amount (到账金额) when different from pay_amount - Compute baseAmount and feeAmount from backend order data
This commit is contained in:
@@ -37,12 +37,16 @@
|
||||
<span class="font-medium text-gray-900 dark:text-white">{{ order.out_trade_no }}</span>
|
||||
</div>
|
||||
<div class="flex justify-between">
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ t('payment.orders.payAmount') }}</span>
|
||||
<span class="font-medium text-gray-900 dark:text-white">¥{{ order.pay_amount.toFixed(2) }}</span>
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ t('payment.orders.baseAmount') }}</span>
|
||||
<span class="font-medium text-gray-900 dark:text-white">¥{{ baseAmount.toFixed(2) }}</span>
|
||||
</div>
|
||||
<div v-if="order.fee_rate > 0" class="flex justify-between">
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ t('payment.orders.fee') }} ({{ order.fee_rate }}%)</span>
|
||||
<span class="text-xs text-gray-400 dark:text-gray-500">{{ t('payment.orders.includedInPayAmount') }}</span>
|
||||
<span class="font-medium text-gray-900 dark:text-white">¥{{ feeAmount.toFixed(2) }}</span>
|
||||
</div>
|
||||
<div class="flex justify-between">
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ t('payment.orders.payAmount') }}</span>
|
||||
<span class="font-bold text-primary-600 dark:text-primary-400">¥{{ order.pay_amount.toFixed(2) }}</span>
|
||||
</div>
|
||||
<div v-if="order.amount !== order.pay_amount" class="flex justify-between">
|
||||
<span class="text-gray-500 dark:text-gray-400">{{ t('payment.orders.creditedAmount') }}</span>
|
||||
@@ -112,6 +116,18 @@ const returnInfo = ref<ReturnInfo | null>(null)
|
||||
|
||||
const SUCCESS_STATUSES = new Set(['COMPLETED', 'PAID', 'RECHARGING'])
|
||||
|
||||
/** 充值金额 = pay_amount / (1 + fee_rate/100),fee_rate=0 时等于 pay_amount */
|
||||
const baseAmount = computed(() => {
|
||||
if (!order.value || order.value.fee_rate <= 0) return order.value?.pay_amount ?? 0
|
||||
return Math.round((order.value.pay_amount / (1 + order.value.fee_rate / 100)) * 100) / 100
|
||||
})
|
||||
|
||||
/** 手续费 = pay_amount - baseAmount */
|
||||
const feeAmount = computed(() => {
|
||||
if (!order.value || order.value.fee_rate <= 0) return 0
|
||||
return Math.round((order.value.pay_amount - baseAmount.value) * 100) / 100
|
||||
})
|
||||
|
||||
const isSuccess = computed(() => {
|
||||
// Always prioritize actual order status from backend
|
||||
if (order.value) {
|
||||
|
||||
Reference in New Issue
Block a user