<template>
  <div>
    <NavBar />
    <div class="bigBox">
      <van-row>
        <van-col span="24">
          <div class="textTitle">任务名称:{{ taskData?.taskName }}</div>
        </van-col>
        <van-col span="24">
          <div class="text">调阅开始时间:{{ taskData?.taskStartTime }}</div>
        </van-col>
      </van-row>
      <div v-if="taskData?.coreMonitoringTaskRegistrationMonitorVOList">
        <!-- 调阅列表 -->
        <div class="topBox" v-for="item in taskData.coreMonitoringTaskRegistrationMonitorVOList" :key="item.id">
          <!-- //主机列表组件 -->
          
          <MonitoingList :list="item"></MonitoingList>
        </div>
      </div>

      <!-- 底部按钮 -->
      <div class="bottomClass">
        <van-row>
          <van-col span="24">
            <van-button type="info" @click="addInfoHandler">添加调阅记录</van-button>
          </van-col>
        </van-row>
        <van-row>
          <van-col span="24">
            <van-button type="info" @click="endMontor">结束调阅</van-button>
          </van-col>
        </van-row>
      </div>
    </div>
  </div>
</template>
<script>
import NavBar from '@/components/NavBar'
// 主机列表组件
import MonitoingList from './monitoringList.vue'
import { Col, Row, Dialog, Icon, Picker } from 'vant'
import { registrationList,getEndInfo, login } from '@/api/toConsult.js'

export default {
  data() {
    return {
      taskData: {}
    }
  },
  components: {
    NavBar,
    Dialog,
    Icon,
    Picker,
    Col,
    Row,
    MonitoingList
  },

  created() {
    this.init()
    console.log(this);
    
   
  },
  methods: {
    //项目初始化获取数据
    init() {
      
      registrationList({ taskId: this.$route.params.id }).then(res => {
        let { code, data, msg } = res
        if (code == 200) {
          this.taskData = data
        }
      })
    },
    addInfoHandler() {
      console.log(this.taskData);
      this.$router.push('/addInfo/'+this.$route.params.id+'_'+this.taskData.id+'_add')
    },
    //结束调阅
    endMontor(){
     let startDate=JSON.parse(JSON.stringify(this.taskData.taskStartTime)) 
      console.log(startDate);
      startDate=Date.parse(new Date(startDate))
     let endDate=Date.parse(new Date())
      if((endDate-startDate)<=3600000){
        Dialog({message:'该调阅未满一个小时请确认'})
      }
      startDate=new Date(startDate)
      getEndInfo({
        id:this.taskData.id,
        taskId:this.$route.params.id
      }).then(res=>{
this.$router.push('/monitoringCall')
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.bigBox {
  height: calc(100vh - 260px);
  overflow: scroll;
  // height: 100vh;
  background-color: #f2f2f2;
  .textTitle {
    font-size: 40px;
    font-weight: bold;
    padding: 20px;
  }
  .text {
    padding: 20px;
    font-size: 26px;
  }
  .topBox {
    margin-bottom: 10px;
    margin: 20px;
  }
  .bottomClass {
    position: fixed;
    width: 100%;
    bottom: 0%;
  }
  .van-button {
    width: 100%;
    margin-top: 10px;
    border-radius: 10px;
  }
}
</style>
