<!--
@description: 采购单变更公告记录pdf组件，驱动内和审批查看使用
@Modifier: 郝凤仙
@routerPath:
@date: 2021-8-25 11:09
-->
<template>
  <div>
    <pdf v-if="isPdf" :pdf-url="pdfUrl" />
    <div v-else v-html="htmlContent" />
  </div>
</template>

<script>
/* api */
import { changeBulletinHtmlById } from '@/api/procurement/procurementBulletin' // 公开类采购变更记录查看
import { changeInvitaitonHtmlById } from '@/api/procurement/procurementInvitation' // 邀请类采购单变更记录查询
import { readImageRoot } from '@api/common/uploadCenter' // 图片查看路径
import { getFileDetail } from '@/api/common/uploadCenter' // 文件下载方法
/* 组件*/
import pdf from '@comp/common/pdf/pdf'
/* 公共方法*/
import { procurementAlterMixin } from './mixins/procurementAlterMixin'
export default {
  name: 'OfferQuotationPdfDetailVue',
  components: { pdf },
  mixins: [procurementAlterMixin],
  props: {
    tenderType: {
      type: String,
      default: ''
    },
    id: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      isPdf: true,
      pdfUrl: '',
      htmlContent: '',
      readImageUrl: readImageRoot
    }
  },
  watch: {
    id(val) {
      if (val) {
        this.queryChangeMessageRequest(val)
      }
    }
  },
  mounted() {
    this.queryChangeMessageRequest(this.id)
  },
  methods: {
    // 查看变更记录请求
    queryChangeMessageRequest(id) {
      const params = {
        bizId: id,
        fileType: this.tenderType === '00' ? 'prot_procurement_bulletin_and_change_pdf' : 'prot_procurement_invitation_bulletin_pdf'
      }
      getFileDetail(params).then((response) => {
        this.isPdf = response.data.length > 0
        const url = this.readImageUrl + response.data[0].path
        this.pdfUrl = encodeURIComponent(url)
        if (this.isPdf) return
      })
      // 公开类项目
      if (this.tenderType === '00') {
        changeBulletinHtmlById(id).then((res) => {
          this.htmlContent = res.data
        }).catch(() => {})
      } else {
        // 邀请类项目
        changeInvitaitonHtmlById(id).then((res) => {
          this.htmlContent = res.data
        }).catch(() => {})
      }
    }
  }
}
</script>

<style scoped>
</style>
