/**
 * 顶部header
 */
Vue.component("screen-header", {
    template: `
        <div :class="red?'head-title red-head':'head-title'">
            <div class="head-title-label">
                数字化集成管控平台
            </div>
            <div class="head-title-tab">
                <div v-for="(item,i) in menuData">
                    <div v-if="item.child.length==0" :class="chooseMenu.mainMenu == i?'head-nav active':'head-nav'" @click="pageJump(i,item.menuDeptUrl,item.menuProjectUrl)">{{item.menuName}}</div>
                    <header-btn :red="red" v-if="item.child.length!=0" :label="item.menuName" :nav="i" :index="i" :menu="item" @showsmallui="showsmallui" :list="item.child"></header-btn>
                </div>
            </div>
            <div class="head-title-select" @mouseleave="hideScreenUl">
                <div class="head-select">
                    <input type="text" :value="localStorage.text"  @click="showScreenUl" placeholder="请选择项目" readonly>
                </div>
                <el-collapse-transition>
                    <ul class="header-screen-ul" v-show="show">
                        <li v-for="item in data" @click="setScreenLi(item)">{{item.text}}</li>
                    </ul>
                </el-collapse-transition>
            </div>
            <div class="head-title-date">
                <div class="head-title-weather">
                    <img :src="weatherImg">
                    <span>{{dayWeather}}</span>
                    <span>{{temperature}}</span>
                </div>
                <div class="head-title-time">
                    <div class="head-title-date-con">{{date}}</div>
                    <div class="head-title-time-con">{{time}}</div>
                </div>
            </div>
        </div>
    `,
    props: {
        nav:{
            type:Number
        },
        red:{
            type:String
        },
        item:{
            type:Number
        },
    },
    data() {
        return {
            dayWeather: undefined,
            weatherImg: undefined,
            temperature: undefined,
            chooseMenu:{},
            show: false,
            data: [],
            timerID: undefined,
            time: '',
            date: '',
            week: '',
            menu: [],
            localStorage: JSON.parse(localStorage.getItem("data")),
            menuData:[],//菜单列表数据
        }
    },
    mounted(){
        this.timerID = setInterval(this.updateTime, 1000);
        this.updateTime();
        this.tableProject();
        this.menuList();
        this.init();
    },
    methods: {
        init(){
            this.localStorage=JSON.parse(localStorage.getItem("data"))
            this.chooseMenu = localStorage.getItem("chooseMenu");
            if(!this.chooseMenu){
                this.chooseMenu = {}
            } else {
                this.chooseMenu = JSON.parse(localStorage.getItem("chooseMenu"))
            }
            this.getWeather();
        },
        //页面条状
        pageJump(n,url,itemurl){
            if(this.localStorage.type == 1){
                if(url){
                    this.chooseMenu = {
                        mainMenu:n,
                    }
                    localStorage.setItem("chooseMenu",JSON.stringify(this.chooseMenu));
                    location.href = url
                }else{
                    this.$notify({
                        title: '提示',
                        message: '功能升级中，敬请期待！',
                        type: 'warning'
                    });
                }
            }else{
                if(itemurl){
                    this.chooseMenu = {
                        mainMenu:n
                    }
                    localStorage.setItem("chooseMenu",JSON.stringify(this.chooseMenu));
                    location.href = itemurl
                }else{
                    this.$notify({
                        title: '提示',
                        message: '功能升级中，敬请期待！',
                        type: 'warning'
                    });
                }
            }
        },

        pageJumpOther(url) {
            location.href = url
        },

        showScreenUl(){
            this.show = true
            this.$emit('showui',true);
        },
        hideScreenUl(){
            this.show = false
            this.$emit('showui',false);
        },
        /**
         * 点击切换项目
         * @param item
         */
        setScreenLi(item){
            localStorage.setItem("data",JSON.stringify(item));
            this.localStorage = JSON.parse(localStorage.getItem("data"));
            // this.$emit('itemdata',item);
            this.show = false;
            this.menuList1();
        },

        //时间方法
        updateTime(){
            var cd = new Date();
            this.time = this.zeroPadding(cd.getHours(), 2) + ':' + this.zeroPadding(cd.getMinutes(), 2) + ':' + this.zeroPadding(cd.getSeconds(), 2);
            this.date = this.zeroPadding(cd.getFullYear(), 4) + '年' + this.zeroPadding(cd.getMonth()+1, 2) + '月' + this.zeroPadding(cd.getDate(), 2)+'日';
        },
        zeroPadding(num, digit) {
            var zero = '';
            for(var i = 0; i < digit; i++) {
                zero += '0';
            }
            return (zero + num).slice(-digit);
        },

        showsmallui(e){
            this.$emit('showsmallui2',e);
        },

        /**
         * 获取当前用户项目筛选列表
         */
        tableProject() {
            axios({
                method: 'post',
                url: "/weixin/screen/listProjectInfo",
            }).then(res => {
                if(res.data.code == 200) {
                    let flag = 0;
                    var data = res.data.data
                    data.map(x => {
                        if(x.id == '0'){
                            x.type = 1
                        }else{
                            x.type = 2
                        }
                    })
                    this.data = data
                    localStorage.setItem("projectList",JSON.stringify(data))
                    if(localStorage.getItem("data") == "{}" || localStorage.getItem("data") == null){
                        localStorage.setItem("data",JSON.stringify(data[0]));
                        this.localStorage = JSON.parse(localStorage.getItem("data"));
                        this.$emit('itemdata',data[0]);
                    } else {
                        for(let i = 0;  i < data.length; i++){
                            if(JSON.parse(localStorage.getItem("data")).id == data[i].id){
                                if(
                                    JSON.stringify(localStorage.getItem("data")).clxh == null
                                    ||
                                    !JSON.stringify(localStorage.getItem("data")).clxh
                                )
                                {
                                    localStorage.setItem("data",JSON.stringify(data[i]))
                                }
                                flag = 1;
                                break;
                            }
                        }
                        if(flag == 1){
                            //this.$emit('itemdata',data[0]);
                        } else {
                            localStorage.setItem("data",JSON.stringify(data[0]));
                            this.localStorage = JSON.parse(localStorage.getItem("data"));
                            this.$emit('itemdata',data[0]);
                        }
                    }
                }
            })
        },

        /**
         * 获取大屏顶部菜单
         */
        menuList() {
            axios.post("/screen/menuconfig/getScreenMenuListByProjectId",{
                projectId: JSON.parse(localStorage.getItem("data")).id
            }).then(res => {
                let datas = res.data.rows;
                let dataParent = [];
                for (let i = 0; i < datas.length; i++) {
                    if (datas[i].parentId == undefined || datas[i].parentId == null || datas[i].parentId == '') {
                        //父层级数据生成
                        dataParent.push(datas[i]);
                    }
                }
                //循环遍历父层级数据
                for (let i = 0; i < dataParent.length; i++) {
                    let dataChild = [];
                    for (let k = 0; k < datas.length; k++) {
                        //匹配到子层级后
                        if (datas[k].parentId == dataParent[i].menuId) {
                            datas[k].text = datas[k].menuName;
                            datas[k].url = this.localStorage.type == 1?datas[k].menuDeptUrl:datas[k].menuProjectUrl;
                            dataChild.push(datas[k]);
                        }
                    }
                    dataParent[i].child = dataChild;
                }
                this.menuData = dataParent;
            })
        },

        //根据当前选中项目获取大屏顶部菜单并刷新当前页面
        menuList1() {
            axios.post("/screen/menuconfig/getScreenMenuListByProjectId",{
                projectId: JSON.parse(localStorage.getItem("data")).id
            }).then(res => {
                let url = "";
                let datas = res.data.rows;
                let dataParent = [];
                for (let i = 0; i < datas.length; i++) {
                    if (datas[i].parentId == undefined || datas[i].parentId == null || datas[i].parentId == '') {
                        //父层级数据生成
                        dataParent.push(datas[i]);
                        if(this.localStorage.type == 1){
                            if(datas[i].menuDeptUrl != undefined && datas[i].menuDeptUrl != null && datas[i].menuDeptUrl != ''){
                                url = url == ""?datas[i].menuDeptUrl:url;
                            }
                        }else{
                            if(datas[i].menuProjectUrl != undefined && datas[i].menuProjectUrl != null && datas[i].menuProjectUrl != ''){
                                url = url == ""?datas[i].menuProjectUrl:url;
                            }
                        }
                    }
                }
                //循环遍历父层级数据
                for (let i = 0; i < dataParent.length; i++) {
                    let dataChild = [];
                    for (let k = 0; k < datas.length; k++) {
                        //匹配到子层级后
                        if (datas[k].parentId == dataParent[i].menuId) {
                            datas[k].text = datas[k].menuName;
                            datas[k].url = this.localStorage.type == 1?datas[k].menuDeptUrl:datas[k].menuProjectUrl;
                            dataChild.push(datas[k]);
                            if(this.localStorage.type == 1){
                                if(datas[k].menuDeptUrl != undefined && datas[k].menuDeptUrl != null && datas[k].menuDeptUrl != ''){
                                    url = url == ""?datas[k].menuDeptUrl:url;
                                }
                            }else{
                                if(datas[k].menuProjectUrl != undefined && datas[k].menuProjectUrl != null && datas[k].menuProjectUrl != ''){
                                    url = url == ""?datas[k].menuProjectUrl:url;
                                }
                            }
                        }
                    }
                    dataParent[i].child = dataChild;
                }
                this.menuData = dataParent;
                if(url){
                    location.href = url;
                }
            })
        },

        /**
         * 查询公司级或项目级天气
         */
        getWeather(){
            if(
                JSON.parse(localStorage.getItem("data")).id
                &&
                JSON.parse(localStorage.getItem("data")).type == 2
            ){
                axios.post("/api/iot/power/getCityWeather",{
                    id: JSON.parse(localStorage.getItem("data")).id
                }).then(res => {
                    if(res.data.code == 0){
                        var data = res.data.data;
                        this.weatherImg = data.showapi_res_body.f1.day_weather_pic
                        this.dayWeather = data.showapi_res_body.f1.day_weather
                        this.temperature = data.showapi_res_body.f1.night_air_temperature + "~" + data.showapi_res_body.f1.day_air_temperature + "℃"
                    }
                })
            }else{
                axios({
                    method: 'get',
                    url: "/mkl/api/getEnvironmentOfCity?areaCode=xian",
                }).then(res => {
                    this.dayWeather = res.data.data.f1_day_weather;
                    this.weatherImg = res.data.data.f1_day_weather_pic;
                    this.temperature = res.data.data.f1_night_air_temperature +"~"+res.data.data.f1_day_air_temperature+"℃" ;
                })
            }
        },
    },
    watch:{

    }

})