<!--
  @description: 代理机构-邀请函列表-不分包-追加邀请函信息
  @Modifier: haoFx
  @routerPath:/bidding/noPackageAppendSupplierInvitation
  @date: 2020/2/7-10:55
-->

<template>
  <div class="p0-16">
    <div class="title clearfix">
      <div class="title-back pointer" @click="back">
        <i class="iconfont icon-fanhui mr10" />返回
      </div>
    </div>
    <div class="page-title">
      已选投标人
    </div>
    <noPackageSupplierInvitationDetail @getSupplier="getSupplier" />
    <div class="page-title">
      追加邀请名单
      <el-button type="primary" @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"
          min-width="260"
          prop="supplierName"
          label="投标单位名称"
        />
        <el-table-column
          header-align="center"
          prop="linkName"
          min-width="90"
          label="联系人"
        />
        <el-table-column
          header-align="center"
          prop="linkTel"
          min-width="90"
          label="联系电话"
        />
        <el-table-column
          header-align="center"
          prop="email"
          min-width="120"
          label="邮箱"
        />
        <el-table-column
          prop="isAgree"
          label="操作"
          width="90"
          align="center"
        >
          <template slot-scope="scope">
            <el-link
              type="primary"
              @click="removeSupplier(scope.row,scope.$index)"
            >
              [移除]
            </el-link>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h" />
      <div class="but_footer-but">
        <el-button type="primary" @click="submitClick">
          提 交
        </el-button>
        <el-button @click="back">
          返 回
        </el-button>
      </div>
    </div>
    <!--新增邀请人--选择招标人弹框-->
    <invitationSupplierListDialog
      :dialog-data="dialogData"
      @supplierSelect="supplierSelect"
    />
  </div>
</template>

<script>
/* 组件*/
import invitationSupplierListDialog from './invitationSupplierList-dialog'
import noPackageSupplierInvitationDetail from './noPackageSupplierInvitation-detail'
/* api*/
import { invitationAppendSupplierSave } from '@/api/bidding/bidInvitation'
export default {
  name: 'AddSupplierForInvitationDialog',
  components: {
    invitationSupplierListDialog,
    noPackageSupplierInvitationDetail
  },
  data() {
    return {
      groupId: this.$store.getters.groupId, // 包id 阶段id
      invitationId: this.$route.query.invitationId, // 邀请函id
      tenderId: this.$route.query.id, // 项目Id
      // 已选供应商列表
      invitedTableData: [],
      // 已邀请供应商列表
      selectedBidderList: [],
      // 挑选供应商弹框
      dialogData: {
        supplierSelectVisible: false// 弹框展示状态
      }
    }
  },
  methods: {
    // 子组件传回查看已选供应商信息
    getSupplier(val) {
      this.selectedBidderList = val
    },
    // 带回已选择的供应商 supplierList 选择的供应商
    supplierSelect(supplierList) {
      this.invitedTableData.push(...supplierList)
    },
    // 选择招标人
    selectBidder() {
      // 取供应商Id去去重
      const supplierId = [] // 已选择供应商id
      const departId = [] // 已选择供应商id
      this.selectedBidderList.map(item => {
        supplierId.push(item.supplierId)
      })
      this.invitedTableData.map(item => {
        departId.push(item.supplierId)
      })
      this.dialogData = {
        supplierId: [...supplierId, ...departId], // 供应商Id
        supplierSelectVisible: true// 弹框展示状态
      }
    },
    // 保存数据组装
    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
    },
    // 提交
    submitClick() {
      this.$confirm('确认提交?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        const data = this.packageData()// 保存数据组装
        invitationAppendSupplierSave(data).then(() => {
          this.$router.push({
            path: '/bidding/tenderInvitation'
          })
        }).catch(() => {
        })
      }).catch(() => {
      })
    },
    // 移除供应商
    removeSupplier(row, index) {
      this.$confirm('确认移除此供应商?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        this.invitedTableData.splice(index, 1)
      }).catch(() => {
      })
    },
    // 返回
    back() {
      this.$router.push({
        path: '/bidding/tenderInvitation'
      })
    }
  }
}
</script>

<style scoped lang="less">

</style>
