<!--
  @description: 驱动下开标入口（判断一步开标，两步开标）
  分为两种情况一步开标展示单页面一步开标说明：
    当前节点处于开标默认进入开标大厅
    点击进入开标大厅判断是否存在启动时间（代表开标中）进入查看投标人信息界面
    不存在启动时间（未开标）进入开标大厅等待界面
    openingStatus==='01' 开标完成则不显示‘进入开标大厅按钮’ 展示开标结果
  两步开标展示tab页
  @Modifier: haoFx
  @routerPath:/bidding/projectDrive/bidOpening/bidOpeningHallEntrance
  @date: 2020-4-17-14:49
-->
<template>
  <div class="main" style="margin-top:0px">
    <!--一步开标展示-->
    <div v-if="isShowOneStepsBidOpening">
      <!--未完成开标展示进入大厅-->
      <el-row v-if="rowData.openingStatus!=='01'" type="flex" class="row-bg" justify="center" style="margin-top: 15vh">
        <el-col :span="6" class="bg-purple">
          <div class="bg-purple-img">
            <el-button type="primary" class="enterHalBtn" @click="enterHal('00')">
              进入开标大厅
            </el-button>
          </div>
        </el-col>
      </el-row>

      <!--已开标展示开标结果 传给子组件开标状态openStageType为01  openingStatus==='01开标完成显示开标结果-->
      <bidOpeningResult-detail v-if="rowData.openingStatus==='01'" :open-stage-type="openStageType" />
    </div>
    <!--tabs-两步开标时展示-->
    <el-tabs v-if="isShowTwoStepsBidOpening" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="第一步开标过程" name="01">
        <!--第一步开标 未开标展示进入开标大厅-->
        <el-row v-if="rowData.openingStatus!=='01'" type="flex" class="row-bg" justify="center" style="margin-top: 15vh">
          <el-col :span="6" class="bg-purple">
            第 1 步 商务技术标开标
            <div class="bg-purple-img">
              <el-button type="primary" class="enterHalBtn" @click="enterHal('01')">
                进入开标大厅
              </el-button>
            </div>
          </el-col>
        </el-row>

        <!--已开标展示开标结果 传给子组件开标状态openStageType为01  openingStatus==='01开标完成显示开标结果-->
        <bidOpeningResult-detail v-if="rowData.openingStatus==='01'" :open-stage-type="openStageType" />
      </el-tab-pane>
      <el-tab-pane label="第二步开标过程" name="02">
        <!--第二步开标 未开标展示进入开标大厅-->
        <el-row v-if="rowData.openingStatus!=='01'" type="flex" class="row-bg" justify="center" style="margin-top: 15vh">
          <el-col :span="6" class="bg-purple">
            第 2 步 经济标开标
            <div class="bg-purple-img">
              <el-button type="primary" class="enterHalBtn" @click="enterHal('02')">
                进入开标大厅
              </el-button>
            </div>
          </el-col>
        </el-row>

        <!--已开标展示开标结果 传给子组件开标状态openStageType为02 openingStatus==='01开标完成显示开标结果-->
        <bidOpeningResult-detail v-if="rowData.openingStatus==='01'" :open-stage-type="openStageType" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
/* 接口*/
import { getBidOpeningResultInfo } from '@/api/bidding/bidOpening'// 获取开标结果信息
/* 组件*/
import bidOpeningResultDetail from '../bidOpeningResult/bidOpeningResult-detail'
export default {
  name: 'BidOpeningHallEntrance',
  components: {
    'bidOpeningResult-detail': bidOpeningResultDetail // 开标结果组件
  },
  data() {
    return {
      activeName: '01', // 两步开标默认选择第一步开标过程
      groupId: this.$store.getters.groupId, // 项目Id 标段Id 阶段Id

      // 开标信息-所有的开标信息
      tableData: [],
      rowData: {}, // 当前步骤开标信息
      openStageType: '01', // 00一次开标阶段(商务技术经济)，01非价格开标阶段(商务技术)，02价格开标阶段(经济)
      path: this.$route.path, // 当前路由
      isShowOneStepsBidOpening: false, // 一步开标显隐
      isShowTwoStepsBidOpening: false, // 两步开标显隐
      sessionisShowOneStepsBidOpening: ''// 取sessionStorage有值则显示‘进入开标大厅按钮’
    }
  },
  watch: {
    'rowData.openingStatus'(val) {
      this.todayOpeningInfo()
    }
  },
  created() {
    // 取sessionStorage有值则显示‘进入开标大厅按钮’
    const isBidOpeningBtn = sessionStorage.getItem('isShowOneStepsBidOpening')
    this.sessionisShowOneStepsBidOpening = isBidOpeningBtn || ''
  },
  mounted() {
    this.initData()// 获取开标结果信息
  },
  methods: {
    // 获取开标结果信息
    initData() {
      const data = {
        stageId: this.groupId.stageId, // 阶段Id
        tenderId: this.groupId.tenderId// 项目Id
      }
      getBidOpeningResultInfo(data).then(res => {
        this.tableData = res.data // 项目（标段）开标结果
        this.setInitData(res.data)
      })
    },
    // 循环取出当前要展示的第几步开标
    setInitData(bidOpenData) {
      // 判断是否是两步开标大于1是两步开标  否则为一步开标
      if (bidOpenData.length > 1) {
        this.isShowTwoStepsBidOpening = true // 显示两步开标
        bidOpenData.map(item => {
          if (item.openStageType === this.openStageType) {
            this.rowData = item // 当前开标信息
          }
        })
      } else {
        this.isShowOneStepsBidOpening = true // 显示一步开标
        this.rowData = this.tableData[0]
        /* ====================判断是否开标完成=========================*/
        /*
        * openingStatus 00未开标 01开标完成 02开标中
        * openingStatus === '01' 开标完成进入开标结果
        * 未开标 开标中进入开标大厅
        *  */
        if (this.rowData.openingStatus !== '01') {
          // 如果sessionisShowOneStepsBidOpening有值 表示从开标大厅返回 则显示进入大厅按钮
          // 否则不显示 直接进入开标大厅
          if (this.sessionisShowOneStepsBidOpening !== '00') {
            this.enterHal()
          }
        }
      }
    },
    // 进入大厅
    enterHal() {
      // 存储当前开标标包信息
      this.todayOpeningInfo()
      // openingStatus 开标状态  00未开标 01开标完成 02开标中
      // 两步开标时 经济标未设置开标时间不可以进入大厅
      if (this.rowData.openingTime) {
        // 如果开启时间为真 说明已经启动开标 则进入投标人界面 否则进入开标大厅等待界面
        if (this.rowData.openingStatus && this.rowData.openingStatus !== '00') {
          // 进入不分包界面 (查看投标人信息界面)
          this.$router.push({
            path: '/bidOpeningHallRedis/noPackageBidOpeningDecryptionRedis',
            query: {
              ...this.$route.query
            }
          })
        } else {
          // 进入开标大厅等待界面
          this.$router.push({
            path: '/bidOpeningHall/openingHall',
            query: {
              ...this.$route.query
            }
          })
        }
      } else {
        this.$message.warning('未设置经济开标时间')
      }
    },
    // 点击切换tab
    handleClick(tab) {
      this.openStageType = tab.name
      this.initData()
    },
    // 存储当前开标标包信息
    todayOpeningInfo() {
      // session存储当前页面开标信息
      const rowData = {
        path: this.path,
        stageIds: this.groupId.stageId, // 阶段Id
        openBidStartTime: this.rowData.openingTime, // 开标时间
        bidDocumentDecryptionMethod: this.rowData.bidDocumentDecryptionMethod, // 投标文件解密方式 00:投标人解密 01:服务端集中解密
        openStageType: this.rowData.openStageType, // 00一次开标阶段(商务技术经济)，01非价格开标阶段(商务技术)，02价格开标阶段(经济)
        tenderNumber: 1, // 项目数
        packageNumber: 1, // 标包数
        msTimeShow: true// 倒计时状态
      }
      sessionStorage.setItem('todayOpeningInfo', JSON.stringify(rowData))
    }
  }
}
</script>

<style scoped lang="less">
  .bg-purple{
    text-align: center;
    margin: 0 30px;
    .bg-purple-img{
      background: url("~@assets/img/bidding/bidOpening/bid_open_bg.png") no-repeat center/100%;
      height: 300px;
/*      justify-content: center;!*水平居中*!
      align-items: center;    !*垂直居中*!
      display: flex;*/
      .enterHalBtn{
        margin-top: calc((300px - 40px ) / 2);
      }
    }
  }

</style>
