<!--
  @description: 费用管理-履约保证金-上传凭证
  @Modifier: 张慢慢
  @routerPath: /fee/performanceBondAdd
  @date: 2021/05/22
-->
<template>
  <div>
    <section class="title p0-16 clearfix">
      <template>
        <div class="title-back pointer" @click="back">
          <i class="iconfont icon-fanhui mr10" />上传履约金缴费凭证
        </div>
      </template>
    </section>
    <section class="p0-16">
      <el-form
        ref="fromData"
        :rules="rules"
        :inline-message="true"
        :model="formData"
      >
        <table class="from_table">
          <tr>
            <td>
              <el-form-item label="项目名称" prop="tenderNo" />
            </td>
            <td>
              <gx-input
                v-model="formData.tenderNo"
                gx-maxlength="varchar200"
                placeholder="项目名称"
              />
            </td>
            <td>
              <el-form-item label="项目编号" prop="tenderNo" />
            </td>
            <td>
              <gx-input
                v-model="formData.tenderNo"
                gx-maxlength="varchar200"
                placeholder="项目编号"
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="包段名称" prop="packNo" />
            </td>
            <td>
              <gx-input
                v-model="formData.packNo"
                gx-maxlength="varchar200"
                placeholder="包段名称"
              />
            </td>
            <td>
              <el-form-item label="包段编号" prop="packNo" />
            </td>
            <td>
              <gx-input
                v-model="formData.packNo"
                gx-maxlength="varchar200"
                placeholder="包段编号"
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="代理机构" prop="tenderName" />
            </td>
            <td colspan="3">
              {{ '国信创新' }}
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="履约金凭证联系人" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="联系人"
              />
            </td>
            <td>
              <el-form-item label="联系人手机号" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="联系人手机号"
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="履约金缴纳账户所属银行" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="履约金缴纳账户所属银行"
              />
            </td>
            <td>
              <el-form-item label="履约金缴纳户名" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="履约金缴纳户名"
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="履约金缴纳账号" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="履约金缴纳账号"
              />
            </td>
            <td>
              <el-form-item label="履约金缴费金额(元)" prop="honourText" />
            </td>
            <td>
              <gx-input
                v-model="formData.honourText"
                gx-maxlength="varchar200"
                placeholder="履约金缴费金额"
              />
            </td>
          </tr>
          <tr>
            <!---->
            <td>
              <el-form-item
                ref=""
                label="凭证附件"
                prop=""
              />
            </td>
            <td colspan="3">
              <upload
                ref="upload"
                :title="''"
                :data="fileData"
                :auto-delete="true"
                :auto-upload="true"
                file-ref="fileRef"
                but-text="点击上传"
              />
            </td>
          </tr>
        </table>
      </el-form>
    </section>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <el-button :loading="confirmLoading" @click="submit('00')">
          保存
        </el-button>
        <el-button @click="back">
          返回
        </el-button>
      </div>
    </div>
  </div>
</template>

<script>
/* 接口*/
import {
  addBidderHonour, // 新增
  updateBidderHonour, // 修改
  getAllBidderHonourById // 获取详情
} from '@/api/bidding/bidCalibration'
/* 公用方法*/
import { validateInput, characters1_auto } from '@/assets/js/validate'// 校验输入内容
import { randomData } from '@/assets/js/utils' // 随机生成id
import { getTime } from '@api/common/tools.js' // 获取服务器时间
/* 组件*/
import upload from '@comp/common/updownload/upload' // 附件上传组件

export default {
  name: 'ClarificationAdd',
  components: {
    upload
  },
  data() {
    return {
      confirmLoading: false,
      /* 字典信息-end */
      formData: {
        id: '', // 主键Id
        tenderName: '', // 招标项目名称
        tenderNo: '', // 招标编号
        packName: '', // 包件名称
        packNo: '', // 包件编号
        contractNo: '', // 合同编号
        contractName: '', // 合同名称
        bidName: '', // 中标人名称
        honourText: '', // 履约记录
        createDate: '' // 创建日期
      },
      // 校验
      rules: {
        tenderName: [{ required: true, validator: characters1_auto, trigger: 'change' }], // 中标人名称
        tenderNo: [{ required: true, validator: validateInput, trigger: 'blur' }], // 法人代表
        packName: [{ required: true, validator: validateInput, trigger: 'blur' }], // 中标人代码类型
        packNo: [{ required: true, validator: validateInput, trigger: 'blur' }], // 中标人代码
        contractNo: [{ required: true, validator: validateInput, trigger: 'blur' }], // 中标人联系地址
        contractName: [{ required: true, validator: validateInput, trigger: 'blur' }], // 机构联系电话
        bidName: [{ required: true, message: '请选择', trigger: 'change' }], // 奖惩类型
        honourText: [{ required: true, validator: validateInput, trigger: 'blur' }] // 奖惩说明
      }
    }
  },
  watch: {
    $route() {
      // 获取当前时间
      this.getCurrentTime()
    }
  },
  created() {
    this.init()
  },
  methods: {
    // 初始化
    init() {
      // 获取系统时间
      this.getNowTimes()
      if (this.$route.params.id) {
        this.queryRepresentInfo(this.$route.params.id)
      } else {
        this.formData.id = randomData()// 随机生成Id
      }
    },
    getNowTimes() {
      // 调用获取当前时间异步方法
      getTime().then((res) => {
        this.nowTimes = res.data.time
        this.formData.createDate = this.$Moment(this.nowTimes).format(this.momentDate)
      })
    },
    // 获取详情
    queryRepresentInfo(id) {
      getAllBidderHonourById(id).then(res => {
        this.formData = res.data
      }).catch(() => {

      })
    },
    // 返回
    back() {
      this.$router.push({
        path: '/fee/agentServiceFeeList'
      })
    },
    /*
    * 保存接口
    * type 01 生效 00 保存
    * */
    saveData(type) {
      this.getNowTimes()
      this.confirmLoading = true// btnLoding
      // 判断项目id是否存在 不存在走新增方法 存在走修改
      if (!this.$route.params.id) {
        this.addBidderHonour(type)
      } else {
        this.updateBidderHonour(type)
      }
    },
    // 新增
    addBidderHonour(type) {
      addBidderHonour(this.formData).then(response => {
        this.$message.success('操作成功')
        this.confirmLoading = false// btnLoding
        // 生效
        if (type === '01') {
          // 生效成功后返回列表
          this.back()
        }
      }).catch(() => {
        this.confirmLoading = false// btnLoding
      })
    },
    // 修改
    updateBidderHonour(type) {
      updateBidderHonour(this.formData).then(response => {
        this.$message.success('操作成功')
        this.confirmLoading = false// btnLoding
        // 生效
        if (type === '01') {
          // 生效成功后返回列表
          this.back()
        }
      }).catch(() => {
        this.confirmLoading = false// btnLoding
      })
    },
    // 提交
    submit() {
      this.$refs.fromData.validate((valid, field) => {
        if (valid) { // 校验通过
          this.$confirm('确定生效吗?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            confirmButtonClass: 'confirmBtn',
            cancelButtonClass: 'cancelBtn',
            type: 'warning'
          }).then(() => {
            this.saveData('01')
          })
        }
      })
    }
  }
}
</script>

<style scoped lang="less">

</style>
