<!--
  @description:招标-招标公告-招标公告
  @Modifier: 肖文龙
  @routerPath: /bidding/projectDrive/bulletin/tabs/bidDocument/makeTenderingBulletin-add
  @date: 2020/1/2-10:16
-->
<template>
  <div>
    <!--公告编辑页面-->
    <section v-if="toggle">
      <div class="clearfix">
        <el-link
          :underline="false"
          type="primary"
          class="fr"
          @click="toggleMakeTenderingBulletin()"
        >
          切换公告模板
        </el-link>
      </div>
      <editor v-model="bulletinParam.content" style="margin: 12px 0" />
      <!--公告附件上传-->
      <upload
        ref="upload"
        :data="upLoadData"
        :auto-delete="true"
        :auto-upload="true"
        title="公告附件"
        file-ref="fileRef"
      />
      <!--保存按钮-->
      <div class="but_footer">
        <div class="but_footer-h" />
        <div class="but_footer-but">
          <el-button @click="prevStep">
            上一步
          </el-button>
          <el-button :disabled="!isContent" :loading="confirmLoading" type="primary" @click="previewBulletin">
            预览
          </el-button>
        </div>
      </div>
    </section>

    <!--公告预览提交页面-->
    <submitTenderingBulletin
      v-show="!toggle"
      ref="bulletinContent"
    />

    <!--公告模板-->
    <makeTenderingBulletinDialog ref="makeTenderingBulletin" />
  </div>
</template>

<script>
/* api*/
import { makeTenderingBulletin, saveBulletinContent } from '@/api/bidding/bidBulletin'
/* 混合开发方法-参数字段*/
import { tenderStageTimeRule } from './../mixins/tenderStageTimeRule'// 招标公告时间规则
import { tenderBulletinMixin } from './../mixins/tenderBulletinMixin.js'// 招标公告-时间规则
/* 组件*/
import editor from '@comp/common/editor/editor' // 富文本编辑器组件
import submitTenderingBulletin from './submitTenderingBulletin' // 公告预览提交页面
import makeTenderingBulletinDialog from './makeTenderingBulletin-dialog' // 公告模板弹框组件
import upload from '@comp/common/updownload/upload' // 附件上传组件
export default {
  name: 'MakeTenderingBulletinAdd',
  components: {
    editor,
    submitTenderingBulletin,
    makeTenderingBulletinDialog,
    upload// 文件上传
  },
  mixins: [tenderStageTimeRule, tenderBulletinMixin],
  data() {
    return {
      confirmLoading: false, // 控制按钮重复点击Loding
      // 保存公告内容参数
      bulletinParam: {
        bulletinId: this.$route.query.bulletinId, // 公告Id
        content: '', // 公告内容
        contentTest: '' // 公告转码内容
      },
      isContent: false, // 是否已制作公告
      toggle: true // 切换现在预览页面或者公告编辑页面
    }
  },
  created() {
    // 上传附件参数
    this.upLoadData.bizId = this.$route.query.bulletinId // 业务主键Id
  },
  mounted() {
    this.getTenderBulletin() // 获取招标公告模板
  },
  methods: {
    getTenderBulletin() {
      if (this.bulletinParam.bulletinId) {
        makeTenderingBulletin(this.bulletinParam.bulletinId).then(response => {
          this.bulletinParam.content = response.data
          // 公告是否有内容
          if (this.bulletinParam.content) {
            this.isContent = true
          }
        }).catch(() => {

        })
      }
    },
    // 上一步
    prevStep() {
      // router携带参数
      const pathData = {
        ...this.$route.query
      }
      this.$emit('stepPage', 'prev', pathData)// 步骤条切换方法 prev 上一步
    },
    // 预览公告
    previewBulletin() {
      // 时间规则校验成功执行 then
      this.tenderStageTimeRule().then(() => {
        this.confirmLoading = true
        saveBulletinContent(this.bulletinParam).then(response => {
          this.$refs.bulletinContent.getBulletinPdf()
          this.toggle = false // 保存成功切换为预览pdf页面
          this.confirmLoading = false
        }).catch(() => {
          this.confirmLoading = false
        })
      })
    },
    // 切换公告模板
    toggleMakeTenderingBulletin() {
      this.$refs.makeTenderingBulletin.selectTemplate()
    },
    // 附件上传
    changeFile(file, fileList) {
      this.fileList = fileList
    }
  }
}
</script>

<style scoped>
</style>
