<!-- 方法确认登记表详情 -->
<script name="FileMethodConfirmDetailApproved" lang="ts" setup>
import { ElMessage } from 'element-plus'
import VuePdfEmbed from 'vue-pdf-embed'
// import * as pdfjsLib from 'pdfjs-dist'
import { getPhotoUrl } from '@/api/file'
import { exportFile } from '@/utils/exportUtils'
import { getBase64, getObjectURL } from '@/utils/download'
import { exportFileMethod } from '@/api/resource/fileConfirm'

// 从路由中传过来的参数
const id = ref<string>('')
const formNo = ref<string>('')

const route = useRoute()
const router = useRouter()

const loading = ref<boolean>(true)
const pdfUrl = ref('') // 打印文件url

// 逻辑
// 关闭
const resetForm = () => {
  router.go(-1)
}

// 打印
const printClickedHandler = () => {
  ElMessage.success('打印成功')
}

// 打印Word
const printToWord = () => {
  exportFileMethod({ id: id.value, pdf: false }).then((res) => {
    exportFile(res.data, `方法确认登记表-${formNo.value}.doc`)
  })
}

// 打印PDF
const printToPDF = () => {
  exportFileMethod({ id: id.value, pdf: true }).then((res) => {
    exportFile(res.data, `方法确认登记表-${formNo.value}.pdf`)
  })
}

const initDialog = (params: any) => {
  // 从路由中获取参数
  id.value = params.id !== undefined ? params.id : ''
  formNo.value = params.fileNo !== undefined ? params.fileNo : ''

  exportFileMethod({ id: id.value, pdf: true }).then((res) => {
    getBase64(res.data).then((res) => {
      pdfUrl.value = res as string
    })
    // pdfjsLib.GlobalWorkerOptions.workerSrc = '/pdf.worker.js'
    loading.value = false
  })
}

onMounted(() => {
  initDialog(route.query)
})
</script>

<template>
  <app-container>
    <detail-page title="方法确认登记表">
      <template #btns>
        <el-button type="primary" @click="printToWord">
          导出Word
        </el-button>
        <el-button type="primary" @click="printToPDF">
          导出PDF
        </el-button>
        <el-button type="primary" @click="printClickedHandler">
          打印
        </el-button>

        <el-button type="info" @click="resetForm()">
          关闭
        </el-button>
      </template>

      <div v-loading="loading">
        <vue-pdf-embed v-show="!loading" ref="pdf" :source="pdfUrl" class="vue-pdf-embed" />
      </div>
    </detail-page>
  </app-container>
</template>