<!--
  @description: 项目规则之竞争性谈判、磋商组件
  @author: gmy
  @date: 2020-8-4 10:23:58
-->
<template>
  <div class="mb16">
    <table class="from_table">
      <!--     紧急采购-报价截止时间     -->
      <tr>
        <td>
          <el-form-item ref="isEmergencyProcurement" :rules="rules.isEmergencyProcurement" label="紧急采购" prop="isEmergencyProcurement" />
        </td>
        <td>
          <el-radio-group v-model="dataRule.isEmergencyProcurement">
            <el-radio
              v-for="(item) in emergencyProcurementList"
              :key="item.id"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
        <td>
          <el-form-item :rules="rules.workingDay" label="距离报价截止工作日" prop="workingDay" />
        </td>
        <td>
          <el-input
            v-model.trim="dataRule.workingDay"
            style="width: calc(100% - 60% );"
            :placeholder="'公告发布时间距离报价截止工作日'"
            :maxlength="6"
            clearable
            @input="onlyNumber"
          />
          <!-- 暂时性隐藏 -->
          <el-time-select
            v-model="dataRule.hourMmSs"
            style="width: calc(100% - 60% );"
            :picker-options="{
              start: '08:30',
              step: '00:15',
              end: '24:00'
            }"
            placeholder="请选择时间"
          />
        </td>
      </tr>
      <!--      报价有效期-强制上传应答文件-付款方式       -->
      <tr>
        <td>
          <el-form-item :rules="rules.quoteValidity" label="报价有效期" prop="quoteValidity" />
        </td>
        <td>
          <el-date-picker
            v-model="dataRule.quoteValidity"
            :picker-options="disabledPickerOptions"
            :value-format="elValueFormatDate"
            type="date"
            placeholder="选择日期"
          />
        </td>
        <td>
          <el-form-item label="强制上传应答文件" prop="autoExtension" />
        </td>
        <td>
          <el-radio-group v-model="dataRule.isUploadReplyFile">
            <el-radio
              v-for="(item) in uploadReplyFileList"
              :key="item.id"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
      </tr>
      <!--    币种- 付款方式-是否含运费       -->
      <tr>
        <td>
          <el-form-item ref=" currency" label="币种" prop="currency" />
        </td>
        <td>
          <el-select v-model="dataRule.currency">
            <el-option
              v-for="(item) in currencyList"
              :key="item.id"
              :label="item.typename"
              :value="item.typecode"
            />
          </el-select>
        </td>
        <td>
          <el-form-item ref="payType" :rules="rules.payType" label="付款方式" prop="payType" />
        </td>
        <td>
          <el-select
            v-model="dataRule.payType"
            :popper-append-to-body="false"
            popper-class="select-popper"
            filterable
            clearable
            style="width:100%"
          >
            <el-option
              v-for="(item) in payTypelist"
              :key="item.id"
              :title="item.typename"
              :label="item.typename"
              :value="item.typecode"
            />
          </el-select>
        </td>
      </tr>
      <!--    是否含运费-报价要求       -->
      <tr>
        <td>
          <el-form-item ref="isContainsFreight" label="是否含运费" prop="isContainsFreight" />
        </td>
        <td>
          <el-radio-group v-model="dataRule.isContainsFreight">
            <el-radio
              v-for="(item) in containsFreightList"
              :key="item.id"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
        <td>
          <el-form-item ref="quoteType" :rules="rules.quoteType" label="报价要求" prop="quoteType" />
        </td>
        <td>
          <el-radio-group v-model="dataRule.quoteType">
            <el-radio
              v-for="(item) in quoteType"
              :key="item.id"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item ref="reviewMethod" :rules="rules.reviewMethod" label="评审办法" prop="reviewMethod" />
        </td>
        <td v-if="sourceType01A" colspan="3">
          {{ filterDictText(reviewMethod, dataRule.reviewMethod) }}
        </td>
        <td v-else colspan="3">
          <el-radio-group v-model="dataRule.reviewMethod">
            <el-radio
              v-for="(item) in reviewMethod"
              :key="item.typecode"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item ref="isReceiveTenderDocumentPrice" :rules="rules.isReceiveTenderDocumentPrice" label="是否收取标书费" prop="isReceiveTenderDocumentPrice" />
        </td>
        <td :colspan="dataRule.isReceiveTenderDocumentPrice === '01' ? '' : '3'">
          <el-radio-group v-model="dataRule.isReceiveTenderDocumentPrice">
            <el-radio
              v-for="(item) in documentPrice"
              :key="item.typecode"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-radio>
          </el-radio-group>
        </td>
        <td v-if="dataRule.isReceiveTenderDocumentPrice === '01'">
          <el-form-item ref="documentPrice" :rules="rules.documentPrice" label="标书费金额" prop="protProjectDocumentPriceList[0].documentPrice" />
        </td>
        <td v-if="dataRule.isReceiveTenderDocumentPrice === '01'">
          <money
            :money-value="dataRule.protProjectDocumentPriceList[0]"
            width="90%"
            size="mini"
            name="documentPrice"
          />
        </td>
      </tr>
      <tr>
        <td>
          <el-form-item ref="supplierCategory" :rules="rules.supplierCategory" label="供应商分类" prop="supplierCategory" />
        </td>
        <td v-if="sourceType01A">
          {{ filterDictText(supplierCategoryList, dataRule.supplierCategory?dataRule.supplierCategory.join(','):dataRule.supplierCategory) }}
        </td>
        <td v-else>
          <el-checkbox-group v-model="dataRule.supplierCategory">
            <el-checkbox
              v-for="(item, index) in supplierCategoryList"
              :key="index"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-checkbox>
          </el-checkbox-group>
        </td>
        <td>
          <el-form-item ref="supplierAttribute" :rules="rules.supplierAttribute" label="供应商属性" prop="supplierAttribute" />
        </td>
        <td v-if="sourceType01A">
          {{ filterDictText(supplierAttributeList, dataRule.supplierAttribute?dataRule.supplierAttribute.join(','):dataRule.supplierAttribute) }}
        </td>
        <td v-else>
          <el-checkbox-group v-model="dataRule.supplierAttribute">
            <el-checkbox
              v-for="(item, index) in supplierAttributeList"
              :key="index"
              :label="item.typecode"
            >
              {{ item.typename }}
            </el-checkbox>
          </el-checkbox-group>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
/* 接口*/
import { getTime } from '@api/common/tools.js' // 获取服务器时间
/* 公用方法*/
import { checkMoney, characters1_auto, checkRate } from '@assets/js/validate.js'// 常用方法
import { commonMxin } from '@/mixins/commonMxin'
import { filterDictText } from '@/assets/js/utils'
/* 混合开发*/
import { procurementProjectGroupMixin } from '@/views/procurement/procurementProject/mixins/procurementProjectGroupMixin'// 立项采购-字典
import { procurementProjectMixins } from '@/views/procurement/procurementProject/mixins/procurementProjectMixins'// 立项采购-公用方法参数
import money from '@comp/common/money/money' // 金额组件
// vuex
import { mapGetters } from 'vuex'
export default {
  name: 'ProcurementProjectAdd',
  components: {
    money
  },
  mixins: [commonMxin, procurementProjectGroupMixin, procurementProjectMixins],
  props: {
    dataRule: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      sourceType01A: false,
      confirmLoading: false,
      currentTimes: '', // 获取当前时间
      disflags: true,
      flgsaction: true,
      labellocaltion: 'left',
      status: '', // 采购方式：10公开询价  11邀请询价  12竞争性谈判  13竞争性磋商   14公开竞价  15邀请竞价  16单一来源采购
      amounttenderfeeflg: false, // 标书费金额显示隐藏
      depositflg: false, // 保证金金额显示隐藏
      title: '控制', // 限价
      text: '价格(元)', // 限价
      titleTab: '报价最小幅度(元)', // 价格幅度
      procurementDocumentsFlg: false, // 标书费收取显示隐藏
      depositflgs: false, // 线下收取
      // 校验输入内容
      rules: {
        workingDay: [{ required: true, validator: checkRate, trigger: 'blur' }], // 报价截止时长
        // quoteEndTime: [{ required: true, message: '请输入', trigger: 'blur' }], // 报价截止时间
        quoteValidity: [{ required: true, message: '请输入', trigger: 'blur' }], // 报价有效期
        payType: [{ required: true, validator: characters1_auto, trigger: 'change' }], // 付款方式
        isReceiveTenderBailPrice: [{ required: true, message: '请选择', trigger: 'blur' }], // 收取保证金
        isReceiveTenderDocumentPrice: [{ required: true, message: '请选择', trigger: 'blur' }], // 收取标书费
        bailPrice: [{ required: true, validator: checkMoney, trigger: 'blur' }], // 保证金金额
        documentPrice: [{ required: true, validator: checkMoney, trigger: 'blur' }], // 标书费金额
        quoteType: [{ required: true, message: '请选择', trigger: 'blur' }], // 报价要求
        isEmergencyProcurement: [{ required: true, message: '请选择', trigger: 'blur' }],
        reviewMethod: [{ required: true, message: '请选择', trigger: 'blur' }], // 评审办法
        supplierCategory: [{ type: 'array', required: true, message: '请选择', trigger: 'change' }], // 供应商分类
        supplierAttribute: [{ type: 'array', required: true, message: '请选择', trigger: 'change' }] // 供应商属性
      }
    }
  },
  computed: {
    /* language 国际化*/
    ...mapGetters(['language'])
  },
  watch: {
    // 监听紧急采购字段的变化
    // 'dataRule.isEmergencyProcurement'(val, newval) {
    //   if (val !== newval) {
    //     this.dataRule.quoteValidity = ''
    //     this.dataRule.quoteEndTime = ''
    //   }
    // }
    // 监听报价有效期首次加载默认为当前时间增加90天后的日期二次进入有值不做处理
    'dataRule.quoteValidity': {
      handler(val) {
        if (!val) {
          this.changeQuoteEndTime()
        }
      }
    }
  },
  created() {
    // 页面初始化
    this.pageInit()
    // 调用项目规则字典方法
    this.initqueryProcurementProjectRuleInitInfo()
    // 获取当前时间
    this.getCurrentTime()
  },
  methods: {
    filterDictText, // 引入字典值替换文本通用方法
    // 页面初始化
    pageInit() {
      if (this.$route.query.sourceType.indexOf('01A') !== -1) {
        this.sourceType01A = true
      }
    },
    // 项目规则，报价有效期，默认为当前时间增加90天
    changeQuoteEndTime() {
      const nowTime = this.currentTimeFn() // 获取当前时间
      this.dataRule.quoteValidity = this.$Moment(nowTime).add(90, 'days').format(this.momentDate)
    },
    // 报价时间截止工作日规则
    onlyNumber(type) {
      if (this.dataRule.workingDay) {
        // 先把非数字和0都替换掉
        this.dataRule.workingDay = this.dataRule.workingDay.replace(/^0/g, '')
        this.dataRule.workingDay = this.dataRule.workingDay.replace(/[^0-9]/g, '')
      }
    },
    // 报价截止时间的change事件
    chandehanle(val) {
      // 当前时间
      const presentTime = this.$Moment(this.currentTimes)
      // 选择的报价截止时间
      const selectTime = this.$Moment(val)
      // 时间差具体到天
      const diffTime = selectTime.diff(presentTime, 'day')
      // 判断是否紧急采购 isEmergencyProcurement 00 否 01 是
      if (this.dataRule.isEmergencyProcurement === '00') {
        // 非紧急采购报价截止时间-当前时间>=3
        if (diffTime < 3) {
          this.dataRule.quoteValidity = ''
          this.dataRule.quoteEndTime = ''
          this.$message.error('报价截止时间应大于当前时间3天')
          return
        }
      } else if (this.dataRule.isEmergencyProcurement === '01') {
        // 紧急采购报价截止时间-当前时间>=1
        if (diffTime < 1) {
          this.dataRule.quoteValidity = ''
          this.dataRule.quoteEndTime = ''
          this.$message.error('报价截止时间应大于当前时间1天')
          return
        }
      }
      // 获取有效期时间 报价截止时间增加90天
      this.dataRule.quoteValidity = this.$Moment(val).add(90, 'days').format('YYYY-MM-DD')
    },
    // 获取当前时间
    getCurrentTime() {
      getTime().then(res => {
        this.currentTime = res.data.time
      }).catch(() => {
      })
    },
    // 保存或提交时 组装数据然后返回
    assemblyData() {
      const data = {
        id: this.dataRule.id,
        tenderId: this.$route.query.tenderId,
        workingDay: this.dataRule.workingDay, // 距离报价截止的工作日
        hourMmSs: this.dataRule.hourMmSs, // 距离报价截至时间
        // quoteEndTime: this.dataRule.quoteEndTime ? this.$Moment(this.dataRule.quoteEndTime).format(this.momentSaveFormat) : '', // 报价截止时间
        quoteValidity: this.dataRule.quoteValidity ? this.$Moment(this.dataRule.quoteValidity).format(this.momentSaveFormat) : '', // 报价有效期
        isReceiveTenderBailPrice: this.dataRule.isReceiveTenderBailPrice, // 是否收取保证金
        protProjectBailPriceList: this.dataRule.protProjectBailPriceList, // 保证金金额
        isUploadReplyFile: this.dataRule.isUploadReplyFile, // 强制上传应答文件
        isContainsFreight: this.dataRule.isContainsFreight, // 是否含运费
        currency: this.dataRule.currency, // 币种
        payType: this.dataRule.payType, // 付费方式
        isEmergencyProcurement: this.dataRule.isEmergencyProcurement, // 是否紧急采购
        quoteType: this.dataRule.quoteType, // 报价要求
        isReceiveTenderDocumentPrice: this.dataRule.isReceiveTenderDocumentPrice, // 是否收取标书费
        protProjectDocumentPriceList: this.dataRule.protProjectDocumentPriceList, // 标书费金额
        reviewMethod: this.dataRule.reviewMethod, // 评审办法
        supplierCategory: this.dataRule.supplierCategory.join(','), // 供应商分类
        supplierAttribute: this.dataRule.supplierAttribute.join(',') // 供应商属性
      }
      // 返回
      return data
    }
  }
}
</script>

<style lang="less" scoped>

  /deep/.show-word-limit-padding{
    .el-input__inner{
      padding-right: 70px;
    }
  }
  /deep/.select-popper{
    max-width: 100%;
  }
</style>
