<!--
  @description:  招标-邀请函-招标条件
  @Modifier: 肖文龙/haoFx
  @routerPath:/bidding/projectDrive/invitation/tabs/tenderInvitationInfo-add
  @date: 2019/12/30-19:20
-->
<template>
  <div>
    <div>
      <div style="width: 90%;margin-left: 4%;">
        <el-form
          ref="form"
          :model="formData"
          :rules="rules"
          label-width="140px"
        >
          <el-row>
            <el-col>
              <!--招标项目名称-->
              <el-form-item
                ref="tenderName"
                maxlength="20"
                label="招标项目名称"
                prop="tenderName"
              >
                <span>{{ formData.tenderName }}</span>
              </el-form-item>
              <!--邀请函标题-->
              <el-form-item
                ref="title"
                placeholder="最多允许输入200个字符"
                show-word-limit
                label="邀请函标题"
                prop="title"
              >
                <el-input v-model.trim="formData.title" maxlength="200" placeholder="邀请函标题" />
              </el-form-item>
              <!--项目资金-->
              <el-form-item
                ref="projectMoney"
                label="项目资金"
                prop="projectMoney"
              >
                <money :thousands="true" :unit-stust="true" :great="true" :money-value="formData" name="projectMoney" />
              </el-form-item>
              <!--招标人·-->
              <el-form-item ref="buyersName" label="招标人" prop="buyersName">
                <span>{{ formData.buyersName }}</span>
              </el-form-item>
              <!--招标方式-->
              <el-form-item ref="tenderMethod" label="招标方式" prop="tenderMethod">
                <span
                  v-for="(item,index) in allTenderMethodTypeList"
                  v-if="formData.tenderMethod===item.typecode"
                  :key="index"
                >{{ item.typename }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <el-button :loading="confirmLoading" type="primary" @click="nextStep('form')">
          暂存，进入下一步
        </el-button>
      </div>
    </div>
  </div>
</template>

<script>
/* api*/
import { queryBaseTenderInvitationInfo, saveBaseTenderInvitationInfo } from '@/api/bidding/bidInvitation'// 查询是否邀请函提交 保存接口
/* 公用方法*/
import { characters1_auto, validateInput } from '@/assets/js/validate'// 校验输入内容
/* 组件*/
import money from '@comp/common/money/money'
export default {
  name: 'TenderBulletIinInfoAdd',
  components: {
    money
  },
  data() {
    return {
      /* 字典信息-start */
      allTenderMethodTypeList: [], // 招标方式
      /* 字典信息-end */
      confirmLoading: false,
      tenderBase: this.$store.getters.tenderBase, // 项目信息
      tenderId: this.$route.query.id, // 项目Id
      invitationId: this.$route.query.invitationId, // 邀请函Id
      formData: {
        isSwitchTable: '', // 是否可以切换项目概况已后的tab页 00 不可以切换 01可以切换
        invitationType: '', //  邀请函类型 01:普通邀请函 02:资审后邀请函(数据源不同)
        invitationId: '', // 邀请函Id
        title: '', // 邀请函标题
        tenderName: '', // 项目名称
        projectMoney: '', // 项目资金
        buyersName: '', // 招标人
        tenderMethod: ''// 招标方式
      },

      // 校验输入内容
      rules: {
        title: [{ required: true, validator: validateInput, trigger: 'blur' }], // 邀请函标题
        projectMoney: [{ required: true, validator: characters1_auto, trigger: 'blur' }] // 项目资金
      }
    }
  },
  created() {
    this.initBulletin()// 获取邀请函信息
    this.initGroup() // 获取字典方法
  },
  methods: {
    // 获取字典方法
    initGroup() {
      const data = [
        'allTenderMethodType' // 招标方式
      ]
      this.$store.dispatch('getGroupType', data).then(res => {
        Object.keys(res.bidTypeData).forEach((key) => {
          this[key] = res.bidTypeData[key]
        })
      })
    },
    // 获取邀请函信息
    initBulletin() {
      const data = {
        tenderId: this.tenderId, // 项目Id
        invitationId: this.invitationId// 邀请函Id
      }
      queryBaseTenderInvitationInfo(data).then(res => {
        this.formData = res.data
        // 当项目ID为空时
        if (!data.invitationId) {
          this.formData.title = `【${this.formData.tenderName}】邀请函`// 邀请函标题
        }
        this.$router.push({ query: {
          ...this.$route.query,
          isSwitchTable: this.formData.isSwitchTable// 是否可以切换项目概况已后的tab页 00 不可以切换 01可以切换
        }})
      })
    },
    // 保存数据接口 暂存，下一步
    saveData(type) {
      this.confirmLoading = true// btnLoding
      const data = {
        ...this.formData,
        tenderId: this.tenderId, // 项目Id
        invitationType: this.tenderBase.invitationType, // 邀请函类型 01:普通邀请函 02:资审后邀请函(数据源不同)
        invitationStageType: this.tenderBase.stageType
      }
      saveBaseTenderInvitationInfo(data).then(response => {
        this.formData.invitationId = response.data.id// 招标公告Id
        // route携带参数
        const pathData = {
          ...this.$route.query,
          invitationId: this.formData.invitationId // 邀请函Id
        }
        this.confirmLoading = false// btnLoding
        // 判断是否-点击步骤条切换-如果是则不执行next下一步
        if (type === 'draft') {
          this.$router.push({
            query: {
              ...pathData
            }
          })
        } else {
          this.$emit('stepPage', 'next', pathData)// 步骤条切换方法 next 下一步
        }
      }).catch(() => {
        this.confirmLoading = false// btnLoding
      })
    },
    // 下一步
    nextStep(formName) {
      // 校验个人信息是否已完善
      this.$store.dispatch('findUserRule').then(() => {
      // 校验输入内容
        this.$refs[formName].validate((valid, field) => {
          if (valid) { // 校验通过
            this.saveData()
          }
        })
      })
    }
  }
}
</script>

<style lang="less" scoped>

</style>
