<!-- 文件预览弹窗 -->
<script lang="ts" setup name="FilePreviewDialog">
import VuePdfEmbed from 'vue-pdf-embed'
// import * as pdfjsLib from 'pdfjs-dist'
import { ElLoading } from 'element-plus'
import { getBase64, getObjectURL } from '@/utils/download'
import { getStream } from '@/api/business/subpackage/inform'
const dialogVisible = ref(false) // 弹窗显示状态
const pdfUrl = ref('') // 打印文件url
const loading = ref(false)
/**
 * 初始化审批弹窗
 * @param id
 */
function initDialog(id: string) {
  dialogVisible.value = true
  loading.value = true
  getStream({ id, pdf: true }).then((res) => {
    getBase64(res.data).then((res) => {
      pdfUrl.value = res as string
    })
    // pdfjsLib.GlobalWorkerOptions.workerSrc = '/pdf.worker.js'
    loading.value = false
  }).catch(() => loading.value = false)
}

// 关闭弹窗
function handleClose() {
  dialogVisible.value = false
}

// ----------------------- 以下是暴露的方法内容 ----------------------------
defineExpose({ initDialog })
</script>

<template>
  <el-dialog
    v-model="dialogVisible"
    title="文件预览"
    width="80%"
    :before-close="handleClose"
  >
    <!-- pdf预览 -->
    <vue-pdf-embed ref="pdf" v-loading="loading" :source="pdfUrl" class="vue-pdf-embed" />
    <template #footer>
      <el-button type="info" @click="handleClose">
        关闭
      </el-button>
    </template>
  </el-dialog>
</template>

<style lang="scss" scoped>
// 样式
</style>