<template>
    <van-row class="recordList" style="padding-bottom:40px;">
      <van-row class="titleWrap">
        <span class="line"></span>
        <span class="title">会议室统计</span>
      </van-row>
      <van-row class="meeting">
        <van-row class="tip ">会议室昨日使用情况</van-row>
        <pie :resData="list.pie" />
        <van-row class="data">
          <van-row>
            <van-col span="13">会议室总数:</van-col>
            <van-col span="11" class="bgcJB1">{{data.roomTotal}}间</van-col>
          </van-row>
          <van-row>
            <van-col span="13">在用会议室:</van-col>
            <van-col span="11" class="bgcJB2">{{data.roomInUse}}间</van-col>
          </van-row>
        </van-row>
      </van-row>
    </van-row>
</template>
<script>
import axios from 'axios'
import pie from "@/components/record/meeting/pie";
import * as echarts from "echarts";
export default {
  components: {
  	pie,
  },
  props:["resInfo"],
  data() {
    return {
      data:{
        roomInUse: undefined,
        attendeeIsSign: undefined,
        attendeeTotal: undefined,
        roomTotal: undefined
      },
      list:{}
    };
  },
  watch:{
    resInfo(val,old){
      this.list = val
    }
  },
  mounted() {
    this.init()
    setInterval(()=>{
      this.init()
    },1000*60*10)
  },
  methods: {
    init(){
      axios({
        method: 'get',
        url: 'https://smartpark.caih.com/hyxt/api/thirdparty/meetingRoom/summary',
        timeout: 30000,
      }).then(res =>{
        if(res.data){
          this.data = res.data
        }
      }).catch(err =>{
      })
    },
    
  },
};
</script>
<style lang="scss" scopet>
.meeting{
  margin-top:0px !important;
  padding-bottom:10px;
  .data{
    width:50%;
    float:right;
    margin-top:25px !important;
    display: inline-block;
    vertical-align: top;
    font-size: 12px;
    color:#000;
    .van-row{
      margin-top:10px;
      .van-col{
        padding:6px 10px !important;
        box-sizing: border-box;
      }
      .van-col:nth-child(1){
        text-align: right !important;
      }
      .van-col:nth-child(2){
        text-align: center !important;
        color:#fff;
        border-radius: 20px;
      }
      
    }
  }
}
.tip{
  margin-top:6px;
  color:#03C2F4;
  
}
</style>
