liujie
2026-09-09 39f6fca28e3f78abe48f08e474ec011abb990b36
frontend/src/views/OrdersView.vue
@@ -24,14 +24,34 @@
const refundOrderRecord = ref(null)
const refundForm = reactive({ amount: '' })
const visitorId = Number(route.query.visitorId) || undefined
const guideId = Number(route.query.guideId) || undefined
const query = reactive({ page: 1, size: 10, keyword: '', scenicName: null, status: null })
const paymentMethodMap = { WECHAT: '微信支付', ALIPAY: '支付宝' }
const refundStatusMap = {
  REFUNDING: '\u9000\u6b3e\u5904\u7406\u4e2d',
  PARTIAL: '\u90e8\u5206\u9000\u6b3e',
  REFUND_FAILED: '\u9000\u6b3e\u5931\u8d25',
}
const refundStatusTypeMap = { REFUNDING: 'warning', PARTIAL: 'warning', REFUND_FAILED: 'danger' }
const formatDateTime = (value) => value ? value.replace('T', ' ').slice(0, 19) : '-'
const formatMoney = (value) => Number(value || 0).toFixed(2)
const canRefund = (order) => refundableOrderStatuses.includes(order.status)
const getRefundableAmount = (order) => Number(
  order.refundableAmount
    ?? (Number(order.paymentAmount ?? order.amount ?? 0) - Number(order.refundedAmount ?? 0)),
)
const canRefund = (order) => (refundableOrderStatuses.includes(order.status)
  || (order.status === 'CANCELLED' && ['PARTIAL', 'REFUND_FAILED'].includes(order.refundStatus)))
  && !['REFUNDING', 'REFUNDED'].includes(order.refundStatus)
  && getRefundableAmount(order) > 0
const statusLabel = (order) => refundStatusMap[order.refundStatus] || orderStatusMap[order.status] || order.status
const statusType = (order) => refundStatusTypeMap[order.refundStatus] || orderStatusTypeMap[order.status] || 'info'
const refundableAmount = computed(() => Number(
  refundOrderRecord.value?.refundableAmount
    ?? (Number(refundOrderRecord.value?.paymentAmount ?? refundOrderRecord.value?.amount ?? 0)
      - Number(refundOrderRecord.value?.refundedAmount ?? 0)),
))
const paymentAmount = computed(() => Number(
  refundOrderRecord.value?.paymentAmount ?? refundOrderRecord.value?.amount ?? 0,
))
const loadOrders = async () => {
@@ -39,7 +59,7 @@
  try {
    const [startDate, endDate] = dateRange.value || []
    const result = await getOrders({
      page: query.page, size: query.size, keyword: query.keyword.trim() || undefined, visitorId,
      page: query.page, size: query.size, keyword: query.keyword.trim() || undefined, visitorId, guideId,
      scenicName: query.scenicName || undefined, status: query.status || undefined, startDate, endDate,
    })
    records.value = result.records
@@ -80,8 +100,12 @@
  }
  refundSubmitting.value = true
  try {
    await refundOrder(refundOrderRecord.value.id, amount.toFixed(2))
    ElMessage.success('退款成功')
    const result = await refundOrder(refundOrderRecord.value.id, amount.toFixed(2))
    if (result?.refundStatus === 'REFUNDED') {
      ElMessage.success('退款成功')
    } else {
      ElMessage.info('退款申请已提交,等待支付渠道确认')
    }
    refundDialogVisible.value = false
    await loadOrders()
  } finally {
@@ -158,7 +182,9 @@
        <el-table-column label="下单时间" min-width="160" align="center">
          <template #default="{ row }">{{ formatDateTime(row.placedAt) }}</template>
        </el-table-column>
        <el-table-column prop="meetingPointCount" label="讲解路线汇合点" min-width="115" align="center" />
        <el-table-column label="讲解路线汇合点" min-width="115" align="center">
          <template #default="{ row }">{{ row.meetingPointName || '-' }}</template>
        </el-table-column>
        <el-table-column prop="guideName" label="导游姓名" min-width="100" align="center">
          <template #default="{ row }">{{ row.guideName || '-' }}</template>
        </el-table-column>
@@ -167,7 +193,7 @@
        </el-table-column>
        <el-table-column label="状态" min-width="125" fixed="right" align="center">
          <template #default="{ row }">
            <el-tag :type="orderStatusTypeMap[row.status] || 'info'" effect="plain">{{ orderStatusMap[row.status] || row.status }}</el-tag>
            <el-tag :type="statusType(row)" effect="plain">{{ statusLabel(row) }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="125" fixed="right" align="center">
@@ -214,7 +240,7 @@
          <span class="refund-label">订单金额</span>
          <strong>¥{{ formatMoney(refundOrderRecord.amount) }}</strong>
          <span class="refund-label">实际支付</span>
          <strong>¥{{ formatMoney(refundableAmount) }}</strong>
          <strong>¥{{ formatMoney(paymentAmount) }}</strong>
          <span class="refund-label">支付流水号</span>
          <span class="refund-flow-no">{{ refundOrderRecord.paymentOrderNo || '-' }}</span>