<script lang="ts" setup>
/**
 * 拒绝开票申请弹窗
 */
import { ref } from 'vue';

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

import { Input, message } from 'ant-design-vue';

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

const reason = ref('');
const rowId = ref(0);
const gridApi = ref<any>();

const [Modal, modalApi] = useVbenModal({
  fullscreenButton: false,
  draggable: true,
  onCancel() {
    modalApi.close();
  },
  async onConfirm() {
    const text = reason.value.trim();
    if (!text) {
      message.warning('请填写拒绝原因');
      return;
    }
    modalApi.setState({ loading: true, confirmLoading: true });
    try {
      await rejectInvoiceApi({ id: rowId.value, reject_reason: text });
      message.success('已拒绝');
      gridApi.value?.reload?.();
      modalApi.close();
    } finally {
      modalApi.setState({ loading: false, confirmLoading: false });
    }
  },
  onOpenChange(isOpen: boolean) {
    if (!isOpen) return;
    const data = modalApi.getData<Record<string, any>>() || {};
    rowId.value = Number(data.id || 0);
    gridApi.value = data.gridApi;
    reason.value = '';
  },
});
</script>

<template>
  <Modal title="拒绝开票申请" class="w-[480px]">
    <div class="py-2">
      <div class="mb-2 text-sm text-muted-foreground">拒绝后患者可重新申请开票</div>
      <Input.TextArea v-model:value="reason" :rows="4" placeholder="请填写拒绝原因" />
    </div>
  </Modal>
</template>
