<!-- 预防措施处理单详情页面 -->
<script name="QualityScenePlanDetail" lang="ts" setup>
import { ElMessage } from 'element-plus'
import edit from './edit.vue'
import { exportFile, printContent } from '@/utils/exportUtils'
import { getFiles } from '@/utils/download'
import { getInternalSenceFile } from '@/api/quality/internal/scene'
import pdfFile from '@/views/quality/supervise/record/components/pdfFile.vue'
const $router = useRouter()
const close = () => {
  $router.push({
    path: '/internal/internalscene',
  })
}
const baseRef = ref()
const $route = useRoute()
const showMenu = () => {
  return baseRef?.value?.showMenu === '基本信息'
}
const { proxy } = getCurrentInstance() as any
const file = ref()
const getFile = (fun: any) => {
  getInternalSenceFile({
    id: $route.query.id,
    pdf: true,
  }).then((res) => {
    if (res.data.type.includes('json')) {
      ElMessage.error('文件获取失败')
      fun()
      return
    }
    file.value = res.data
    fun(res)
  }).catch(() => {
    fun()
    ElMessage.error('文件获取失败')
  })
}
// 打印
const printFile = () => {
  if (file.value) {
    printContent(getFiles(file.value, 'application/pdf;chartset=UTF-8'))
  }
  else {
    ElMessage.warning('打印失败')
  }
}
// 下载
const downloadFile = () => {
  if (file.value) {
    const data = JSON.parse($route.query.data as string)
    exportFile(file.value, '内部审核报告.pdf')
  }
  else {
    ElMessage.warning('下载失败')
  }
}
</script>

<template>
  <app-container style="overflow: hidden;">
    <detail-page title="现场审核计划">
      <template #btns>
        <el-button v-if="proxy.hasPerm('/quality/internal/scene/download')" type="primary" @click="downloadFile">
          下载
        </el-button>
        <el-button v-if="proxy.hasPerm('/quality/internal/scene/print')" type="primary" @click="printFile">
          打印
        </el-button>
        <el-button type="info" @click="close">
          关闭
        </el-button>
      </template>
    </detail-page>
    <div class="base-info-report">
      <!-- 展示文件流 -->
      <!-- <div>
        文件流
      </div> -->
      <pdf-file @get-file="getFile" />
    </div>
  </app-container>
</template>

<style lang="scss" scoped>
.base-info-report {
  ::v-deep(.app-container) {
    padding: 0 !important;

    .info-header {
      display: none;
    }

    .info-body {
      display: none;
    }
  }
}
</style>