<!-- 详情抽屉 -->
<template>
  <a-drawer
    v-model:visible="vdata.visible"
    width="50%"
    :closable="true"
    title="记录详情"
    @close="vdata.visible = false"
  >
    <a-row justify="space-between" type="flex">
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账退款订单号">{{ vdata.detailData.divisionRefundId }}</a-descriptions-item></a-descriptions></a-col>

      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账记录ID">{{ vdata.detailData.divisionRecordId }}</a-descriptions-item></a-descriptions></a-col>

      <a-col :sm="12"><a-descriptions><a-descriptions-item label="用户号">{{ vdata.detailData.mchNo }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="应用ID">{{ vdata.detailData.appId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="支付接口">{{ vdata.detailData.ifCode }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="系统支付订单号">{{ vdata.detailData.payOrderId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="支付订单退款单号">{{ vdata.detailData.payOrderRefundOrderId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="支付订单渠道支付订单号">{{ vdata.detailData.payOrderChannelOrderNo }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="订单金额">{{ vdata. detailData.payOrderAmount / 100 }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="支付订单退款金额">{{ vdata. detailData.payOrderRefundAmount / 100 }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="系统分账批次号">{{ vdata.detailData.divisionBatchOrderId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12">
        <a-descriptions>
          <a-descriptions-item label="状态">
            <a-tag v-if="vdata.detailData.state == 0" color="orange">回退中</a-tag>
            <a-tag v-if="vdata.detailData.state == 1" color="blue">回退成功</a-tag>
            <a-tag v-if="vdata.detailData.state == 2" color="volcano">回退失败</a-tag>
          </a-descriptions-item>
        </a-descriptions>
      </a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账接收者ID">{{ vdata.detailData.receiverId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="收款账号组ID">{{ vdata. detailData.receiverGroupId }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="收款账号别名">{{ vdata.detailData.receiverAlias }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账接收账号类型">{{ vdata.detailData.accType == 0 ? '个人' : '商户' }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账接收账号">{{ vdata.detailData.accNo }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账接收账号名称">{{ vdata.detailData.accName }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账关系类型">{{ vdata.detailData.relationType }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账关系类型名称">{{ vdata.detailData.relationTypeName }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="实际分账比例">{{ (vdata.detailData.divisionProfit * 100).toFixed(2) }}%</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="分账金额">{{ vdata.detailData.divisionAmount / 100 }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="回退金额">{{ vdata.detailData.divisionRefundAmount / 100 }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="创建时间">{{ vdata.detailData.createdAt }}</a-descriptions-item></a-descriptions></a-col>
      <a-col :sm="12"><a-descriptions><a-descriptions-item label="更新时间">{{ vdata.detailData.updatedAt }}</a-descriptions-item></a-descriptions></a-col>
    </a-row>
    <a-divider />
    <a-row justify="start" type="flex">
      <a-col :sm="24">
        <span style="color: black;">上游返回错误码：</span>
        <a-form-item>
          <a-textarea v-model:value="vdata.detailData.errCode" type="textarea" disabled="disabled" :rows="4" style="color: black;margin-top: 10px" />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row justify="start" type="flex">
      <a-col :sm="24">
        <span style="color: black;">上游返回错误数据包：</span>
        <a-form-item>
          <a-textarea v-model:value="vdata.detailData.errMsg" type="textarea" disabled="disabled" :rows="4" style="color: black;margin-top: 10px" />
        </a-form-item>
      </a-col>
    </a-row>
  </a-drawer>
</template>
<script setup lang="ts">
import { API_URL_PAY_ORDER_DIVISION_REFUND_RECORD_LIST, req } from '@/api/manage'
import { reactive } from 'vue'


    const vdata =  reactive({
      visible: false,
      detailData: {} as any
    })

defineExpose({show})
  function show (recordId) {
     
      req.getById(API_URL_PAY_ORDER_DIVISION_REFUND_RECORD_LIST, recordId).then(res => {
        vdata.detailData = res
      })
      vdata.visible = true
    }

</script>
