<!--
  @description: 招标-邀请函-其他(保证金页面)
  @Modifier: 肖文龙/haoFx
  @routerPath: /bidding/projectDrive/invitation/tabs/tenderInvitationOtherInfo-add
  @date: 2020/1/2-10:09
-->
<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="mediaPartners" label="发布媒介" prop="mediaPartners">
                <el-checkbox-group v-model="formData.mediaPartners">
                  <el-checkbox
                    v-for="(item) in mediaPartnersList"
                    :key="item.typecode"
                    :label="item.typecode"
                  >
                    {{ item.typename }}
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </el-col>
            <!--
            后审阶段展示
            tenderBase.stageType 00 资审 01 后审
            -->
            <el-col v-if="tenderBase.stageType==='01'">
              <!--保证金收取途径
              <el-form-item ref="bailPriceReceiveChannel" label="保证金收取途径" prop="bailPriceReceiveChannel">
                <el-checkbox-group v-model="formData.bailPriceReceiveChannel">
                  <el-checkbox
                    v-for="(item) in bailPriceReceiveChannelList"
                    :key="item.typecode"
                    :label="item.typecode"
                  >
                    {{ item.typename }}
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>-->
              <!-- 保证金收取方式-->
              <el-form-item ref="bailCollectMode" label="保证金收取方式" prop="bailCollectMode">
                <el-radio-group
                  v-model="formData.bailCollectMode"
                >
                  <el-radio v-for="(item,index) in bailPriceModeList" :key="index" :label="item.typecode">
                    {{ item.typename }}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
              <!--是否需要开票-->
              <!-- <el-form-item ref="isReceiveTenderBailPrice" label="是否需要开票" prop="isReceiveTenderBailPrice">
                <el-radio-group v-model="formData.isReceiveTenderBailPrice">
                  <el-radio v-for="(item,index) in isReceiveTenderBailPriceList" :key="index" :label="item.typecode">
                    {{ item.typename }}
                  </el-radio>
                </el-radio-group>
              </el-form-item> -->
              <!--
              保证金设置
              receiveBailPriceMethodChange==='00' 不可以编辑
              -->
              <el-form-item ref="receiveBailPriceMethod" label="保证金设置" prop="receiveBailPriceMethod">
                <el-radio-group
                  v-model="formData.receiveBailPriceMethod"
                  :disabled="formData.receiveBailPriceMethodChange==='00'"
                >
                  <el-radio v-for="(item,index) in bailPriceMethodList" :key="index" :label="item.typecode">
                    {{ item.typename }}
                  </el-radio>
                </el-radio-group>
                <el-button
                  size="mini"
                  style="color: red;margin-left: 16px"
                  type="text"
                >
                  注：金额为0或不填即为不收取
                </el-button>
              </el-form-item>
              <!--
              售卖金额
              ·-->
              <template>
                <!--按标段收取 receiveBailPriceMethod===00-->
                <el-form-item v-if="formData.receiveBailPriceMethod==='00'" class="form_item_table">
                  <div>
                    <el-table :data="formData.tenderBailPriceInfoDto" size="small">
                      <el-table-column type="index" label="序号" width="60" align="center" />
                      <el-table-column header-align="center" width="200px" label="标段编号" prop="packNo" align="center" />
                      <el-table-column header-align="center" label="标段名称" prop="packName" />
                      <el-table-column header-align="center" width="220px" label="保证金（元）" prop="bailPrice">
                        <template slot-scope="scope">
                          <money :money-value="scope.row" name="bailPrice" />
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                  <el-button
                    size="mini"
                    class="fr"
                    type="text"
                    @click="msetKeyMoney"
                  >
                    批量设置金额
                  </el-button>
                </el-form-item>
                <!--按项目收取 receiveBailPriceMethod===01-->
                <el-form-item v-if="formData.receiveBailPriceMethod==='01'">
                  <!--receiveBailPriceMethodChange==='00' 不可编辑-->
                  <money :disabled="formData.receiveBailPriceMethodChange==='00'" :unit-stust="true" :money-value="formData" name="bailPrice" />
                </el-form-item>
              </template>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <el-button @click="prevStep">
          上一步
        </el-button>
        <el-button :loading="confirmLoading" type="primary" @click="nextStep('form')">
          暂存，进入下一步
        </el-button>
      </div>
    </div>
  </div>
</template>

<script>
/* api*/
import { queryTenderBailPriceInfo, saveTenderBailPriceInfo } from '@/api/bidding/bidInvitation'
/* 公用方法*/
import { moneyRegular, characters1_auto } from '@/assets/js/validate'// 校验输入内容
/* 混合开发方法-参数字段*/
import { tenderInvitationInitGroupMixin } from './../mixins/tenderInvitationInitGroupMixin'// 字典信息
/* 组件*/
import money from '@comp/common/money/money'// 金额组件
export default {
  name: 'TenderBailPriceAdd',
  components: {
    money// 金额组件
  },
  mixins: [tenderInvitationInitGroupMixin],
  data() {
    return {
      confirmLoading: false, // 暂存、下一步Loding
      tenderId: this.$route.query.id, // 项目Id
      tenderBase: this.$store.getters.tenderBase, // 项目信息
      invitationId: this.$route.query.invitationId, // 邀请函Id
      stageId: this.$store.getters.groupId.stageId, // 阶段Id
      requestSource: '', // 来源 00:资审公告 01:招标公告 02:资格预审通知书 03:资审邀请函 04:后审邀请函
      formData: {
        bizId: '', // 公告id 邀请函id
        mediaPartners: ['', ''], // 发布媒介 00 门户网站 01 中国公共服务平台 全选
        isReceiveTenderBailPrice: '00', // 是否需要开票 01 开票 00 不开票
        bailPriceReceiveChannel: ['00'], // 保证金收取途径 00 电汇
        receiveBailPriceMethodChange: '00', // 保证金收取方式 是否可以变更 01:可以变更 00:不可以变更
        receiveBailPriceMethod: '00', // 保证金设置 00 按标段售卖 01 按项目售卖
        tenderBailPriceInfoDto: [], // 按标段售卖金额
        bailPrice: '', // 按項目售卖金额
        bailCollectMode: '' // 保证金收取方式 00 银企直连  01 线下转账
      },
      // 校验输入内容
      rules: {
        mediaPartners: [{ required: true, message: '请选择', trigger: 'change' }], // 发布媒介
        isReceiveTenderBailPrice: [{ required: true, message: '请选择', trigger: 'change' }], // 是否需要开票
        bailPriceReceiveChannel: [{ required: true, message: '请选择', trigger: 'change' }], // 保证金收取途径
        receiveBailPriceMethod: [{ required: true, validator: characters1_auto, trigger: 'blur' }], // 保证金设置
        bailPrice: [{ required: true, validator: characters1_auto, trigger: 'blur' }], // 按項目售卖金额
        bailCollectMode: [{ required: true, validator: characters1_auto, trigger: 'blur' }] // 保证金收起方式
      }
    }
  },
  created() {
    // 通过资审和后审判断来源
    if (this.tenderBase.stageType === '00') {
      this.requestSource = '03'// 资审邀请函
    } else if (this.tenderBase.stageType === '01') {
      this.requestSource = '04'// 后审邀请函
    }
    this.getTenderBailPriceInitInfo()// 字典信息
    this.initData()// 加载数据
  },
  methods: {
    // 加载数据
    initData() {
      if (!this.invitationId) return
      const data = {
        invitationType: this.tenderBase.invitationType, // 邀请函类型
        tenderId: this.tenderId, // 项目Id
        bizId: this.invitationId, // 公共Id
        requestSource: this.requestSource, // 来源 00:资审公告 01:招标公告 02:资格预审通知书 03:资审邀请函 04:后审邀请函
        stageId: this.stageId
      }
      queryTenderBailPriceInfo(data).then((response) => {
        this.formData = response.data
        this.formData.tenderBailPriceInfoDto = [...this.formData.tenderBailPriceInfoVo]// 物料
        delete this.formData.tenderBailPriceInfoVo
        // 初始化默认值
        // 发布媒介
        if (!this.formData.mediaPartners) { // 为空时
          // 邀请函管理-不勾选推送中招并隐藏该按钮。邀请类的信息都不推送中招
          this.formData.mediaPartners = ['00'] // 发布媒介 00 门户网站 01 中国公共服务平台 全选
        } else { // 非空时
          this.formData.mediaPartners = this.formData.mediaPartners.split(',')
        }
        // 是否需要开票
        if (!this.formData.isReceiveTenderBailPrice) { // 为空时
          this.formData.isReceiveTenderBailPrice = '00' //  00 不开票
        }
        // 保证金收取途径
        if (!this.formData.bailPriceReceiveChannel) { // 为空时
          this.formData.bailPriceReceiveChannel = ['00']// 00 电汇
        } else { // 非空时
          this.formData.bailPriceReceiveChannel = this.formData.bailPriceReceiveChannel.split(',')
        }
        // 保证金设置
        if (!this.formData.receiveBailPriceMethod) { // 为空时
          this.formData.receiveBailPriceMethod = '00' //  00 按标段售卖
        }

        // 保证金收取方式
        if (!this.formData.bailCollectMode) { // 为空时
          this.formData.bailCollectMode = '02' //  默认线下转账
        }
      })
    },

    // 分标段时-批量设置金额
    msetKeyMoney() {
      this.$prompt('批量设置金额（元）', '批量设置保证金', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        inputPattern: moneyRegular,
        inputErrorMessage: '请输入正确格式金额'
      }).then(({ value }) => {
        // value 保证金金额
        this.formData.tenderBailPriceInfoDto.map(item => {
          item.bailPrice = value
        })
      }).catch(() => {
      })
    },
    // 保存组装数据
    assemblyData() {
      const data = {
        ...this.formData,
        requestSource: this.requestSource, // 来源
        tenderId: this.tenderId // 项目Id
      }
      // 指定媒体 将数组转成字符串
      data.mediaPartners = data.mediaPartners.join(',')
      // 保证金收取途径 将数组转成字符串
      if (this.tenderBase.bulletinType === '01') { // 招标公告
        data.bailPriceReceiveChannel = data.bailPriceReceiveChannel.join(',')
      } else if (this.tenderBase.bulletinType === '21') { // 资审公告
        data.bailPriceReceiveChannel = ''
      }
      return data
    },
    // 保存数据接口 暂存，下一步
    saveData(type) {
      this.confirmLoading = true// btnLoding
      const data = this.assemblyData()// 保存组装数据
      saveTenderBailPriceInfo(data).then(response => {
        // route携带参数
        const pathData = {
          ...this.$route.query
        }
        if (type === 'draft') return false// 判断是否-点击步骤条切换-如果是则不执行next下一步
        this.$emit('stepPage', 'next', pathData)// 步骤条切换方法 next 下一步
        this.confirmLoading = false// btnLoding
      }).catch(() => {
        this.confirmLoading = false// btnLoding
      })
    },
    // 上一步
    prevStep() {
      // router携带参数
      const pathData = {
        ...this.$route.query
      }
      this.$emit('stepPage', 'prev', pathData)// 步骤条切换方法 prev 上一步
    },

    // 下一步
    nextStep(formName) {
      let isPrice = false //  false 未设置金额 true 已设置金额
      if (this.formData.receiveBailPriceMethod === '00') { // 00 按标段售卖
        this.formData.tenderBailPriceInfoDto.map(item => {
          if (item.bailPrice) {
            isPrice = true
          }
        })
      } else if (this.formData.receiveBailPriceMethod === '01') { // 01 按项目售卖
        if (this.formData.bailPrice) {
          isPrice = true
        }
      }
      const { receiveBailPriceMethod, receiveBailPriceMethodChange } = this.formData
      //  已设置金额 或者 是资审公告 或者  为按项目售卖时 && 不可编辑时
      if (isPrice || this.tenderBase.bulletinType === '21' || receiveBailPriceMethod === '01' && receiveBailPriceMethodChange === '00') { //
        this.valiDate(formName)// 校验输入框必填项
      } else { // 未设置金额
        this.valiPrice()// 金额未填写提示
      }
    },
    // 金额未填写提示
    valiPrice() {
      this.$confirm('确认保证金免费吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        this.saveData()
      }).catch(() => {
      })
    },
    // 校验输入框必填项
    valiDate(formName) {
      // 校验输入内容
      this.$refs[formName].validate((valid, field) => {
        if (valid) { // 校验通过
          this.saveData()
        } else { // 校验不通过
          this.$confirm('其他未完善, 是否进入下一步?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            confirmButtonClass: 'confirmBtn',
            cancelButtonClass: 'cancelBtn',
            type: 'warning'
          }).then(() => {
            this.saveData()
          }).catch(() => {
          })
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>

</style>
