 <!--
  @description: 抽取专家-专家审核/查看申请详情
  @Modifier: 徐媛媛
  @routerPath:/extractExpert/extractReview/--专家审核
  /extractExpert/extractApplyDetail--查看申请详情
  @date: 2020/8/26-13:27
-->
<template>
  <div>
    <section class="title title_border p0-16 clearfix">
      <template>
        <!-- 抽取申请 -->
        <div>
          <i class="iconfont icon-fanhui" @click="back" />
          抽取申请
        </div>
      </template>
    </section>
    <div class="leave_container p0-16">
      <el-scrollbar class="all_extract">
        <!--抽取项目-查看-->
        <applyDetailListDetail :table-data="extractProjectoList" />
        <!--抽取申请表-查看-->
        <etractApplyFormDetail :table-data="etractApplyForm" />
        <!--设置抽取条件-查看-->
        <extractConditionListDetail v-if="rakeType==='00'" :table-data="etractConditionList" />
        <!--录入专家-查看-->
        <inputExpertListDetail v-if="rakeType==='01'" :table-data="inputExpertList" />
        <!--录入采购方代表-查看-->
        <buyerRepresentativeListDetail :table-data="buyerRepresentativeList" />
        <!--设置回避单位-查看-->
        <avoidanceUnitListDetail v-if="rakeType==='00'" :table-data="avoidanceUnitList" />
        <!--回避专家-查看-->
        <avoidanceExpertListDetail v-if="rakeType==='00'" :table-data="avoidanceExpertList" />
        <el-form v-if="isShow" ref="form" label-width="160px">
          <div class="page-title">
            <span>审核意见</span>
            <div>
              <table class="from_table" border>
                <tr>
                  <td>
                    <el-form-item label="审核意见" prop="otherDesc" align="center" />
                  </td>
                  <td colspan="3">
                    <el-input
                      v-model.trim="auditExpertApplyForm.otherDesc"
                      type="textarea"
                      maxlength="50"
                      style="width: 100%;"
                      placeholder="审核意见"
                      class="show-word-limit-padding"
                    />
                  </td>
                </tr>
              </table>
            </div>
            <div style="text-align:center;margin:8px auto">
              <el-button type="primary" @click="auditExpertApply('01')">
                审核通过
              </el-button>
              <el-button @click="auditExpertApply('02')">
                审核不通过
              </el-button>
            </div>
          </div>
        </el-form>
      </el-scrollbar>
      <addExpertDialog ref="addExpertDialog" />
    </div>
  </div>
</template>

<script>
/* 公用方法*/
import { getExtractExpertDetailById, getExpertList, adminAuditExtractApply } from '@/api/expert/expertscloud'
/* 组件 */
import addExpertDialog from '@/views/expert/extractExpert/etractApplyDialog/addExpert-dialog'
import applyDetailListDetail from '@/views/expert/extractExpert/etractApplyDetail/etractProjectList-detail' // 项目抽取查看
import etractApplyFormDetail from '@/views/expert/extractExpert/etractApplyDetail/etractApplyForm-detail' // 抽取申请表-查看
import extractConditionListDetail from '@/views/expert/extractExpert/etractApplyDetail/etractConditionList-detail' // 设置抽取条件-查看
import buyerRepresentativeListDetail from '@/views/expert/extractExpert/etractApplyDetail/buyerRepresentativeList-detail' // 录入采购方代表-查看
import avoidanceUnitListDetail from '@/views/expert/extractExpert/etractApplyDetail/avoidanceUnitList-detail' // 设置回避单位-查看
import avoidanceExpertListDetail from '@/views/expert/extractExpert/etractApplyDetail/avoidanceExpertList-detail' // 回避专家-查看
import inputExpertListDetail from '@/views/expert/extractExpert/etractApplyDetail/inputExpertList-detail' // 录入专家-查看
export default {
  components: {
    addExpertDialog,
    applyDetailListDetail, // 项目抽取查看
    etractApplyFormDetail, // 抽取申请表-查看
    extractConditionListDetail, // 设置抽取条件-查看
    buyerRepresentativeListDetail, // 录入采购方代表-查看
    avoidanceUnitListDetail, // 设置回避单位-查看
    avoidanceExpertListDetail, // 回避专家-查看
    inputExpertListDetail // 录入专家-查看
  },
  data() {
    return {
      showPage: true,
      auditStatus: '',
      pageType: '',
      buttonVal: '专家变更',
      extractProjectoList: [], // 项目抽取列表
      etractApplyForm: [], // 抽取申请表
      etractConditionList: [], // 设置抽取条件列表
      buyerRepresentativeList: [], // 录入采购方代表列表
      avoidanceUnitList: [], // 设置回避单位列表
      avoidanceExpertList: [], // 回避专家
      inputExpertList: [], // 录入专家
      formData: {
        otherDesc: '' // 审核意见
      },
      isShow: false,
      applyID: '',
      rakeType: '01', // 指定抽取方式 00随机抽取 01直接指定
      auditExpertApplyForm: {
        otherDesc: ''
      }
    }
  },
  watch: {
    '$route.path': {
      immediate: true,
      handler(val) {
        if (val === '/expert/extractApplyAudit-detail') {
          this.isShow = true
        } else {
          this.isShow = false
        }
      }
    }
  },
  mounted() {
    const id = this.$route.query.id ? this.$route.query.id : ''
    this.applyID = id
    // this.type = this.$route.query.type ? this.$route.query.type : ''
    // this.pageType = this.$route.query.pageType
    // 根据id回显数据
    this.loadData(id)
  },
  methods: {
    loadData(id) {
      getExtractExpertDetailById(id).then(res => {
        this.rakeType = res.data.apply.rakeType
        this.auditStatus = res.data.apply.auditStatus
        this.extractProjectoList = res.data.applyDetailList
        this.etractApplyForm = res.data.apply
        this.buyerRepresentativeList = res.data.purchaserList // 采购方代表
        this.avoidanceUnitList = res.data.companyList // 设置回避单位
        this.inputExpertList = res.data.expertList // 录入专家
        this.avoidanceExpertList = res.data.avoidExpertList // 回避专家
        res.data.condionList.forEach((item) => {
          this.etractConditionList.push(item.con)
        })
      }).catch(() => {
      })
    },
    // onExpertChange() {
    //   if (this.buttonVal === '添加专家') {
    //     this.$refs.addExpertDialog.openDialog()
    //   }
    //   this.buttonVal = '添加专家'
    // },
    // getExtractExpertDetailById(id) {
    //   getExtractExpertDetailById(id).then(res => {
    //     this.extractProjectoList = res.data.applyDetailList
    //     this.etractApplyForm = res.data.apply
    //     res.data.condionList.forEach((item) => {
    //       this.etractConditionList.push(item.con)
    //     })
    //     this.buyerRepresentativeList = res.data.purchaserList // 采购方代表
    //     this.avoidanceUnitList = res.data.companyList // 设置回避单位
    //     this.avoidanceExpertList = res.data.avoidExpertList // 回避专家
    //     this.inputExpertList = res.data.avoidExpertList // 录入专家
    //     this.extractApply = res.data.apply
    //     this.type = res.data.apply.rakeType
    //   }).catch(() => {
    //   })
    // },
    auditExpertApply(type) {
      this.auditExpertApplyForm.auditStatus = type
      this.auditExpertApplyForm.id = this.$route.query.id
      if (type === '02' && !this.auditExpertApplyForm.otherDesc) {
        this.$message({
          type: 'warning',
          message: '审核意见不能为空'
        })
        return false
      }
      const text = type === '01' ? '确认审核通过？' : '确认审核不通过？'
      this.$confirm(text, '提示', {
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning'
      }).then(() => {
        adminAuditExtractApply(this.auditExpertApplyForm).then(res => {
          this.$router.replace('/expert/extractApplyAudit-list')
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
    // 获取专家列表
    getExpertList() {
      this.expertSearch.expertIds = []
      this.expertList.forEach(item => {
        this.expertSearch.expertIds.push(item.id)
      })
      getExpertList(this.expertSearch).then(res => {
        this.expertData = res.data.returnData
        this.expertTotal = res.data.rows * 1
      })
    },
    // 返回
    back() {
      this.$router.push({
        path: 'extractApplyList'
      })
    }
  }
}
</script>

<style lang="less" scoped>
.page-title{
  margin: 16px 0;
}
//设置取消按钮向右浮动，左magin为10px，即与确定按钮间距为10px
/deep/.el-message-box__btns .btn-custom-cancel {
  float: right;
  margin-left: 10px;
}
</style>
