<!-- 详情展示报告公共组件 -->
<script name="SubpackageDirectoriesDetail" lang="ts" setup>
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
// import * as pdfjsLib from 'pdfjs-dist'
import filePreview from '@/components/filePreview/filePreview.vue'
// import FilterSysUser from '@/views/resource/person/register/filterSysUser.vue'
import FilterSysUser from '@/views/resource/common/filterSysUser.vue'
import { getStream, handleCustomerAgreeOrRefuse } from '@/api/business/subpackage/inform'
import { exportFile } from '@/utils/exportUtils'
import { printPdf } from '@/utils/printUtils'
import { getBase64, getObjectURL } from '@/utils/download'
const props = defineProps({
  title: { // 标题
    type: String,
    default: '',
  },
  needSend: { // 是否需要发送到受检单位
    type: Boolean,
    default: false,
  },
  id: {
    type: String,
    default: '',
  },
})
const emits = defineEmits(['sendMessage'])
const loading = ref(false) // 表单加载状态
const infoId = ref('') // id
const printFileName = ref('') // 文件名
const $route = useRoute()
const $router = useRouter()
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 refFilterDialog = ref()
// 发送给受检单位
const sendToCustomer = () => {
  refFilterDialog.value.showOrHideFilterDialog(true)
}

// 选好收件单位发送人
const recordSelectedHandler = (row: any) => {
  refFilterDialog.value.showOrHideFilterDialog(false)
  if (row.id !== '') {
    emits('sendMessage', row)
  }
  else {
    ElMessage.error('发送至人员不能为空，请重新选择')
  }
}

// 关闭新增页面的回调
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 = () => {
  console.log(pdfStream.value)

  exportFile(pdfStream.value, '测试、校准或检定工作分包通知书.pdf')
}

// 打印
const print = () => {
  const blobUrl = URL.createObjectURL(pdfStream.value)
  printPdf(blobUrl)
}
// -----------------------------------------处理委托方意见--------------------------------------------------
// 处理委托方意见，同意或拒绝
const handleClick = (type: 'agree' | 'refuse') => {
  const title = type === 'agree' ? '同意' : '拒绝'
  ElMessageBox.confirm(
        `确认${title}吗？`,
        '提示',
        {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        },
  )
    .then(() => {
      const params = {
        id: infoId.value,
        agreeOrRefuse: type === 'agree' ? '1' : '2',
      }
      handleCustomerAgreeOrRefuse(params).then((res) => {
        ElMessage({
          type: 'success',
          message: `已${title}`,
        })
      })
    })
}
// -----------------------------------------钩子--------------------------------------------------

/**
 * 初始化
 */
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()
  }).catch(() => loading.close())
}

onMounted(() => {
  init()
})
</script>

<template>
  <app-container>
    <detail-page v-loading="loading" :title="title">
      <template #btns>
        <el-button type="primary" @click="handleClick('agree')">
          同意（测试专用，后续隐藏）
        </el-button>
        <el-button type="danger" @click="handleClick('refuse')">
          拒绝（测试专用，后续隐藏）
        </el-button>
        <el-button v-if="props.needSend" type="primary" @click="sendToCustomer">
          发送给受检单位
        </el-button>
        <el-button type="primary" @click="exportWord">
          导出word
        </el-button>
        <el-button type="primary" @click="exportPdf">
          导出pdf
        </el-button>
        <el-button 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>
  <filter-sys-user ref="refFilterDialog" @record-selected="recordSelectedHandler" />
</template>

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