<!--
  @description: 新版邀请公告邀请人名单-（不分包）选择投标人
  @Modifier: 张慢慢
  @routerPath:
  @date: 2020/1/19-10:11
-->
<template>
  <div class="mb10">
    <section>
      <div class="page-title">
        邀请人名单
        <el-button
          v-if="invitationType!=='02'"
          type="primary"
          icon="iconfont icon-tianjia1"
          class="mb16"
          style="display: inline-block"
          @click="selectBidder"
        >
          选择投标人
        </el-button>
      </div>
      <!--已邀请供应商列表-->
      <div>
        <el-table
          ref="multipleTable"
          :data="invitedTableData"
        >
          <el-table-column
            type="index"
            label="序号"
            width="60"
            align="center"
          />
          <el-table-column
            header-align="center"
            prop="supplierName"
            min-width="260"
            label="投标人/投标人名称"
          />
          <el-table-column
            header-align="center"
            prop="linkName"
            label="联系人"
          />
          <el-table-column
            header-align="center"
            prop="linkTel"
            label="联系电话"
          />
          <el-table-column
            header-align="center"
            prop="email"
            label="邮箱"
          />
          <el-table-column
            v-if="invitationType!=='02'"
            align="center"
            width="90"
            label="操作"
          >
            <template slot-scope="scope">
              <el-link
                type="primary"
                @click="deleteRow(scope.$index)"
              >
                [移除]
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </section>
    <!--保存按钮-->
    <!--选择招标人弹框-->
    <invitationSupplierListDialog :dialog-data="dialogData" @supplierSelect="supplierSelect" />
  </div>
</template>

<script>
/* api*/
import { queryInvitationSupplierList } from '@/api/bidding/bidInvitation'
import invitationSupplierListDialog from './invitationSupplierList-dialog'
export default {
  name: 'InvitationSupplierInfoAdd',
  components: {
    invitationSupplierListDialog
  },
  data() {
    return {
      invitationType: this.$store.getters.tenderBase.invitationType, // 邀请函类型
      groupId: this.$store.getters.groupId, // 包id 阶段id
      tenderId: this.$route.query.id, // 项目Id
      invitationId: this.$route.query.invitationId, // 邀请函Id
      confirmLoading: false, // 暂存、下一步Loding
      // 已选供应商列表
      invitedTableData: [],
      // 挑选供应商弹框
      dialogData: {
        supplierSelectVisible: false// 弹框展示状态
      }
    }
  },
  watch: {
    // 监听不分包已选供应商已选标段（包）
    invitedTableData(val) {
      this.$emit('invitedSupplierTableData', val)
    }
  },
  mounted() {
    if (this.invitationId) {
      this.getSelectedBidderList()
    }
  },
  methods: {
    // 获取已选择投标人信息列表
    getSelectedBidderList() {
      const data = {
        invitationId: this.invitationId,
        stageId: this.groupId.stageId // 阶段Id
      }
      queryInvitationSupplierList(data).then(res => {
        this.invitedTableData = res.data
      }).catch(() => {

      })
    },
    // 选择招标人
    selectBidder() {
      // 取供应商Id去去重
      const supplierId = [] // 已邀请供应商
      this.invitedTableData.map(item => {
        supplierId.push(item.supplierId)
      })
      this.dialogData = {
        supplierId: supplierId, // 供应商Id
        supplierSelectVisible: true// 弹框展示状态
      }
    },
    // 带回已选择的供应商 supplierList 选择的供应商
    supplierSelect(supplierList) {
      this.invitedTableData.push(...supplierList)
    },
    // 保存数据组装
    packageData() {
      this.invitedTableData.map((item) => {
        item.packId = this.groupId.packId
        item.stageId = this.groupId.stageId
        item.tenderId = this.tenderId
      })
      const data = {
        invitationId: this.invitationId,
        invitationSupplierInfoDtos: this.invitedTableData
      }
      return data
    },
    // 移除已邀请的投标人
    deleteRow(index) {
      this.$confirm('确认移除此供应商?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        this.invitedTableData.splice(index, 1)
      }).catch(() => {
      })
    }
  }
}
</script>

<style scoped lang="less">

</style>
