
<!--
  @description: 供应商-谈判纪要-评审报表   - 询价不展示 单一来源和竞争谈判展示
  @Modifier：ysg
  @routerPath: /procurement/evaluationLobbyDrive/reportReview
  procurementOfferReportReviewExpert-add.vue
  @date： 2020-08-05 21:28:26
-->
<template>
  <div class="clearfix file_list_opt">
    <div class="fl leftList p0-16 list_report">
      <ul class="clearfix">
        <li v-for="(item,index) in reportList" :key="index" class="report" @click="switchFiles(item)">
          <span class="iconfont icon-pingshenbaobiao icon" />
          <p style="word-break: break-all;margin-top: -8px">
            {{ item.pdfName }}
          </p>
          <!-- <p v-if="item.isFinishSignature === '00'" :class="item.isFinishSignature=== '00'?'redItem':''">
            未签章
          </p>
          <p v-if="item.isFinishSignature === '01'" :class="item.isFinishSignature=== '01'?'blueItem':''">
            已完成签章
          </p> -->
        </li>
      </ul>
    </div>
    <div class="fr rightContent">
      <!--未签章-->
      <el-link v-if="!isShowPdf&&!isPdfSignature" :underline="false" type="primary" class="tip">
        请在左侧选择预览文件
      </el-link>
      <pdf v-if="isShowPdf&&!isPdfSignature" :pdf-url="pdfUrl" />
      <pdfSignature v-if="isPdfSignature" ref="pdfSignature" :pdf-url="pdfUrl" :signature-tyoe="'project'" :signature-other-data="signatureOtherData" :get-tender-base="tenderBase" @reloadDriver="reloadDriver" />
    </div>
    <!-- <div class="but_footer">
      <div class="but_footer-h">
        <div class="but_footer-but">
          <el-button :disabled="(pdfUrl!==''&&!isAlreadySigned)?false:true" :loading="confirmLoading" type="primary" size="medium" @click="electronicSignature">
            开启扫码签章
          </el-button>
          <template v-if="isEdit">
            <el-button :loading="confirmLoading" @click="signatureClick">
              电子签章
            </el-button>
            <el-button :loading="confirmLoading" type="primary" @click="submit">
              提交
            </el-button>
          </template>
        </div>
      </div>
    </div> -->
  </div>
</template>

<script>
/*   api接口 */
import {
  getSupplierBySignatureReportByPackId
} from '@/api/procurement/procurementEvaluation' // qrySupplierSignatureReportStatus
import { readImageRoot } from '@api/common/uploadCenter' // 图片查看路径
/* 公共组件 */
import pdf from '@comp/common/pdf/pdf' // pdf查看
import pdfSignature from '@comp/procurement/pdf/supplierPdf' // pdf签章
export default {
  components: {
    pdf,
    pdfSignature
  },

  props: {
    // 项目报价数据
    supplierInfo: {
      type: Object,
      default: () => {
        return {
          supplierId: '' // 供应商id
        }
      }
    },
    tenderBase: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },
  data() {
    return {
      loading: false,
      confirmLoading: false,
      isEdit: false, // 是否可编辑 true 可编辑 false 不可编辑
      // 上传评审报告
      reviewReportFilsData: {
        bizId: '', // 业务主键Id
        fileType: 'reviewReports'// 文件类型
      },
      reportList: [], // 报表数据
      pdfUrl: '', // pdf地址
      readImageUrl: readImageRoot, // 公共下载地址
      isShowPdf: false, // 是否展示pdf
      isAlreadySigned: false, // 是否已完成签章
      isPdfSignature: false, // 是否显示pdf签章
      currentReport: {}, // 当前选中报表
      // 合章时需要的参数
      signatureOtherData: {
        fileId: '', // 业务id
        signatureType: 'NEGOTIATIONS_FILE_SIGNATURE' // 谈判纪要章的类型
      }
      // getTenderBase: this.getTenderBase()
    }
  },
  created() {
    this.initData()
  },
  methods: {
    // 查询报表列表
    initData() {
      const data = {
        packId: this.tenderBase.packId,
        supplierId: this.supplierInfo.supplierId
      }
      getSupplierBySignatureReportByPackId(data).then(res => {
        this.reportList = res.data
      })
    },
    // 切换报表文件
    switchFiles(data) {
      // 拼接pdf的url路径
      const url = this.readImageUrl + data.pdfUrl
      // 加密处理
      this.pdfUrl = encodeURIComponent(url)
      this.isShowPdf = true
      // const params = {
      //   reportDetailId: data.reportDetailId
      // }
      // qrySupplierSignatureReportStatus(params).then(res => { // 供应商点击签章提示信息
      //   if (res.data.status !== 'false') {
      //     // 获取pdf主键id
      //     this.signatureOtherData.fileId = data.reportDetailId
      //     // 保存当前选中的报表信息
      //     this.currentReport = data
      //     // 判断当前文件是否签章
      //     if (data.isFinishSignature === '01') {
      //       this.isAlreadySigned = true
      //     } else {
      //       this.isAlreadySigned = false
      //     }
      //   } else {
      //     this.$message.warning(res.data.msg)
      //   }
      // })
    },
    // 签章按钮是否禁用
    signature() {
      // 判断是否有pdf路径和是否已完成签章
      if (!this.pdfUrl || !this.isAlreadySigned) {
        return true
      }
    },
    // 电子签章
    electronicSignature() {
      // 显示pdf签章
      this.isPdfSignature = true
      this.isEdit = true
    },
    // 刷新驱动
    reloadDriver() {
      this.isAlreadySigned = true // 签章成功之后开启签章按钮变为禁用
      this.isPdfSignature = false // 关闭签章工具
      this.isEdit = false // 隐藏电子签章工具
      // 刷新驱动列表
      this.initData()
    },
    // 扫码获取签章
    signatureClick() {
      this.$refs.pdfSignature.signatureClick()
    },
    // 提交
    submit() {
      this.$refs.pdfSignature.GetStamps()
    },
    // 签章回调
    insertBack(data) {
      // 按钮状态
      this.confirmLoading = data.laoding
    }
  }
}
</script>

<style lang="less" scoped>
    @import '~@assets/style/common/public.less';
    .icon{
        font-size: 30px;
    }
    /deep/.report{
      margin-bottom: 12px;
      cursor: pointer;
    }
    /deep/ul li {
        text-align: center;
        margin-bottom: 5px;
        a {
          word-break: normal;
        }
    }
    .rightContent {
        width: 86%;
        height: calc(100vh - 150px);
        background-color: @french-grey;
        text-align: center;
    }
    .leftList {
      max-width: 14%;
    }
    /deep/.tip {
      margin-top: 150px;
      span{
        font-size: 19px;
        font-weight: bold;
      }
    }
    .blueItem{
      color: #027bd0;
    }
    .redItem{
      color: red;
    }
    .file_list_opt{
      overflow: hidden;
    }
    .list_report{
      overflow-y: auto;
      height: calc(100vh - 56px - 170px);
    }
    .list_report li{
      margin-left: 16px;
    }
</style>
