menduner-admin/src/views/menduner/system/invoice/uploadInvoice.vue

<template>
  <Dialog title="上传发票" v-model="dialogVisible">
    <UploadFile
      v-model="itemData.fileUrl"
      :file-type="['pdf']"
      :limit="1"
      :drag="true"
      class="min-w-80px"
    />
    <template #footer>
      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
      <el-button @click="handleClose">取 消</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
defineOptions({ name: 'UploadInvoice'})
import { ref } from 'vue'
import { InvoiceApi } from '@/api/menduner/system/invoice'

const emit = defineEmits(['refresh'])
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false)
const formLoading = ref(false)
const itemData = ref({
  id: '',
  fileUrl: ''
})

/** 打开弹窗 */
const open = async (id: string) => {
  dialogVisible.value = true
  itemData.value.id = id
}

const handleClose = () => {
  dialogVisible.value = false
  itemData.value = {
    id: '',
    fileUrl: ''
  }
}

const submitForm = () => {
  if (!itemData.value.fileUrl) return message.warning('请上传发票')
  InvoiceApi.uploadInvoice(itemData.value)
  message.success('上传成功')
  handleClose()
  emit('refresh')
}

defineExpose({ open }) // 提供 open 方法，用于打开弹窗
</script>