<!-- 设备禁用申请 -->
<script name="stateMaintenanceBanDetail" lang="ts" setup>
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import * as pdfjsLib from 'pdfjs-dist'
import { getStream } from '@/api/equipment/standardStateMaintenance/stateMaintenance'
import filePreview from '@/components/filePreview/filePreview.vue'
import { getBase64, getObjectURL } from '@/utils/download'
import { exportFile } from '@/utils/exportUtils'
import { printPdf } from '@/utils/printUtils'
const loading = ref(false) // 表单加载状态
const infoId = ref('') // id
const printFileName = ref('') // 文件名
const $route = useRoute()
const $router = useRouter()
const fromPage = ref('') // 来源页面
const pdfUrl = ref('') // pdfurl
const pdfStream = ref() as any // pdf流
// --------------------------------------路由参数----------------------------------------------
// 从路由中获取页面类型参数
if ($route.params) {
if ($route.params.id) {
infoId.value = $route.params.id as string
}
}
// -----------------------------------------按钮--------------------------------------------------
// 关闭新增页面的回调
const close = () => {
$router.back()
}
// 导出word
const exportWord = () => {
const loading = ElLoading.service({
lock: true,
text: '加载中...',
background: 'rgba(255, 255, 255, 0.6)',
})
getStream({ id: infoId.value, pdf: false }).then((res) => {
exportFile(res.data, '设备禁用申请.doc')
loading.close()
})
}
// 导出pdf
const exportPdf = () => {
exportFile(pdfStream.value, '设备禁用申请.pdf')
}
// 打印
const print = () => {
const blobUrl = URL.createObjectURL(pdfStream.value)
printPdf(blobUrl)
}
// -----------------------------------------------------------------------------------------------
/**
* 初始化
*/
function init() {
const loading = ElLoading.service({
lock: true,
text: '加载中...',
background: 'rgba(255, 255, 255, 0.6)',
})
getStream({ id: infoId.value, pdf: true }).then((res) => {
pdfStream.value = new Blob([res.data])
getBase64(res.data).then((res) => {
pdfUrl.value = res as string
})
pdfjsLib.GlobalWorkerOptions.workerSrc = '/pdf.worker.js'
loading.close()
})
}
// -----------------------------------------钩子--------------------------------------------------
onMounted(() => {
init()
})
</script>
<template>
<app-container>
<detail-page v-loading="loading" title="设备禁用申请">
<template #btns>
<el-button v-if="fromPage !== 'equipment'" type="primary" @click="exportWord">
导出word
</el-button>
<el-button v-if="fromPage !== 'equipment'" type="primary" @click="exportPdf">
导出pdf
</el-button>
<el-button v-if="fromPage !== 'equipment'" type="primary" @click="print">
打印
</el-button>
<el-button type="info" @click="close">
关闭
</el-button>
</template>
</detail-page>
<div style="display: flex;justify-content: center; margin-top: 10px;width: 100%;">
<file-preview :pdf-url="pdfUrl" style="width: 70%;" />
</div>
</app-container>
</template>
<style lang="scss" scoped>
// 样式
</style>