<script lang="ts" setup>
import { ref } from 'vue';

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

import { message, Radio, RadioGroup, Textarea } from 'ant-design-vue';

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

const [ModalComponent, modalApi] = useVbenModal({
  fullscreenButton: false,
  draggable: true,
  onCancel() {
    modalApi.close();
  },
});

const auditStatus = ref<number>(1);
const auditRemark = ref<string>('');
const currentRow = ref<any>(null);
const gridApi = ref<any>(null);
const loading = ref(false);

const handleAudit = async () => {
  if (!currentRow.value) {
    message.error('数据错误');
    return;
  }

  loading.value = true;
  try {
    await auditDoctorInput({
      id: currentRow.value.id,
      status: auditStatus.value,
      audit_remark: auditRemark.value,
    });
    message.success('审核成功');
    gridApi.value?.reload();
    modalApi.close();
    auditStatus.value = 1;
    auditRemark.value = '';
  } catch (error) {
    console.error('审核失败:', error);
    message.error('审核失败，请稍后重试');
  } finally {
    loading.value = false;
  }
};

modalApi.onOpenChange = (isOpen: boolean) => {
  if (isOpen) {
    const { values, gridApi: api } = modalApi.getData<Record<string, any>>();
    currentRow.value = values;
    gridApi.value = api;
    auditStatus.value = 1;
    auditRemark.value = '';
  }
};
</script>

<template>
  <ModalComponent
    title="审核医生预填"
    class="w-[500px]"
    :confirm-loading="loading"
    @confirm="handleAudit"
  >
    <div class="space-y-4 p-4">
      <div>
        <div class="mb-2 font-semibold">审核结果：</div>
        <RadioGroup v-model:value="auditStatus">
          <Radio :value="1">审核通过</Radio>
          <Radio :value="2">审核拒绝</Radio>
        </RadioGroup>
      </div>
      <div>
        <div class="mb-2 font-semibold">审核备注：</div>
        <Textarea
          v-model:value="auditRemark"
          :rows="4"
          placeholder="请输入审核备注（可选）"
        />
      </div>
    </div>
  </ModalComponent>
</template>
