<!--
  @description: 招标-新增踏勘
  @Modifier: haoFx
  @routerPath:/bidding/projectDrive/projectExtend/bidProjectExtendAdd
  @date: 2020/3/4-10:28
-->
<template>
  <div class="main mb10">
    <div class="page-title">
      踏勘通知基本信息
    </div>
    <el-form
      ref="fromData"
      :rules="rules"
      :model="formData"
      :inline-message="true"
    >
      <table class="from_table">
        <tr>
          <td>
            <el-form-item label="通知名称" prop="noticeName" />
          </td>
          <td>
            <el-input
              v-model.trim="formData.noticeName"
              maxlength="50"
              placeholder="请填写通知名称"
            />
          </td>
          <td>
            <el-form-item label="踏勘现场截止时间" />
          </td>
          <td>
            <el-date-picker
              v-model="formData.explorationSceneEndTime"
              :picker-options="disabledPickerOptions"
              :format="elValueFormat"
              :value-format="elValueSaveFormat"
              placeholder="请选择踏勘现场截止时间"
              type="datetime"
              style="width: calc(100% - 60px)"
              @change="changeExplorationSceneEndTime(formData)"
            />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="项目（包组）名称" class="red-star" />
          </td>
          <td colspan="3">
            <packComponent
              ref="packComp"
              :select-pack-list="selectPackList"
              @getSupplierExplorationInfoList="getSupplierExplorationInfoList"
            />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="集合时间" />
          </td>
          <td>
            <el-date-picker
              v-model="formData.gatherTime"
              :picker-options="disabledPickerOptions"
              :format="elValueFormat"
              :value-format="elValueSaveFormat"
              placeholder="请选择集合时间"
              type="datetime"
              style="width: calc(100% - 60px)"
              @change="changeGatherTime(formData)"
            />
          </td>
          <td>
            <el-form-item label="集合地点" />
          </td>
          <td>
            <el-input
              v-model.trim="formData.gatherAddr"
              maxlength="200"
              placeholder="请填写集合地点"
            />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="答疑会时间" />
          </td>
          <td>
            <el-date-picker
              v-model="formData.meetTime"
              :picker-options="disabledPickerOptions"
              :format="elValueFormat"
              :value-format="elValueSaveFormat"
              placeholder="请选择答疑会时间"
              type="datetime"
              style="width: calc(100% - 60px)"
              @change="changeMeetTime(formData)"
            />
          </td>
          <td>
            <el-form-item label="答疑会地点" />
          </td>
          <td>
            <el-input
              v-model.trim="formData.meetAddr"
              maxlength="200"
              placeholder="请填写答疑会地点"
            />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="通知内容" />
          </td>
          <td colspan="3">
            <editor v-model="formData.noticeContent" style="margin: 12px 0" />
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="附件" />
          </td>
          <td colspan="3">
            <upload
              ref="upload"
              :data="upLoadData"
              :auto-delete="true"
              :auto-upload="isAutoUpload"
              :action="importFileUrl"
              title=""
              file-ref="fileRef"
            />
          </td>
        </tr>
      </table>
    </el-form>
    <div class="page-title">
      投标人踏勘信息
    </div>
    <div>
      <el-table
        :data="projectExtendInfoList"
      >
        <el-table-column
          header-align="center"
          prop="supplierName"
          min-width="200"
          label="投标人"
        />
        <el-table-column
          header-align="center"
          prop="linker"
          min-width="200"
          label="联系人"
        />
        <el-table-column
          header-align="center"
          min-width="200"
          prop="linkerTel"
          label="联系电话"
        />
      </el-table>
    </div>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h">
        <div class="but_footer-but">
          <el-button
            :loading="confirmLoading"
            type="primary"
            @click="saveData()"
          >
            保 存
          </el-button>
          <el-button
            :loading="confirmLoading"
            type="primary"
            @click="submit()"
          >
            提 交
          </el-button>
          <el-button @click="back">
            返 回
          </el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
/* api*/
import {
  getSupplierExplorationInfo,
  saveWinningBidder,
  getTenderExplorationById
} from '@api/bidding/exploration'
/* 组件*/
import packComponent from '../packComponent/packComponent' // 选择标段（包）
import upload from '@comp/common/updownload/upload'
import editor from '@comp/common/editor/editor' // 富文本编辑器组件
/* js混入*/
import { bidProjectExtendMixins } from '../mixins/bidProjectExtendMixins'
import { explorationTimeRule } from '../mixins/explorationTimeRule'

export default {
  name: 'BidProjectExtendAdd',
  components: {
    editor,
    packComponent,
    upload // 文件上传
  },
  mixins: [bidProjectExtendMixins, explorationTimeRule],
  data() {
    return {
      isAutoUpload: false,
      tenderId: this.$route.query.id, // 项目id
      explorationId: this.$route.query.explorationId, // 踏勘id
      upLoadData: {
        bizId: '',
        fileType: 'tender_exploration_notice_file_base'
      },
      // 校验
      rules: {
        noticeName: [{ required: true, message: '不能为空', trigger: 'blur' }] // 标题
      },
      selectPackList: [], // 获取的已选择的标段（包）
      projectExtendInfoList: [] // 投标人踏勘信息
    }
  },
  created() {
    if (this.explorationId) {
      // 项目经理-通过踏勘id获取详细信息
      this.getTenderExploration()
      this.isAutoUpload = true
      this.upLoadData.bizId = this.explorationId
    }
  },
  methods: {
    // 返回
    back() {
      this.$router.push({
        path: '/bidding/projectDrive/projectExtend/projectExtendNoticeList',
        query: {
          ...this.$route.query
        }
      })
    },
    // 项目经理-通过踏勘id获取详细信息
    getTenderExploration() {
      getTenderExplorationById(this.explorationId).then(res => {
        this.formData = res.data
        this.selectPackList = this.formData.bidtExplorationTenderExplorationExpandVo
        this.getSupplierExplorationInfoList()
      })
    },
    // 获取投标人踏勘信息
    getSupplierExplorationInfoList() {
      const data = this.getPackIds().stageIds.join(',') // 阶段id集合
      const params = {
        stageIds: data, // 阶段id集合
        noticeId: this.explorationId // 踏勘通知表id
      }
      getSupplierExplorationInfo(params).then(res => {
        this.projectExtendInfoList = res.data
      }).catch(() => {

      })
    },
    // 获取投标人踏勘信息标段信息
    getPackIds() {
      const saveParams = {
        packIds: [], // 标段id集合
        stageIds: [], // 阶段id集合
        packNo: [], // 标段编号集合
        packName: [] // 标段名称集合
      }
      this.selectPackList.map(item => {
        saveParams.packIds.push(item.packId) // 标段id集合
        saveParams.stageIds.push(item.stageId) // 阶段id集合
        saveParams.packNo.push(item.packNo) // 标段编号集合
        saveParams.packName.push(item.packName) // 标段名称集合
      })
      return saveParams
    },
    // 保存组装数据
    assemblyData() {
      const data = {
        ...this.formData,
        saveExplorationExpandDto: [...this.selectPackList],
        tenderId: this.tenderId,
        packIds: this.getPackIds().packIds.join(','), // 标段id集合
        stageIds: this.getPackIds().stageIds.join(','), // 阶段id集合
        packNo: this.getPackIds().packNo.join(','), // 标段编号集合
        packName: this.getPackIds().packName.join(',') // 标段名称集合
      }
      // 答疑会时间
      if (data.meetTime) {
        data.meetTime = this.$Moment(data.meetTime).format(this.momentSaveFormat)
      }
      // 踏勘截止时间
      if (data.explorationSceneEndTime) {
        data.explorationSceneEndTime = this.$Moment(
          data.explorationSceneEndTime
        ).format(this.momentSaveFormat)
      }
      // 集合时间
      if (data.gatherTime) {
        data.gatherTime = this.$Moment(data.gatherTime).format(this.momentSaveFormat)
      }
      return data
    },
    // 保存踏勘信息方法调用接口
    saveExplorationInfo(isOperation) {
      // 按标段发布时
      if (!this.$refs.packComp.isCheck()) {
        return // 校验是否选择标段（包）
      }
      const isTimeRule = this.explorationTimeRule(this.formData)
      if (!isTimeRule) return
      // 校验输入内容
      this.$refs.fromData.validate((valid, field) => {
        if (valid) { // 校验通过
          this.confirmLoading = true // btnLoding
          this.formData.isOperation = isOperation
          const data = this.assemblyData() // 组装数据
          saveWinningBidder(data)
            .then(res => {
              this.submitUploadFiles(res.data) // 手动上传附件
              this.formData.id = res.data // 保存id
              let text = '' // 提交完成-提示文字
              if (this.formData.isOperation === '00') { // 保存
                this.$router.push({
                  query: {
                    ...this.$route.query,
                    explorationId: res.data // 踏勘Id
                  }
                })
                text = '保存成功'
              } else { // 提交
                const data = {
                  ...this.$route.query
                }
                delete data.explorationId
                this.$router.push({
                  path: '/bidding/projectDrive/projectExtend/projectExtendNoticeList',
                  query: data
                })
                text = '提交成功'
              }
              this.$message({
                message: text,
                type: 'success'
              })
              this.confirmLoading = false // btnLoding
            })
            .catch(() => {
              this.confirmLoading = false // btnLoding
            })
        }
      })
    },
    // 保存
    saveData() {
      this.saveExplorationInfo('00')
    },
    // 提交
    submit() {
      this.$confirm('是否确认提交?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      })
        .then(() => {
          this.saveExplorationInfo('01')
        })
        .catch(() => {})
    },
    // 手动上传附件
    submitUploadFiles(id) {
      this.upLoadData.bizId = id
      this.$refs.upload.submitUpload() // 手动上传附件
    }
  }
}
</script>

<style lang="less" scoped>
/deep/.file-list {
  .fileBtn,
  li {
    margin-bottom: 0 !important;
  }
  .name {
    margin-right: 0 !important;
  }
}
</style>
