<template>
  <a-card class="general-card" title="淘宝订单日志">
    <a-table :columns="columns" :data="renderTableData" />
  </a-card>
</template>

<script lang="tsx" setup>
import {
  queryTMallOrderOrderHistory,
  RechargeTMallShopOrderHistory,
  RechargeTMallShopOrderStatus
} from '@/api/t-mall-game-shop-order';
import { TableColumnData, TableData } from '@arco-design/web-vue';
import { ref, watchEffect } from 'vue';
const props = defineProps({
  shopId: {
    type: Number,
    default: 0
  }
});

function transfromStatusLabel(status: RechargeTMallShopOrderStatus): string {
  switch (status) {
    case RechargeTMallShopOrderStatus.ReceiveCallback:
      return '收到回调';
    case RechargeTMallShopOrderStatus.Paid:
      return '支付';
    case RechargeTMallShopOrderStatus.DeliverySucceed:
      return '发货成功';
    case RechargeTMallShopOrderStatus.DeliveryFailed:
      return '发货失败';
    case RechargeTMallShopOrderStatus.ConfirmOrder:
      return '确认收货';
    case RechargeTMallShopOrderStatus.BindOrderFail:
      return '绑定订单失败';
    case RechargeTMallShopOrderStatus.BindOrderSucceed:
      return '绑定订单成功';
    case RechargeTMallShopOrderStatus.EvaluationGood:
      return '用户好评';
    case RechargeTMallShopOrderStatus.EvaluationBad:
      return '用户差评';
    case RechargeTMallShopOrderStatus.EvaluatedSucceed:
      return '好评成功';
    case RechargeTMallShopOrderStatus.EvaluatedFailed:
      return '好评失败';
    default:
      return '未知状态';
  }
}
const renderTableData = ref<RechargeTMallShopOrderHistory[]>([]);
const columns: TableColumnData[] = [
  {
    title: '状态',
    dataIndex: 'status',
    render(data: {
      record: TableData;
      column: TableColumnData;
      rowIndex: number;
    }) {
      return transfromStatusLabel(
        data.record.status as RechargeTMallShopOrderStatus
      );
    }
  },
  {
    title: '创建时间',
    dataIndex: 'createdAt'
  },
  {
    title: '备注',
    dataIndex: 'remark'
  }
];
const fetchOrderHistoryData = () => {
  queryTMallOrderOrderHistory({
    shopId: props.shopId
  }).then(res => {
    renderTableData.value = res.data.list;
  });
};
watchEffect(() => {
  if (props.shopId) {
    fetchOrderHistoryData();
  }
});
</script>
