<!--
  @description: 开标大厅等待开标-开标倒计时界面或者倒计时结束界面
  @Modifier: haoFx
  @routerPath:/bidding/projectDrive/bidOpening/openingHall
  /bidOpeningHall/openingHall
  @date: 2020/3/18-14:54
-->
<template>
  <div>
    <div class="open-info">
      <el-row type="flex" class="row-bg">
        <el-col :span="5" class="left-center-left">
          <!-- 左边-小屏幕-->
          <div class="openInfo-left">
            <p>当前时间</p>
            <span>
              {{ presentTime?presentTime: sysCurrentTime }}
            </span>
          </div>
        </el-col>
        <!-- 大屏幕 -->
        <el-col :span="14" class="left-center-right">
          <div class="bg-purple-light">
            <!--开标倒计时-->
            <div v-if="sysCurrentTime" class="openingCountdown p16-0">
              <h2 class="openingCountdown_title">
                开标倒计时：
              </h2>
              <count-down
                :end-time="todayOpeningInfo.openBidStartTime"
                :sys-current-time="sysCurrentTime"
                style="display: inline-block"
                @end_callback="countDownE_cb"
              />
            </div>
            <!--开标标段信息-->
            <ul class="project_info p0-16">
              <li class="clearfix">
                项目
                <span class="blue Underline" @click="viewProjectPackList('00')">
                  {{ todayOpeningInfo.tenderNumber }}
                </span>个 （标包
                <span class="blue Underline" @click="viewProjectPackList('00')">
                  {{ todayOpeningInfo.packageNumber }}
                </span>个，有效投标人
                <span class="blue">
                  {{ todayOpeningInfo.validBidderNumber }}
                </span>家）
                <span v-if="!todayOpeningInfo.msTimeShow" class="hint fr">开标时间已到，可以点击开启开标了</span>
                <span v-if="todayOpeningInfo.msTimeShow" class="hint fr">数据持续更新中，以开标时间截止为准，开标时间到后可开标</span>
              </li>
              <!--开标按钮-->
              <li class="clearfix">
                <!--
                  tenderBase.isCanOperate(驱动进来): true可以操作 false不可以查看只有查看权限  00:否 01:是
                  $route.query.isCanOperate（redis版）true可以操作 false不可以查看只有查看权限
                -->
                <el-button
                  v-if="tenderBase.isCanOperate || $route.query.isCanOperate"
                  :disabled="todayOpeningInfo.msTimeShow"
                  type="primary"
                  class="fr"
                  @click="makeSureOpen"
                >
                  开 标
                </el-button>
              </li>
              <!--不满足开标标段信息-->
              <li>
                <span class="red Underline" @click="viewProjectPackList('02')">
                  {{ todayOpeningInfo.discontentThreeBidderPackageNumber }}
                </span>
                个标包不满足三家投标人
                <i
                  :class="isValidBidderPackInfo?'arrow-is-active':''"
                  class="icon toggle-arrow el-icon-arrow-right"
                  @click="toggleRowStatus"
                />
              </li>
            </ul>
            <!-- 不满足开标的标段列表 -->
            <el-scrollbar
              :class="isValidBidderPackInfo?'pack-block':''"
              class="validBidder_wrap_scrollbar scrollbar"
            >
              <validBidderPackInfo ref="validBidderPackInfo" class="main" />
            </el-scrollbar>
          </div>
        </el-col>
        <!-- 右边小屏幕 -->
        <el-col :span="5" class="right-center-right">
          <div class="openInfo-right">
            <p>开标时间</p>
            <span>
              {{ todayOpeningInfo.openBidStartTime && $Moment(todayOpeningInfo.openBidStartTime).format(momentDateTime) }}
            </span>
          </div>
        </el-col>
      </el-row>
      <!-- 监标人-图片-->
      <div class="bidTenderSupervisor" />
      <div class="is_open">
        <!--启动视频会议-->
        <!-- isCanOperate: true可以操作 false不可以查看只有查看权限  00:否 01:是 -->
        <template v-if="tenderOpenVideoConferenceDisplay==='01' && (tenderBase.isCanOperate || $route.query.isCanOperate)">
          <el-button
            type="primary"
            icon="iconfont icon-shipinhuiyi"
            @click="startVideoConferencing"
          >
            启动视频会议
          </el-button>
          <!--启动视频会议-->
          <el-button
            type="primary"
            icon="iconfont icon-yaoqing"
            @click="videoConferenceInvitation"
          >
            会议邀请
          </el-button>
        </template>
        <!--返回主页-按钮-->
        <el-button
          type="primary"
          icon="iconfont icon-xuanzhongshangcheng"
          @click="openClick"
        >
          返回主页
        </el-button>
      </div>
    </div>
    <!--开标时间到-选择开启标段弹框-->
    <selectOpenPackDialog
      ref="selectOpenPack"
      :ms-time-show="todayOpeningInfo.msTimeShow"
      @makeSureOpen="makeSureOpen"
    />
    <!--视频会议邀请投标人-->
    <supplierVideoConferenceDialog ref="supplierVideoConference" />
  </div>
</template>

<script>
/* 组件*/
import selectOpenPackDialog from './selectOpenPack-dialog'// 开标时间到-选择开启标段弹框
import countdown from '@comp/bidding/countdownCom/countdown'// 开标时间到-倒计时
import validBidderPackInfo from '../beforeBidOpening/validBidderPackInfo-list'// 不满足开标的标段列表
import supplierVideoConferenceDialog from '../supplierVideoConference/supplierVideoConference-dialog' // 邀请投标人参与视频会议
/* api*/
import {
  getValidBidderSumNumberByStageIds,
  judgeOpenBidStartTimeArrived,
  getNotOpeningAndSatisfyThreeBidderStageIds,
  startDecryptBidFile,
  startFocusBidOpening,
  managerOpenFSMeetingRoom } from '@api/bidding/bidOpening'
  /* 混入 */
import { bidOpeningMixin } from '../mixins/bidOpeningMixin'// 开标公共方法
import { bidOpeningRedisConfigMixin } from '../mixins/bidOpeningRedisConfigMixin'

export default {
  name: 'OpeningHall',
  components: {
    selectOpenPackDialog, // 开标时间到-选择开启标段弹框
    'count-down': countdown, // 开标时间到-倒计时
    validBidderPackInfo, // 不满足开标的标段列表
    supplierVideoConferenceDialog // 邀请投标人参与视频会议
  },
  mixins: [bidOpeningMixin, bidOpeningRedisConfigMixin],
  data() {
    return {
      tenderBase: this.$store.getters.tenderBase, // 项目信息
      path: this.$route.path, // 当前路由
      isValidBidderPackInfo: false, // 是否显示不足三家标段信息
      openBidStartTimeArrived: '', // 开标时间是否已到 00:未到 01:已到
      notSatisfiedThreeBidder: false // 获取开标大厅未开启的并且满足三家投标人标段集合
    }
  },
  mounted() {
    // 视频会议是否显示: 00 不显示 01 显示
    this.getReSingingButtonDisplay()
    // 初始化获取系统当前时间
    this.getCurrentTime('setIntervalTime')
    // 定时获取有效投标人家次和不满足三家有效投标人标段数
    this.setIntervalGetValidBidderSumNumber()
    // 判断开标时间是否已到
    this.isOpenBidStartTimeArrived()
    this.$store.dispatch('setIsTool')// 获取是否是使用工具端访问
  },
  beforeDestroy() {
    clearInterval(this.timer)
  },
  methods: {
    // 定时获取有效投标人家次和不满足三家有效投标人标段数
    setIntervalGetValidBidderSumNumber() {
      this.getValidBidderSumNumber() // 初始化调用获取（解决定时器延时执行问题）
      this.timer = setInterval(() => {
        this.getValidBidderSumNumber()
      }, this.validBidderSumNumber)
    },
    // 调用接口获取有效投标人家次和不满足三家有效投标人标段数
    getValidBidderSumNumber() {
      getValidBidderSumNumberByStageIds(this.openTypeStageIds).then(res => {
        // 有效投标人家数
        this.todayOpeningInfo.validBidderNumber = res.data.validBidderNumber
        // 不满足三家投标人标段数
        this.todayOpeningInfo.discontentThreeBidderPackageNumber = res.data.discontentThreeBidderPackageNumber
        this.$forceUpdate()// 数据强制刷新
      }).catch(() => {
      })
    },
    // 判断开标时间是否已到
    isOpenBidStartTimeArrived() {
      // openBidStartTime 开标时间
      const data = {
        openBidStartTime: this.todayOpeningInfo.openBidStartTime
      }
      judgeOpenBidStartTimeArrived(data).then(res => {
        // 开标时间是否已到 00:未到 01:已到
        this.openBidStartTimeArrived = res.data.openBidStartTimeArrived
        if (this.openBidStartTimeArrived === '01') {
          //  调用接口获取有效投标人家次和不满足三家有效投标人标段数
          this.getValidBidderSumNumber()
          // 清除定时器
          clearInterval(this.timer)
        }
      })
    },
    // 倒计时结束回调 判断是否显示开标按钮
    countDownE_cb(type) {
      // type false为倒计时停止
      this.todayOpeningInfo.msTimeShow = type
      // 倒计时停止 确认是否已到开标时间
      if (!this.todayOpeningInfo.msTimeShow) {
        this.isOpenBidStartTimeArrived()
      }
    },
    // 查看开启未开启列表
    viewProjectPackList(type) {
      this.$refs.selectOpenPack.open(type)
    },
    // 获取开标大厅未开启的并且满足三家投标人标段集合
    getNotOpeningAndSatisfyThreeBidder() {
      getNotOpeningAndSatisfyThreeBidderStageIds(this.openTypeStageIds).then(res => {
        const { isVerificationPassed, stageIds } = res.data
        if (stageIds) {
          // isVerificationPassed 是否检验通过 00 否(前端显示标段弹出框) 01是(可以直接开标)
          if (isVerificationPassed === '01') {
            this.openTypeStageIds.stageIds = stageIds // 符合开标的标段集合（符合三家阶段id）
            this.startDecryptBid()
          } else {
            // 后端校验未通过 00 投标人解密 && 价格开标阶段(经济) 点击开启需要弹框
            if (this.todayOpeningInfo.bidDocumentDecryptionMethod === '00' && this.todayOpeningInfo.openStageType === '02') {
              // 打开（未开启列表）开标标段
              this.$refs.selectOpenPack.open('00')
            }
          }
        } else {
          this.$message.warning('没有符合开标的标段')
        }
      }).catch(() => {
      })
    },
    // 确认开启
    makeSureOpen(stageIds, type) {
      this.isOpenBidStartTimeArrived()
      if (this.openBidStartTimeArrived === '01') {
        this.$confirm('确认开启吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          confirmButtonClass: 'confirmBtn',
          cancelButtonClass: 'cancelBtn',
          type: 'warning'
        }).then(() => {
          /* 判断是否勾选标段开标否则开启全部标段
          * type 类型 Boolean true勾选标段 false 直接开启
          * */
          if (type) {
            this.openTypeStageIds.stageIds = stageIds // 已选阶段id集合
            this.startDecryptBid()
          } else { // 默认开启全部标段
            // 获取开标大厅未开启的并且满足三家投标人标段集合
            this.getNotOpeningAndSatisfyThreeBidder()
          }
        }).catch(() => {
        })
      } else {
        this.$message({
          type: 'warning',
          message: '未到开标时间'
        })
      }
    },
    // 启动远程解密
    startDecryptBid() {
      // 投标文件解密方式 00:投标人解密 01:服务端集中解密
      if (this.todayOpeningInfo && this.todayOpeningInfo.bidDocumentDecryptionMethod === '01') {
        const params = {
          ...this.openTypeStageIds,
          openBidStartTime: this.todayOpeningInfo.openBidStartTime // 开标时间
        }
        // 启动服务端集中解密
        startFocusBidOpening(params).then(res => {
          this.$message({
            type: 'success',
            message: res.header.msg
          })
          this.enteringHall()
        }).catch(() => {

        })
      } else {
        // 启动投标人解密
        startDecryptBidFile(this.openTypeStageIds).then(res => {
          this.$message({
            type: 'success',
            message: res.header.msg
          })
          this.enteringHall()
        }).catch(() => {
        })
      }
    },
    // 进入大厅
    enteringHall() {
      // 根据标包个数判断是否分包
      if (this.todayOpeningInfo.packageNumber > 1) {
        // 判断是否是工具端 如果是工具端跳转到工具特定页面 如果不是工具端 正常跳转页面
        if (this.$store.state.app.isTool) {
        // 如果分包进入分包界面
          this.$router.push({
            path: '/toolProject/packageBidOpeningDecryptionRedis',
            query: {
              ...this.$route.query
            }
          })
        } else {
        // 如果分包进入分包界面
          this.$router.push({
            path: this.decryptionPath.packagePath,
            query: {
              ...this.$route.query
            }
          })
        }
      } else {
        // 判断是否是工具端 如果是工具端跳转到工具特定页面 如果不是工具端 正常跳转页面
        if (this.$store.state.app.isTool) {
        // 如果不分包进入不分包界面
          this.$router.push({
            path: '/toolProject/noPackageBidOpeningDecryptionRedis',
            query: {
              ...this.$route.query
            }
          })
        } else {
        // 不分包进入不分包界面
          this.$router.push({
            path: this.decryptionPath.noPackagePath,
            query: {
              ...this.$route.query
            }
          })
        }
      }
    },
    // 退出
    openClick() {
      const path = this.todayOpeningInfo.path ? this.todayOpeningInfo.path : this.decryptionPath.bidOpeningTodayPath
      // 判断是否是工具登陆 isTool true工具 false正常浏览器
      // 如果是工具端返回主页则需要调用工具端方法
      if (this.$store.state.app.isTool) {
        // 调用工具端返回方法
        window.WebKitAppObj.returnBidOpeningHall()
      } else {
        // 驱动进入
        if (this.todayOpeningInfo.path) {
          sessionStorage.setItem('isShowOneStepsBidOpening', '00') // 驱动进入返回显示‘进入开标大厅按钮’
        }
        this.$router.push({
          path: path,
          query: {
            ...this.$route.query
          }
        })
      }
      // 离开开标大厅页面清除-session存储信息
      sessionStorage.removeItem('todayOpeningInfo')
    },
    // 切换是否展开不足三家标段信息
    toggleRowStatus() {
      this.isValidBidderPackInfo = !this.isValidBidderPackInfo
      this.$refs.validBidderPackInfo.loadData()
    },
    // 启动视频会议
    startVideoConferencing() {
      managerOpenFSMeetingRoom(this.openTypeStageIds).then(res => {
        window.open(res.data.visitUrl, '_self')
      }).catch(() => {
      })
    },
    // 视频会议邀请
    videoConferenceInvitation() {
      this.$refs.supplierVideoConference.openDialogSupplierVideoConference(this.openTypeStageIds)
    }
  }
}
</script>

<style scoped lang="less">
  @import "../index";

  .openingCountdown {
    text-align: center;
    // 开标时间样式
    .openingCountdown_title {
      text-align: center;
      display: inline-block;
      margin-bottom: 16px;
    }
  }

  .validBidder_wrap_scrollbar {
    height: 0;
    visibility: hidden;
    transition: height 0.2s linear;
  }

  .pack-block {
    visibility: visible;
    height: calc(100% - 79.2px - 120px);
  }

  // 展开折叠样式
  .toggle-arrow {
    padding: 0 16px;
    cursor: pointer;
    transition: transform .3s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-weight: bold;
  }

  .arrow-is-active {
    transform: rotate(90deg)
  }
</style>
