<template>
  <div class="main-basic">
<!--    <basic-page ></basic-page>-->
<!--    &lt;!&ndash;左侧内容模块&ndash;&gt;-->
<!--    <template v-slot:contentLeft>-->
<!--      <left-content-page></left-content-page>-->
<!--    </template>-->
<!--    &lt;!&ndash;右侧&ndash;&gt;-->
    <!--分公司下拉框-->
    <drop-down-box @select="selectIndex"></drop-down-box>
    <weather-data :filiale.sync="f_orgname" ></weather-data>
    <time></time>
    <div class="content-header">{{ f_orgname }}</div>
    <div class="inform" v-if="false"><span><i></i>{{ data.inform }}</span></div>
    <!--工单模块-->
    <work-order-page :filiale-id.sync="filiale"></work-order-page>
    <!--完成率模块-->
    <percentage-complete :filiale-id.sync="filiale" @wanchenglv="wanchenglvs" ></percentage-complete>
    <!--echart-->
    <percentage-complete-echart :wancheng-lv.sync="wanchenglvss" ></percentage-complete-echart>
    <!--用户模块-->
    <userinfo :filiale-id.sync="filiale"></userinfo>
    <!--来电统计模块-->
    <incoming-telegram></incoming-telegram>
    <!---->
<!--    <rate-top></rate-top>-->
<!--    <rate-bottom></rate-bottom>-->
    <!--客服状态模块-->
    <service-status></service-status>
  </div>
</template>

<script>
import WorkOrderPage from "./WorkOrderPage";
// import Select from "./Select";
import {HttpResetClass} from "vue-client";
import PercentageComplete from "./PercentageComplete";
import PercentageCompleteEchart from "./PercentageCompleteEchart";
import RateTop from "./RateTop";
import RateBottom from "./RateBottom";
import WeatherData from "./WeatherData";
import ServiceStatus from "./ServiceStatus";
import IncomingTelegram from "./IncomingTelegram";
import DropDownBox from "./DropDownBox";
export default {
  components: {ServiceStatus,IncomingTelegram,DropDownBox, WeatherData, PercentageComplete,PercentageCompleteEchart, WorkOrderPage,RateTop,RateBottom},
  title:'CallReportMainPage',
  data() {
    return {
      // model:"初入数据",
      data:{
        inform:'2022.3.7号停气',
      },
      f_orgname:'',
      filiale:'',
      wanchenglvss:'',
    }
  },
  name: "CallReportMainPage",
  methods:{
    wanchenglvs(val){
      console.log("这里是父组件",val)
      this.wanchenglvss=val
      console.log("wanchenglvss",this.wanchenglvss)
    },
    selectIndex(val){
      console.log("selectIndex",val)
      this.filiale=val.value
      this.f_orgname=val.label
    }
    },
  watch: {
    'filiale'(val){
      console.log('toOrgid=====filiale===>',val)
    }
  }
}
</script>

<style scoped>
.main-basic{
  /* margin: 0; */
  width: 100vw;
  height: 100vh;
  background-image: url("../../../../static/images/zhongyi/background.png");
  background-repeat: no-repeat;
}
.content-header {
  width: 25.333vw;
  height: 3.519vh;
  font-size: 2.704vh;
  color: #fff;
  position: absolute;
  top: 1.389vh;
  left: 42.6vw;
  line-height: 3.333vh;
  font-weight: bolder;
  font-family: '黑体';
}
.inform {
  width: 35.833vw;
  height: 6.019vh;
  background-image: url("../../../../static/images/zhongyi/orangebg.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  background-size: cover;
  position: absolute;
  top: 11.204vh;
  left: 31.458vw;
  text-align: center;
}

.inform span {
  font-size: 40px;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 33px;
  position: relative;
  top: 1.204vh;
}

.inform i {
  width: 2.03125vw;
  height: 2.87vh;
  background-image: url("../../../../static/images/zhongyi/trumpet.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  background-size: cover;
  position: absolute;
  left: -2.604vw;
  top: 1.111vh;
}
.filiale{
  width: 300px;
  height: 50px;
  position: absolute;
  top: 75px;
  left: 31px;
}
.font_normal_body{
  color: #fff;
}
/*.default.focus,default.focus,dropdown-menu{*/
/*  background: #0f136c;*/
/*}*/
</style>
