<!--
  @description: 投标人提出问题回复
  @Modifier: 郝定康
  @routerPath:/procurement/procurementDrive/procClarificationQuestionReply/procClarificationQuestionAdd
  @date: 2021-02-08 10:48:06
-->
<template>
  <div>
    <el-form
      ref="form"
      :rules="rules"
      :inline-message="true"
      :model="formData"
    >
      <table class="from_table">
        <tr>
          <td>
            <el-form-item label="澄清标题" prop="clarificationTitle" />
          </td>
          <td colspan="3">
            <gx-input
              v-model="formData.clarificationTitle"
              gx-maxlength="varchar200"
              placeholder="请输入"
            />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="澄清版本号" prop="isChangeTime" />
          </td>
          <td colspan="3">
            {{ formData.versionNumber }}
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="澄清文件" prop="clarificationAttachment" />
          </td>
          <td colspan="3">
            <upload
              ref="clarificationAttachment"
              :on-change="clarificationAttachmentFile"
              :data="clarificationAttachment"
              :auto-delete="true"
              :auto-upload="true"
              :file-size="200"
              title=""
              accept=".doc, .docx, .pdf, .png, .jpg, .zip;.jpeg;.txt;.xlsx;. xls;.ppt;.pptx;.rar"
              tip-text="上传附件格式（*.doc;*.docx;*.pdf;*.png;*.jpg;*.zip;*.jpeg;*.txt;*.xlsx;*.xls;*.ppt;*.pptx;*.rar）单个文件不得超过200M"
              file-ref="fileRef"
            />
          </td>
        </tr>
        <!-- <tr>
          <td>
            <el-form-item label="澄清内容文件" prop="clarificationContent" />
          </td>
          <td colspan="3">
            <upload
              ref="clarificationContent"
              :on-change="clarificationContentFile"
              :data="clarificationContent"
              :auto-delete="true"
              :auto-upload="true"
              :file-size="200"
              title=""
              accept=".doc, .docx, .pdf, .png, .jpg, .zip;.jpeg;.txt;.xlsx;. xls;.ppt;.pptx;.rar"
              tip-text="上传附件格式（*.doc;*.docx;*.pdf;*.png;*.jpg;*.zip;*.jpeg;*.txt;*.xlsx;*.xls;*.ppt;*.pptx;*.rar）单个文件不得超过200M"
              file-ref="fileRef"
            />
          </td>
        </tr> -->
      </table>
    </el-form>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <gx-button :code="'001_012_003'" :loading="confirmLoading" type="primary" @click="saveAnwserClarificationInfo('form')">
          回 复
        </gx-button>
        <gx-button :code="'001_012_006'" @click="back">
          返 回
        </gx-button>
      </div>
    </div>
  </div>
</template>

<script>
/* api*/
// getClarificationVesionNumber
import { saveAnwserClarificationInfo, getClarificationVesionNumber } from '@/api/procurement/procurementProject'// 澄清
/* 常用方法*/
import { randomData } from '@/assets/js/utils/index'
import { characters1_auto } from '@/assets/js/validate'// 校验输入内容
/* 混合开发方法-参数字段*/
import { clarificationGroupMixin } from '../mixins/clarificationGroupMixin'// 澄清质疑-公用参数
import { clarificationMixin } from '../mixins/clarificationMixin'// 澄清质疑-公用参数
/* 组件*/
import upload from '@comp/common/updownload/upload' // 附件上传组件
export default {
  name: 'ClarificationQuestionAdd',
  components: {
    upload
  },
  mixins: [clarificationGroupMixin, clarificationMixin],
  data() {
    return {
      confirmLoading: false, // 控制按钮重复点击Loding
      formData: {
        clarificationId: '', // 附件Id
        clarificationTitle: '', // 标题
        questionIdList: [], // 问题Id
        status: '01', // 00 保存 01 提交
        versionNumber: '', // 版本号
        clarificationContent: '', // 澄清内容文件
        clarificationAttachment: '' // 澄清附件
      },
      rules: {
        clarificationTitle: [{ required: true, validator: characters1_auto, trigger: 'blur' }], // 标题
        clarificationContent: [{ required: true, message: '请上传', trigger: 'blur' }], // 澄清内容文件
        clarificationAttachment: [{ required: true, message: '请上传', trigger: 'blur' }] // 澄清附件
      }
    }
  },
  created() {
    // 问题Id
    this.formData.questionIdList = this.$route.params.questionIdList
    // 随机生成ID
    // this.formData.clarificationId = randomData()
    this.clarificationContent.bizId = this.clarificationAttachment.bizId = this.formData.clarificationId = randomData()
    // 采购人-新增时获取澄清版本
    this.getClarificationVesionNumber()
  },
  methods: {
    // 澄清内容文件
    clarificationContentFile(file, fileList) {
      if (fileList.length > 0) {
        this.$set(this.formData, 'clarificationContent', 'true')// 上传了
      } else {
        this.$set(this.formData, 'clarificationContent', '')// 未上传
      }
    },
    // 澄清附件
    clarificationAttachmentFile(file, fileList) {
      if (fileList.length > 0) {
        this.$set(this.formData, 'clarificationAttachment', 'true')// 上传了
      } else {
        this.$set(this.formData, 'clarificationAttachment', '')// 未上传
      }
    },
    // 采购人-新增时获取澄清版本
    getClarificationVesionNumber() {
      const params = {
        packId: this.$route.params.packId
      }
      getClarificationVesionNumber(params).then(response => {
        this.formData.versionNumber = response.data.versionNumber
      }).catch(() => {
      })
    },
    // 回复
    saveAnwserClarificationInfo(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$confirm('是否确认回复?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            confirmButtonClass: 'confirmBtn',
            cancelButtonClass: 'cancelBtn',
            type: 'warning'
          }).then(() => {
            delete this.formData.clarificationContent
            delete this.formData.clarificationAttachment
            this.confirmLoading = true
            saveAnwserClarificationInfo(this.formData).then(response => {
              this.confirmLoading = false
              this.$message({
                message: '回复成功',
                type: 'success'
              })
              this.back()
            }).catch(() => {
              this.confirmLoading = false
            })
          }).catch(() => {
          })
        }
      })
    },
    back() {
      this.$router.push({
        name: 'procClarificationQuestionList'
      })
    }
  }
}
</script>

<style scoped>
</style>
