<!--
  @description: 抽取项目列表--随机抽取--抽取结果成功/失败
  @author: 徐媛媛
  @routerPath:/extractProject/expertProjectList
  /expert/extractDesigner
  @date: 2020-8-24 8:35:58
-->
<template>
  <div class="leave_container">
    <!--标题-->
    <div class="title title_border p0-16 pointer">
      <!--返回-->
      <i class="iconfont icon-fanhui" @click="back" />查看抽取结果
    </div>
    <div class="fram-content">
      <!--抽取项目信息-->
      <div class="page-title">
        <span>1 抽取项目</span>
      </div>
      <div>
        <el-table :data="applyDetailList" class="tableLimit mb16" border>
          <el-table-column type="index" label="序号" align="center" />
          <el-table-column
            width="300px"
            label="项目名称"
            align="center"
            prop="tenderName"
          />
          <el-table-column

            label="项目编号"
            align="center"
            prop="tenderNo"
          />
          <el-table-column

            width="300px"
            label="标段名称"
            align="center"
            prop="packName"
          />
          <el-table-column label="标段编号" align="center" prop="pakNo" />
        </el-table>
      </div>
      <!--抽取结果-->
      <div class="page-title">
        <span>2 抽取结果</span>
      </div>
      <div>
        <table class="tableData mb16">
          <tr>
            <td>抽取申请编号</td>
            <td>{{ extractResult.applyCode }}</td>
            <td>抽取结果</td>
            <td :class="extractResult.resultStatus==='01'?'successText':'failText'">
              {{ extractResult.resultStatus | extractingResults }}
            </td>
          </tr>
          <tr>
            <td>评标阶段</td>
            <td>{{ extractResult.stageType=='00'?"资格预审":"资格后审" }}</td>
            <td>专家确定方式</td>
            <td>{{ extractResult.rakeType=='00' ? '随机抽取':"直接指定" }}</td>
          </tr>
          <tr>
            <td>评标开始时间</td>
            <td>{{ extractResult.startTime }}</td>
            <td>预计评标结束</td>
            <td>{{ extractResult.endTime }}</td>
          </tr>
          <tr>
            <td>评标地点</td>
            <td colspan="3">
              {{ extractResult.proviceName }}{{ extractResult.cityName }}{{ extractResult.areaName }}{{ extractResult.adress }}
            </td>
          </tr>
          <tr>
            <td>申请抽取人数</td>
            <td>{{ extractResult.expertNum }}</td>
            <td>抽取成功人数</td>
            <td>{{ extractResult.realNum }}</td>
          </tr>
        </table>
      </div>
      <!--专家列表-->
      <div class="page-title">
        <div class="mb16">
          <span class="mr10">3 专家列表</span>
          <el-button class="export-list" @click="exportList">
            导出专家名单
          </el-button>
          <!-- isSupplementData 抽取随机抽取 并且抽取人数不够显示补抽 -->
          <el-button v-if="isSupplementData.isSupplementExtact" class="export-list" @click="supplementExtact">
            补 抽
          </el-button>
          <el-button v-if="isSupplementData.isSupplementRecord" class="export-list" @click="supplementRecord">
            补 录
          </el-button>
        </div>
      </div>
      <div class="mb16">
        <el-table v-if="from" :data="expertList" class="tableLimit" border>
          <el-table-column type="index" label="序号" align="center" />
          <el-table-column prop="expertName" label="专家姓名" align="center" />
          <el-table-column prop="mobile" label="联系方式" align="center" />
          <el-table-column prop="certificateCode" label="身份证号" align="center" />
          <el-table-column prop="specialName" label="专业" align="center" />
          <el-table-column prop="area" label="地区" align="center" />
        </el-table>
        <el-table v-if="!from" :data="expertList">
          <el-table-column type="index" label="序号" align="center" />
          <el-table-column prop="expertName" label="专家姓名" align="center" />
          <el-table-column prop="mobile" label="联系方式" align="center" />
          <el-table-column prop="certificateCode" label="身份证号" align="center" />
          <el-table-column prop="expertMajor" label="专业" align="center" />
          <el-table-column prop="address" label="地区" align="center" />
          <el-table-column prop="selectTime" label="抽取时间" align="center">
            <template slot-scope="{row}">
              <span>{{ row.selectTime && $Moment(row.selectTime).format(momentDateTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="status" label="状态" align="center">
            <template slot-scope="{row}">
              {{ row.isAttend | formatAttend }}
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center">
            <template slot-scope="{row}">
              <el-link
                v-if="row.isAttend=='00'"
                class="tablebutton"
                type="primary"
                @click="changeAttend(row.id,'01')"
              >
                同意
              </el-link>
              <el-link
                v-if="row.isAttend=='00'"
                class="tablebutton"
                type="primary"
                @click="changeAttend(row.id,'02')"
              >
                拒绝
              </el-link>
              <el-link
                v-if="row.isAttend=='01'&& row.status!='02'"
                class="tablebutton"
                type="primary"
                @click="leave(row)"
              >
                请假
              </el-link>
            </template>
          </el-table-column>
        </el-table>
        <!--分页组件-->
        <pagination :pagination-data="paginationData" @change="adminGetExtractApplyResultDetailInfoExpertNextPage" />
      </div>
      <div>
        <div class="page-title">
          <div class="mb16">
            <span class="mr10">4 招标方代表</span>
            <el-button v-if="isbidPersonnel" class="export-list" @click="bidPersonnel">
              补 录
            </el-button>
          </div>
        </div>
        <div>
          <el-table :data="purchaserDeputationList" class="tableLimit mb16" border>
            <el-table-column type="index" label="序号" width="60" align="center" />
            <el-table-column label="专家姓名" align="center" prop="purchaserName" />
            <el-table-column label="身份证号" align="center" prop="idCard" />
            <el-table-column label="手机号" align="center" prop="mobilePhone" />
            <el-table-column label="性别" align="center" prop="sex">
              <template slot-scope="{row}">
                {{ row.sex | sex }}
              </template>
            </el-table-column>
            <el-table-column prop="status" label="状态" align="center">
              <template slot-scope="{row}">
                {{ row.status | bidInviterStatus }}
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center">
              <template slot-scope="{row}">
                <el-link
                  v-if="row.status!=='02'"
                  type="primary"
                  @click="bidInviterToLeave(row)"
                >
                  请假
                </el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>
    <!-- 补录专家弹框 -->
    <extracExpertAdd ref="extracExpertAdd" />
    <bidPersonnelAdd ref="bidPersonnelAdd" />
  </div>
</template>
<script>
import {
  getExtractExpertResultDetailById,
  adminGetExtractApplyResultDetailInfoExpertNextPage,
  editAttendStatus,
  expertLeave,
  biddingLeave,
  adminExportExtractExpertBaseInfo } from '@/api/expert/expertscloud'
  /* 公共组件 */
import extracExpertAdd from './../extractCreateExpert/extracExpertAdd-dialog' // 补录专家
import bidPersonnelAdd from './../extractCreateExpert/extractBidDelegateAdd-dialog' // 补录专家
/* 混合开发方法-参数字段*/
import { ListMixin } from '@/mixins/ListMixin'// 分页
/* 组件*/
import pagination from '@comp/common/pagination/pagination' // 分页

export default {
  filters: {
    // 00 01
    extractingResults(val) {
      switch (val) {
        case null:
          return '待抽取'
        case '00':
          return '待抽取'
        case '01':
          return '抽取中'
        case '02':
          return '抽取完成'
        case '03':
          return '抽取人数不够'
      }
    },
    formatAttend(val) {
      switch (val) {
        case '01':
          return '同意'
        case '02':
          return '拒绝'
        case '04':
          return '请假'
      }
    },
    sex(val) {
      switch (val) {
        case '01':
          return '女'
        case '00':
          return '男'
      }
    },
    // 招标方代表人状态
    bidInviterStatus(val) {
      switch (val) {
        case '02':
          return '请假'
      }
    }
  },
  components: {
    extracExpertAdd,
    bidPersonnelAdd,
    pagination// 分页
  },
  mixins: [ListMixin],
  data() {
    return {
      expertList: [],
      applyDetailList: [],
      extractResult: {},
      applyID: '',
      resultList: [],
      expertSearch: {
        id: ''
      },
      from: '',
      expertStore: '',
      entryExpertProject: {},
      extractProject: [],
      purchaserDeputationList: []
    }
  },
  computed: {
    // 判断是否显示专家补抽补录按钮
    isSupplementData() {
      const data = {
        isSupplementExtact: false, // 随机抽取显示补抽按钮
        isSupplementRecord: false // 直接指定显示补录按钮
      }
      // 筛选出合格的专家数据 （isAttend 00 待应答 01同意为合格 02拒绝和请假为不合格）
      const accordWithExpert = this.expertList.filter(expertItem => {
        return expertItem.isAttend === '00' || expertItem.isAttend === '01'
      })
      // 抽取申请专家人数大于符合的专家人数
      if (this.extractResult.expertNum > accordWithExpert.length) {
        // 随机抽取显示补抽
        if (this.extractResult.rakeType === '00') {
          data.isSupplementExtact = true
          // 直接指定显示补录
        } else if (this.extractResult.rakeType === '01') {
          data.isSupplementRecord = true
        }
      } else {
        data.isSupplementExtact = false
        data.isSupplementRecord = false
      }
      return data
    },
    // 判断是否显示招标方补录招标方按钮
    isbidPersonnel() {
      let isbidPersonnel = false
      // 筛选出招标方未请假的人数 （status nu||01 未请假 02 请假）
      const bidInviterNoleaveData = this.purchaserDeputationList.filter(bidInviterItem => {
        return bidInviterItem.status !== '02'
      })
      // 抽取申请的招标方人数大于招标方未请假的人数显示补录按钮
      if (this.extractResult.ownerNum > bidInviterNoleaveData.length) {
        isbidPersonnel = true
      } else {
        isbidPersonnel = false
      }
      return isbidPersonnel
    }
  },
  mounted() {
    this.initData()
  },
  methods: {
    // 初始加载数据
    initData() {
      this.applyID = this.$route.query.id
      this.from = this.$route.query.from ? this.$route.query.from : ''
      // 根据id回显数据
      getExtractExpertResultDetailById({ applyId: this.applyID }).then(res => {
        const { data: { apply, applyDetailList, expertList, purchaserDeputationList }} = res
        // 抽取结果
        this.extractResult = apply
        this.extractResult.startTime = this.$Moment(this.extractResult.startTime).format('YYYY-MM-DD HH:mm')
        this.extractResult.endTime = this.$Moment(this.extractResult.endTime).format('YYYY-MM-DD HH:mm')
        // 抽取项目信息
        this.applyDetailList = applyDetailList
        // 专家列表
        if (this.from) {
          this.expertList = expertList
        }
        // 采购方代表
        this.purchaserDeputationList = purchaserDeputationList
      }).catch(res => {

      })
      this.expertSearch.id = this.applyID
      if (!this.from) {
        this.adminGetExtractApplyResultDetailInfoExpertNextPage()
      }
    },
    download(data) {
      if (!data) {
        return
      }
      const url = window.URL.createObjectURL(new Blob([data]))
      const link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      link.setAttribute('download', '专家名单.xls')
      document.body.appendChild(link)
      link.click()
    },
    exportList() {
      adminExportExtractExpertBaseInfo({ id: this.applyID }).then(res => {
        this.download(res)
      })
    },
    // 专家请假
    leave(row) {
      this.$confirm('确认专家请假?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        const dataParams = {
          applyId: this.extractResult.id,
          expertId: row.expertId
        }
        expertLeave(dataParams).then(res => {
          this.$message({
            type: 'success',
            message: '操作成功'
          })
          this.initData()
          // this.adminGetExtractApplyResultDetailInfoExpertNextPage()
        })
      }).catch(() => {
      })
    },
    // 招标方请假
    bidInviterToLeave(row) {
      this.$confirm('确认招标人请假吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        const data = {
          applyId: row.applyId, // 抽取申请id
          purchaserId: row.purchaserId // 招标人id
        }
        biddingLeave(data).then(res => {
          this.$message({
            type: 'success',
            message: '操作成功'
          })
          this.initData() // 刷新数据
        })
      }).catch(() => {
      })
    },
    // 管理员获取专家列表
    adminGetExtractApplyResultDetailInfoExpertNextPage() {
      const param = Object.assign({}, this.expertSearch)
      param.pageNo = this.paginationData.pageNo
      param.pageSize = this.paginationData.pageSize
      adminGetExtractApplyResultDetailInfoExpertNextPage(param).then(res => {
        this.expertList = res.data.records
        this.paginationData.total = res.data.total
      })
    },
    // 拒绝
    changeAttend(id, isAttend) {
      editAttendStatus(id, isAttend).then(res => {
        this.$message({
          type: 'success',
          message: '操作成功'
        })
        this.initData()
      })
    },
    // 返回
    back() {
      this.$router.push({
        name: 'extractApplyList'
      })
    },
    // 补抽专家
    supplementExtact() {
      this.$router.push({
        name: 'extractProjectMakeUpContent',
        params: {
          id: this.extractResult.id,
          type: '01' // 补抽返回时 跳到抽取申请列表
        }
      })
    },
    // 直接指定-打开补录专家
    supplementRecord() {
      // 筛选出符合的专家数据 isAttend 00 待应答 01同意
      const accordWithExpert = this.expertList.filter(expertItem => {
        return expertItem.isAttend === '00' || expertItem.isAttend === '01'
      })
      this.$refs.extracExpertAdd.openDialogGetLoadData({
        dialog: true,
        applyId: this.extractResult.id, // 抽取申请主键id
        expertIds: this.getexpertIds(), // 获取已经存在专家的ids
        expertNum: this.extractResult.expertNum, // 申请抽取人数
        qualifiedExprtNum: accordWithExpert ? accordWithExpert.length : 0 // 符合的专家个数
      })
    },
    // 打开补录招标方代表-弹框
    bidPersonnel() {
      // 筛选出招标方未请假的人数 （status nu||01 未请假 02 请假）
      const bidInviterNoleaveData = this.purchaserDeputationList.filter(bidInviterItem => {
        return bidInviterItem.status !== '02'
      })
      this.$refs.bidPersonnelAdd.openDialogGetLoadData({
        dialog: true,
        applyId: this.extractResult.id, // 抽取申请主键id
        bidPersonnelIds: this.getbidPersonnelIds(), // 获取已经存在专家的ids
        ownerNum: this.extractResult.ownerNum, // 招标方代表人数
        bidPersonnelNum: bidInviterNoleaveData ? bidInviterNoleaveData.length : 0 // 招标方代表数
      })
    },
    // 获取现有专家的id 为补录专家排除已有专家
    getexpertIds() {
      const expertIds = []
      if (this.expertList.length > 0) {
        this.expertList.forEach(expertItem => {
          expertIds.push(expertItem.expertId)
        })
      }
      return expertIds
    },
    // 获取现有招标方的id为补录招标方排除已选择的招标人
    getbidPersonnelIds() {
      const bidPersonnelIds = []
      if (this.purchaserDeputationList.length > 0) {
        this.purchaserDeputationList.forEach(bidPersonnel => {
          bidPersonnelIds.push(bidPersonnel.id)
        })
      }
      return bidPersonnelIds
    }
  }
}
</script>
<style lang="less" scoped>
.successText{
  color:green;
  font-weight: 500;
}
.failText{
  color:red;
  font-weight: 500;
}
.fram-content{
  padding: 10px 60px 20px 16px;
}
</style>

