<template>
  <BasicModal
    v-bind="$attrs"
    destroyOnClose
    @register="registerModal"
    :title="getTitle"
    :width="width"
    :showOkBtn="false"
    :showCancelBtn="true"
    :showFooter="true"
  >
    <div class="!px-6 !pt-4">详情{{ tableData }}</div>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  // import { useMessage } from '/@/hooks/web/useMessage';
  import { bedScheduledPersonDetail } from '/@/api/biz/bed/scheduledPersonApi';
  const getTitle = ref();
  const width = '45%';
  const tableData = ref(null);

  // const { createMessage } = useMessage();

  const [registerModal, { setModalProps }] = useModalInner(async data => {
    setModalProps({ confirmLoading: false });
    getTitle.value = `排班详情 ( ${data.record.patientName} | ${data.record.gender} | ${data.record.age}岁 )`;
    const resData = await bedScheduledPersonDetail(data.record.patientBasicId);
    console.log('🚀 ~ file: FormModalDetail.vue:29 ~ resData:', resData);
    tableData.value = resData;
  });
</script>
