<!--
  @description: 代理机构-邀请函列表-分包-追加邀请函信息
  @Modifier: haoFx
  @routerPath:/bidding/packageAppendSupplierInvitation
  @date: 2020/3/7-19:57
-->
<template>
  <div>
    <div v-if="invitationDetailType==='00'" class="p0-16 title clearfix">
      <div class="title-back pointer" @click="back">
        <i class="iconfont icon-fanhui mr10" />返回
      </div>
    </div>
    <div :class="invitationDetailType==='00'?'view':'main'">
      <div class="page-title">
        已选投标人
      </div>
      <packageSupplierInvitationDetail :selected-bidder="selectedBidder" />
      <div class="page-title">
        追加邀请名单
      </div>
      <!--标段列表-->
      <div>
        <el-table
          ref="package"
          :data="packageList"
        >
          <el-table-column
            label="序号"
            type="index"
            width="50"
            align="center"
          />
          <el-table-column
            header-align="center"
            label="标段（包）编号"
            align="center"
            prop="packNo"
          />
          <el-table-column
            header-align="center"
            label="标段（包）名称"
            prop="packName"
            align="center"
          />
          <el-table-column
            label=""
            align="center"
            width="250"
          >
            <template slot-scope="scope">
              <el-link
                type="primary"
                @click="inviteSuppliers(scope.row,scope.$index)"
              >
                [邀请供应商]
              </el-link>
              <el-link
                :underline="false"
                type="primary"
                @click="selectedSuppliers(scope.row,scope.$index)"
              >
                [已选供应商]（{{ scope.row.suppliersList && scope.row.suppliersList.length }}）
              </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"
      />
      <!--（分包）已挑选招标人弹框-->
      <packageSelectedSuppliersListDialog
        :dialog-data="selectSupplierListData"
        @supplierSelect="supplierSelect"
      />
    </div>
  </div>
</template>

<script>
/* api*/
import { invitationAppendSupplierSave } from '@/api/bidding/bidInvitation'
/* 组件*/
import invitationSupplierListDialog from './invitationSupplierList-dialog'
import packageSelectedSuppliersListDialog from './packageSelectedSuppliersList-dialog'
import packageSupplierInvitationDetail from './packageSupplierInvitation-detail'
/* 混入公共方法*/
import { packageAppendSupplierInvitation } from '../mixins/packageAppendSupplierInvitation'
export default {
  name: 'PackageAddSupplierInvitation',
  components: {
    invitationSupplierListDialog,
    packageSelectedSuppliersListDialog,
    packageSupplierInvitationDetail
  },
  mixins: [packageAppendSupplierInvitation],
  data() {
    return {
      invitationDetailType: this.$route.meta.invitationDetailType, // 判断类型驱动下查看01 菜单下查看00
      // 挑选供应商弹框
      dialogData: {
        supplierId: [], // 供应商Id去重列表
        packIndex: '', // 标段索引,
        supplierSelectVisible: false// 弹框展示状态
      },
      routerPath: '' // 返回提交跳转路径
    }
  },
  created() {
    // 判段返回提交跳转路径 00 邀请函返回列表 01 返回驱动下邀请函列表
    if (this.invitationDetailType === '00') {
      this.routerPath = '/bidding/tenderInvitation'
    } else {
      this.routerPath = '/bidding/projectDrive/invitation/invitationList'
    }
  },
  methods: {
    /* ---------------------------挑选供应商-弹框 Start------------------------------*/
    // 邀请供应商
    inviteSuppliers(row, packIndex) {
      // 取供应商Id去去重
      const supplierId = []
      const departIds = []
      // 已选投标人id集合
      this.selectedBidder[packIndex].suppliersList.map(chid => {
        supplierId.push(chid.supplierId)
      })
      // 追加投标人id集合
      this.packageList[packIndex].suppliersList.map(item => {
        departIds.push(item.supplierId)
      })
      this.dialogData = {
        supplierId: [...supplierId, ...departIds], // 供应商Id
        packIndex: packIndex, // 标段索引
        supplierSelectVisible: true// 弹框展示状态
      }
    },
    // 带回已选择的供应商 supplierList 选择的供应商
    supplierSelect(supplierList, packIndex, status) {
      if (status === '01') { // 添加供应商
        supplierList.forEach((item) => {
          item.packId = this.packageList[packIndex].packId
          item.stageId = this.packageList[packIndex].stageId
        })
        this.packageList[packIndex].suppliersList.push(...supplierList)
      } else { // 移除
        this.packageList[packIndex].suppliersList = supplierList
      }
    },
    // 已挑选供应商
    selectedSuppliers(row, index) {
      this.selectSupplierListData.isShowRemoveBtn = true
      this.selectSupplierListData.packIndex = index
      this.selectSupplierListData.dialog = true// 查看状态
      this.selectSupplierListData.suppliersList = this.packageList[index].suppliersList
    },
    /* ---------------------------挑选供应商-弹框 End------------------------------*/
    // 保存数据组装
    packageData() {
      const invitedTableData = []
      /* 处理保存供应商信息参数*/
      const len = this.packageList.length
      for (let i = 0; i < len; i++) {
        invitedTableData.push(...this.packageList[i].suppliersList)
      }
      /* 最终保存参数*/
      const data = {
        invitationId: this.invitationId,
        invitationSupplierInfoDtos: 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: this.routerPath,
            query: {
              ... this.$route.query
            }
          })
        }).catch(() => {
        })
      }).catch(() => {
      })
    },
    // 返回
    back() {
      this.$router.push({
        path: this.routerPath,
        query: {
          ... this.$route.query
        }
      })
    }
  }
}
</script>

<style scoped lang="less">

</style>
