<script lang="ts" setup>

import { ref } from 'vue';



import { useVbenModal } from '@vben/common-ui';



import { useVbenVxeGrid } from '#/adapter/vxe-table';

import { TableAction } from '#/components/table-action';



import { getHyTransitRecordList } from '../api';

import { hasErrorTextClass } from '../utils';
import FailDetailModal from './fail-detail-modal.vue';



const batchId = ref(0);



const [Modal, modalApi] = useVbenModal({

  fullscreenButton: true,

  draggable: true,

  onOpenChange(isOpen: boolean) {

    if (isOpen) {

      batchId.value = modalApi.getData()?.batchId ?? 0;

      gridApi.reload();

    }

  },

});



const [DetailModal, detailModalApi] = useVbenModal({

  connectedComponent: FailDetailModal,

});



const showDetail = (row: { id: number }) => {

  detailModalApi.setData({ id: row.id });

  detailModalApi.open();

};



const [Grid, gridApi] = useVbenVxeGrid({

  gridOptions: {

    height: 480,

    columns: [

      { field: 'id', title: 'ID', width: 70 },

      { field: 'step_txt', title: '类型', width: 100 },

      { field: 'register_id', title: '挂号ID', width: 85 },

      { field: 'prescription_id', title: '处方ID', width: 85 },

      { field: 'order_id', title: '订单ID', width: 85 },

      { field: 'prescription_no', title: '处方编号', width: 130 },

      { field: 'patient_name', title: '患者', width: 80 },

      { field: 'pull_status_txt', title: '拉取', width: 80 },

      { field: 'push_status_txt', title: '上报', width: 80 },

      { field: 'callback_status_txt', title: '回调', width: 80 },

      {
        field: 'error_summary',
        title: '校验/报错',
        minWidth: 180,
        showOverflow: true,
        slots: { default: 'error_summary' },
      },

      { type: 'html', title: '操作', width: 100, slots: { default: 'action' } },

    ],

    pagerConfig: {},

    proxyConfig: {

      ajax: {

        query: async ({ page }) => {

          return await getHyTransitRecordList({

            page: page.currentPage,

            pageSize: page.pageSize,

            batch_id: batchId.value,

          });

        },

      },

    },

  },

});

</script>



<template>

  <Modal class="w-[90%]" title="批次明细">

    <DetailModal />

    <Grid>
      <template #error_summary="{ row }">
        <span :class="hasErrorTextClass(row.error_summary)">
          {{ row.error_summary || '-' }}
        </span>
      </template>

      <template #action="{ row }">

        <TableAction

          :actions="[

            {

              label: '查看回调',

              type: 'link',

              onClick: () => showDetail(row),

            },

          ]"

        />

      </template>

    </Grid>

  </Modal>

</template>

