layui.extend({
    common    :   'js/common',
}).use(['layer', 'element','form', 'table', 'laydate'], function () {

    var $ = layui.jquery;

    var layer = layui.layer;

    var element = layui.element;

    var form = layui.form;

    var laydate = layui.laydate;

    var index = 0;

    //下属账户数量
    var initSubordinateFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getSubordinateAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200") {//
                    $("#subordinate_account").html(res.data);
                }else{
                    $("#subordinate_account").html(0);
                }
            }
        });
    };

    //设备覆盖数量
    var initDeviceCoverFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getDeviceCoverAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#cover_provice").html(res.data.provinceCount);
                    $("#cover_city").html(res.data.cityCount);
                    $("#device_account").html(res.data.totalCount);
                    $("#device_month_account").html(res.data.monthCount);
                    $("#device_offline_count").html(res.data.offlineCount);
                }else {
                    $("#cover_provice").html(0);
                    $("#cover_city").html(0);
                    $("#device_account").html(0);
                    $("#device_month_account").html(0);
                    $("#device_offline_count").html(0);
                }
            }
        });
    };

    //小区总数量及本月新增
    var initResidentialFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getResidentialAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#residential_account").html(res.data.totalCount);
                    $("#residential_month_account").html(res.data.monthCount);
                }else{
                    $("#residential_account").html(0);
                    $("#residential_month_account").html(0);
                }
            }
        });
    };

    //单元总数量及本月新增
    var initUnitFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getUnitAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#unit_account").html(res.data.totalCount);
                    $("#unit_month_account").html(res.data.monthCount);
                }else{
                    $("#unit_account").html(0);
                    $("#unit_month_account").html(0);
                }
            }
        });
    };

    //住户总数量及本月新增
    var initUserFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getUserAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#user_account").html(res.data.totalCount);
                    $("#user_month_account").html(res.data.monthCount);
                }else{
                    $("#user_account").html(0);
                    $("#user_month_account").html(0);
                }
            }
        });
    };
    //认证待审核的住户
    var initApplyUserFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getApplyUserAccountWithCheckState" + "?checkState=0",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#apply_user_account").html(res.data.applyUserReadyCheckCount);
                }else{
                    $("#apply_user_account").html(0);
                }
            }
        });
    };



    //广告投放总数量及本月新增
    var initAdPushFn = function() {
        $.ajax({
            type: "GET",
            url:  "/home/getAdPushAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#ad_account").html(res.data.totalCount);
                    $("#ad_month_account").html(res.data.monthCount);
                }else{
                    $("#ad_account").html(0);
                    $("#ad_month_account").html(0);
                }
            }
        });
    };

    //会员总数量及本月新增
    var initMemberFn = function () {
        $.ajax({
            type: "GET",
            url:  "/home/getMemberAccount",
            cache: false,
            success: function (res) {
                if(res.code=="200" && res.data) {
                    $("#member_account").html(res.data.totalCount);
                    $("#member_month_account").html(res.data.monthCount);
                }else{
                    $("#member_account").html(0);
                    $("#member_month_account").html(0);
                }
            }
        });
    };

    laydate.render({
        elem: '#year'
        ,type: 'year'
        ,format: 'yyyy'
        ,max: 0
        ,done: function(value){
            if (index == 0) {
                initDeviceFaultCharts(value,3);
            } else {
                initAdWatchCharts(value,3);
            }
            $("#month_div").remove();
            $("#day_div").remove();
            $("#year_div").after("<div id=\"month_div\" class=\"layui-inline\">\n" +
                "                            <label class=\"layui-form-label line40\">月份</label>\n" +
                "                            <div class=\"layui-input-inline\">\n" +
                "                                <input type=\"text\" class=\"layui-input\" id=\"month\" placeholder=\"请选择查询月份\">\n" +
                "                            </div>\n" +
                "                        </div>");
            var min = value+"-01-01";
            var max = 0;
            var now = new Date();
            var init = value+"-01";
            if(value != now.getFullYear()){
                max = value+"-12-31";
            }
            laydate.render({
                elem: '#month'
                ,type: 'month'
                ,format: 'yyyy-MM'
                ,value:init
                ,min:min
                ,max:max
                ,done: function(value,date){
                    if (index == 0) {
                        initDeviceFaultCharts(value,2);
                    } else {
                        initAdWatchCharts(value,2);
                    }
                    $("#day_div").remove();
                    $("#month_div").after("<div id=\"day_div\" class=\"layui-inline\">\n" +
                        "                            <label class=\"layui-form-label line40\">日份</label>\n" +
                        "                            <div class=\"layui-input-inline\">\n" +
                        "                                <input type=\"text\" class=\"layui-input\" id=\"day\" placeholder=\"请选择查询日期\">\n" +
                        "                            </div>\n" +
                        "                        </div>");
                    var min = value+"-01";
                    var max = 0;
                    var now = getFormatDate();
                    var init = value+"-01";
                    if (date.date >= 0 && date.date <= 9) {
                        date.date = "0" + date.date;
                    }
                    if((value + "-"+date.date) != now){
                        max = value + "-" +laydate.getEndDate(date.month, date.date);
                    }
                    laydate.render({
                        elem: '#day'
                        ,type: 'date'
                        ,format: 'yyyy-MM-dd'
                        ,value:init
                        ,min:min
                        ,max:max
                        ,done: function(value){
                            if (index == 0) {
                                initDeviceFaultCharts(value,0);
                            } else {
                                initAdWatchCharts(value,0);
                            }
                        }
                    });
                    $("#day").val("");
                }
            });
            $("#month").val("");
        }
    });

    //设备故障次数
    var myCharts_device = echarts.init(document.getElementById('device_data'), myEchartsTheme);
    var option_device = {
        title: {
            text: '故障次数趋势',
            textStyle: {
                color: '#333',
                fontWeight:'bold',
                fontSize: 18
            },

        },
        tooltip: {
            trigger: "axis",
            formatter: "{b}<br>故障次数趋势：{c}",  backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',

        },
        grid: {
            left: '0',
            right: '0',
            bottom: '0',
            containLabel: true
        },
        xAxis: {
            data: [],
            axisLine: {
                lineStyle: {
                    color: '#5a5a5a'
                }
            },
            axisPointer: {
                snap: true,
                lineStyle: {
                    color: '#666',
                    opacity: 0.5,
                    width: 1
                },

            },

        },
        yAxis: {
            axisLine: { show: false },
            splitArea:{show:false},
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#5a5a5a'
                }
            },
        },
        series: [{
            type: 'bar',
            data: [],
            barMaxWidth: 20,
            itemStyle: { normal: { color: "#3ba1ff" } },

        }]
    };
    myCharts_device.setOption(option_device);
    var initDeviceFaultCharts = function (date,flag) {
        var data = {
            selectStatus : flag == null ? 0 : flag,
            selectCon : date == null ? getFormatDate() : date
        };
        $.ajax({
            type: "POST",
            url:  "/home/getDeviceFaultCountList",
            data:data,
            cache: false,
            success: function (res) {
                if(res.code=="200") {
                    var list = res.data;
                    var y_data_array = [];
                    var x_data_array = ["01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24"];
                    if(flag == 0){//按天，小时为横坐标
                        y_data_array = paddingData(x_data_array,'',':00',list);
                    }else if(flag == 2){//按月，天数为横坐标
                        x_data_array = ["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31"];
                        y_data_array =   paddingData(x_data_array,'','',list);
                    }else if(flag == 3){//按年，月数为横坐标
                        x_data_array =["1","2","3","4","5","6","7","8","9","10","11","12"];
                        y_data_array = paddingData(x_data_array,'','月',list);
                    }else{//按周，天数为横坐标
                        x_data_array =["一","二","三","四","五","六","日"];
                        y_data_array = paddingData(x_data_array,'星期','',list);
                    }
                    //重新加载统计图形
                    myCharts_device.setOption({
                        xAxis: {
                            data:x_data_array
                        },
                        series: [{
                            type: 'bar',
                            data: y_data_array,
                            barMaxWidth: 20,
                            itemStyle: { normal: { color: "#3ba1ff" } },
                        }]
                    });
                }
            }
        });
    };

    //广告观看次数
    var myCharts_ad = echarts.init(document.getElementById('ad_data'), myEchartsTheme);
    var option_ad = {
        title: {
            text: '广告观看趋势',
            textStyle: {
                color: '#333',
                fontWeight:'bold',
                fontSize: 18
            },

        },
        tooltip: {
            trigger: "axis",
            formatter: "{b}<br>广告观看：{c}",
            backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',

        },
        grid: {
            left: '0',
            right: '0',
            bottom: '0',
            containLabel: true
        },
        xAxis: {
            data: [],
            axisLine: {
                lineStyle: {
                    color: '#5a5a5a'
                }
            },
            axisPointer: {
                snap: true,
                lineStyle: {
                    color: '#666',
                    opacity: 0.5,
                    width: 1
                },

            },

        },
        yAxis: {
            axisLine: { show: false },
            splitArea:{show:false},
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#5a5a5a'
                }
            },
        },
        series: [{
            type: 'bar',
            data: [],
            barMaxWidth: 20,
            itemStyle: { normal: { color: "#3ba1ff" } },

        }]
    };
    myCharts_ad.setOption(option_ad);
    var initAdWatchCharts = function (date,flag) {
        var data = {
            selectStatus : flag == null ? 0 : flag,
            selectCon : date == null ? getFormatDate() : date
        };
        $.ajax({
            type: "POST",
            url:  "/home/getAdWatchCountList",
            data:data,
            cache: false,
            success: function (res) {
                if(res.code=="200") {
                    var list = res.data;
                    var y_data_array = [];
                    var x_data_array = ["01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24"];
                    if(flag == 0){//按天，小时为横坐标
                        y_data_array = paddingData(x_data_array,'',':00',list);
                    }else if(flag == 2){//按月，天数为横坐标
                        x_data_array = ["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31"];
                        y_data_array =   paddingData(x_data_array,'','',list);
                    }else if(flag == 3){//按年，月数为横坐标
                        x_data_array =["1","2","3","4","5","6","7","8","9","10","11","12"];
                        y_data_array = paddingData(x_data_array,'','月',list);
                    }else{//按周，天数为横坐标
                        x_data_array =["一","二","三","四","五","六","日"];
                        y_data_array = paddingData(x_data_array,'星期','',list);
                    }
                    //重新加载统计图形
                    myCharts_ad.setOption({
                        xAxis: {
                            data:x_data_array
                        },
                        series: [{
                            type: 'bar',
                            data: y_data_array,
                            barMaxWidth: 20,
                            itemStyle: { normal: { color: "#3ba1ff" } },
                        }]
                    });
                }
            }
        });
    };

    //设备故障次数省份排名
    var initDeviceProvinceRankFn = function() {
        $.ajax({
            type: "POST",
            url:  "/home/deviceRankForArea",
            cache: false,
            async:false,
            success: function (res) {
                if(res.code=="200") {
                    $("#device_rank_id").html("");
                    var data = res.data;
                    for(var i in data){
                        var num=Number(i)+1;
                        var deviceRankMap=data[i];
                        var trHtml="<tr>" +
                            "<td><span class=\"layui-badge layui-bg-cyan\">"+num+"</span></td>" +
                            "<td>"+deviceRankMap.area+"</td>" +
                            "<td>"+deviceRankMap.deviceCount+"</td>" +
                            "</tr>";
                        $("#device_rank_id").append(trHtml);
                    }
                }
            }
        });
    };

    //广告观看次数省份排名
    var initProvinceRankFn = function() {
        $.ajax({
            type: "POST",
            url:  "/home/adWatchRankForArea",
            cache: false,
            success: function (result) {
                var data=result.data;
                if(result.code=="200"&&data) {
                    $("#ad_rank_id").html("");
                    for(var i in data){
                        var num=Number(i)+1;
                        var adWatchRankMap=data[i];
                        var trHtml="<tr>" +
                            "<td><span class=\"layui-badge layui-bg-cyan\">"+num+"</span></td>" +
                            "<td>"+adWatchRankMap.area+"</td>" +
                            "<td>"+adWatchRankMap.adWatchCount+"</td>" +
                            "</tr>";
                        $("#ad_rank_id").append(trHtml);
                    }
                }
            }
        });
    };

    //设备开门方式
    var myCharts_open = echarts.init(document.getElementById('open_data'), myEchartsTheme);
    var data_open = [{
        value:0,
        name: '人脸识别'
    }, {
        value: 0,
        name: '密码开门'
    }, {
        value: 0,
        name: '刷卡开门'
    }, {
        value: 0,
        name: '远程开门'
    }];
    var option_open = {
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)",
            backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',
        },
        legend: { //设置legend
            x: '52%',
            y: '25%',
            orient: 'vertical',
            data: data_open,
            icon: "circle",   //  这个字段控制形状  类型包括 circle，rect ，roundRect，triangle，diamond，pin，arrow，none
            itemWidth: 10,  // 设置形状宽度
            itemHeight: 10, // 设置形状高度
            formatter: function (name) {
                return name + '{c||} ' + ' {a|' + '0% }   {b|0}';
            },
            textStyle: {
                fontSize: 14,
                color: '#5a5a5a',
                rich: {
                    a: {
                        fontSize: 14,
                        verticalAlign: 'middle',
                        align: 'center',

                    },
                    b: {
                        fontSize: 14,
                        align: 'center',
                        lineHeight: 25
                    },
                    c: {
                        color: '#5a5a5a',
                        align: 'center',
                        padding: [0, 10, 0, 10],
                        lineHeight: 20,

                    }
                }
            }
        },
        calculable: true,
        series: [
            {
                name: '',
                type: 'pie',
                clockWise: true,
                hoverAnimation: false,
                radius: [100, 100],
                center: ['28%', '50%'], //设置饼图位置
                label: {
                    normal: {
                        position: 'center'
                    }
                },
                data: [
                    {
                        tooltip: {
                            show: false
                        },
                        value: 1,
                        label: {
                            normal: {
                                formatter: '总数',
                                textStyle: {
                                    color: '#5a5a5a',
                                    fontSize: 14
                                }
                            }
                        }
                    }, {
                        tooltip: {
                            show: false
                        },
                        label: {
                            normal: {
                                formatter: '\n0',
                                textStyle: {
                                    color: '#5a5a5a',
                                    fontSize: 20
                                }
                            }
                        }
                    }]
            },

            {
                name: '开门方式占比',
                type: 'pie',
                radius: ['50%', '65%'],  //设置饼图大小
                center: ['28%', '50%'], //设置饼图位置
                itemStyle: {
                    normal: {
                        borderWidth: 6,
                        borderColor: '#ffffff',
                        color: function (params) {
                            //自定义颜色
                            var colorList = [
                                '#3aa0ff', '#f2637b', '#fad337', '#4dcb73', '#36cbcb'
                            ];
                            return colorList[params.dataIndex]
                        },
                        label: {
                            show: false
                        },
                        labelLine: {
                            show: false
                        }
                    },
                    emphasis: {
                        label: {
                            show: false,
                            position: 'center',
                            textStyle: {
                                fontSize: '18',
                                fontWeight: 'bold'
                            }
                        }
                    }
                },
                data: data_open
            }
        ],
    };
    myCharts_open.setOption(option_open);
    var initOpenWayFn = function () {
        $.ajax({
            type: "POST",
            url:  "/home/openWay",
            cache: false,
            success: function (result) {
                if(result.code==200&&result.data) {
                    var faceOpenCount=Number(result.data.faceOpenCount);
                    var passWordOpenCount=Number(result.data.passWordOpenCount);
                    var cardOpenCount=Number(result.data.cardOpenCount);
                    var telnetOpenCount=Number(result.data.telnetOpenCount);
                    var total=faceOpenCount+passWordOpenCount+cardOpenCount+telnetOpenCount;
                    data_open=[{
                        value: faceOpenCount,
                        name: '人脸识别'
                    }, {
                        value: passWordOpenCount,
                        name: '密码开门'
                    }, {
                        value: cardOpenCount,
                        name: '刷卡开门'
                    }, {
                        value: telnetOpenCount,
                        name: '远程开门'
                    }];
                    if(total>0){
                        var option_open = {
                            legend: { //设置legend
                                data: data_open,
                                formatter: function (name) {
                                    var total = 0;
                                    var target;
                                    for (var i = 0, l = data_open.length; i < l; i++) {
                                        total += Number(data_open[i].value);
                                        if (data_open[i].name == name) {
                                            target = Number(data_open[i].value);
                                        }
                                    }
                                    if(total>0){
                                        var arr = [
                                            '{a|' + ((target / total) * 100).toFixed(2) + '%}',
                                            '{b|' + name + '  ' + target + '}',
                                        ]
                                        return name + '{c||} ' + ' {a|' + ((target / total) * 100).toFixed(2) + '% }   {b|' + target + '}';
                                    }else{
                                        var arr = [
                                            '{a|' + '0%}',
                                            '{b|' + name + '  ' + target + '}',
                                        ]
                                        return name + '{c||} ' + ' {a|' + '0% }   {b|' + target + '}';
                                    }

                                }
                            },
                            series: [
                                {
                                    data: [{
                                        tooltip: {
                                            show: false
                                        },

                                        value: 1,
                                        label: {
                                            normal: {
                                                formatter: '总数',
                                                textStyle: {
                                                    color: '#5a5a5a',
                                                    fontSize: 14
                                                }
                                            }
                                        }
                                    }, {
                                        tooltip: {
                                            show: false
                                        },
                                        label: {
                                            normal: {
                                                formatter: '\n'+total,
                                                textStyle: {
                                                    color: '#5a5a5a',
                                                    fontSize: 20
                                                }
                                            }
                                        }
                                    }]
                                },
                                {
                                    data: data_open
                                }
                            ],
                        };
                        myCharts_open.setOption(option_open);
                    }
                }
            }
        });
    };

    //广告观看类别
    var myCharts_ad_type = echarts.init(document.getElementById('ad_type_data'), myEchartsTheme);
    var data_ad_type = [{value: "0", name: "其他"}];
    var option_ad_type = {
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)",
            backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',
        },
        legend: { //设置legend
            x: '52%',
            y: '25%',
            orient: 'vertical',
            data: data_ad_type,
            icon: "circle",   //  这个字段控制形状  类型包括 circle，rect ，roundRect，triangle，diamond，pin，arrow，none
            itemWidth: 10,  // 设置形状宽度
            itemHeight: 10, // 设置形状高度
            formatter: function (name) {
                return name + '{c||} ' + ' {a|' + '0% }   {b|0}';
            },
            textStyle: {
                fontSize: 14,
                color: '#5a5a5a',
                rich: {
                    a: {
                        fontSize: 14,
                        verticalAlign: 'middle',
                        align: 'center',

                    },
                    b: {
                        fontSize: 14,
                        align: 'center',
                        lineHeight: 25
                    },
                    c: {
                        color: '#5a5a5a',
                        align: 'center',
                        padding: [0, 10, 0, 10],
                        lineHeight: 20,
                    }
                }
            }
        },
        calculable: true,
        series: [
            {
                name: '',
                type: 'pie',
                clockWise: true,
                hoverAnimation: false,
                radius: [100, 100],
                center: ['28%', '50%'], //设置饼图位置
                label: {
                    normal: {
                        position: 'center'
                    }
                },
                data: [{
                    value: 1,
                    tooltip: {
                        show: false
                    },
                    label: {
                        normal: {
                            formatter: '总数',
                            textStyle: {
                                color: '#5a5a5a',
                                fontSize: 14
                            }
                        }
                    }
                }, {
                    tooltip: {
                        show: false
                    },
                    label: {
                        normal: {
                            formatter: '\n0',
                            textStyle: {
                                color: '#5a5a5a',
                                fontSize: 20
                            }
                        }
                    }
                }]
            },

            {
                name: '广告观看类别占比',
                type: 'pie',
                radius: ['50%', '65%'],  //设置饼图大小
                center: ['28%', '50%'], //设置饼图位置
                itemStyle: {
                    normal: {
                        borderWidth: 6,
                        borderColor: '#ffffff',
                        color: function (params) {
                            //自定义颜色
                            var colorList = [
                                '#3aa0ff', '#f2637b', '#fad337', '#4dcb73', '#36cbcb','#4dcb73'
                            ];
                            return colorList[params.dataIndex]
                        },
                        label: {
                            show: false
                        },
                        labelLine: {
                            show: false
                        }
                    },
                    emphasis: {
                        label: {
                            show: false,
                            position: 'center',
                            textStyle: {
                                fontSize: '18',
                                fontWeight: 'bold'
                            }
                        }
                    }
                },
                data: data_ad_type
            }
        ],
    };
    myCharts_ad_type.setOption(option_ad_type);
    var initAdTypeFn = function(){
        $.ajax({
            type: "POST",
            url:  "/home/adWatchProportionForAdType",
            cache: false,
            success: function (result) {
                var total1=0;
                var data=result.data;
                if(result.code=="200"&&data) {
                    var adWatchCountList=data.adWatchCountList;
                    if(adWatchCountList){
                        for(var i in adWatchCountList){
                            var adWatchRankMap=adWatchCountList[i];
                            data_ad_type[i]={value: adWatchRankMap.adWatchCount, name: adWatchRankMap.adTypeName};
                            total1+=Number(adWatchRankMap.adWatchCount);
                        }
                    }
                    if(total1>0){
                        var option_ad_type = {
                            legend: { //设置legend
                                data: data_ad_type,
                                formatter: function (name) {
                                    var total = 0;
                                    var target;
                                    for (var i = 0, l = data_ad_type.length; i < l; i++) {
                                        total += Number(data_ad_type[i].value);
                                        if (data_ad_type[i].name == name) {
                                            target = Number(data_ad_type[i].value);
                                        }
                                    }
                                    if(total>0){
                                        var arr = [
                                            '{a|' + ((target / total) * 100).toFixed(2) + '%}',
                                            '{b|' + name + '  ' + target + '}',
                                        ]
                                        return name + '{c||} ' + ' {a|' + ((target / total) * 100).toFixed(2) + '% }   {b|' + target + '}';
                                    }else{
                                        var arr = [
                                            '{a|' + '0%}',
                                            '{b|' + name + '  ' + target + '}',
                                        ]
                                        return name + '{c||} ' + ' {a|' + '0% }   {b|' + target + '}';
                                    }
                                }
                            },
                            calculable: true,
                            series: [
                                {
                                    name: '',
                                    type: 'pie',
                                    clockWise: true,
                                    hoverAnimation: false,
                                    radius: [100, 100],
                                    center: ['28%', '50%'], //设置饼图位置
                                    label: {
                                        normal: {
                                            position: 'center'
                                        }
                                    },
                                    data: [{
                                        value: 1,
                                        tooltip: {
                                            show: false
                                        },
                                        label: {
                                            normal: {
                                                formatter: '总数',
                                                textStyle: {
                                                    color: '#5a5a5a',
                                                    fontSize: 14
                                                }
                                            }
                                        }
                                    }, {
                                        tooltip: {
                                            show: false
                                        },
                                        label: {
                                            normal: {
                                                formatter: '\n'+total1,
                                                textStyle: {
                                                    color: '#5a5a5a',
                                                    fontSize: 20
                                                }
                                            }
                                        }
                                    }]
                                },
                                {
                                    data: data_ad_type
                                }
                            ]

                        };
                        myCharts_ad_type.setOption(option_ad_type);
                    }
                }
            }
        });
    };

    //用户活跃
    var myCharts_member = echarts.init(document.getElementById('member_data'), myEchartsTheme);
    var option_member = {
        title: {
            text: '用户活跃',
            textStyle: {
                color: '#333333',
                fontWeight:'bold',
                fontSize: 18
            },
        },
        tooltip: {
            trigger: "axis",
            backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',

        },
        grid: {
            left: '0',
            right: '0',
            bottom: '0',
            containLabel: true
        },
        legend: {
            itemWidth: 15,
            itemHeight: 15,
            data: ['小程序', 'app'],
        },
        axisLabel: {
            backgroundColor: "#fff",
        },
        xAxis: {
            data: [],
            splitLine: {
                show: false,
            },
            axisLine: {
                lineStyle: {
                    color: '#5a5a5a'
                }
            },
            axisPointer: {
                snap: true,
                lineStyle: {
                    color: '#666',
                    opacity: 0.5,
                    width: 1
                },

            },
        },
        yAxis: [
            {
                axisLine: {
                    show: false,//隐藏y轴
                    lineStyle: {
                        color: '#5a5a5a'
                    }
                },
                splitArea:{show:false},//去掉网格

            }
        ],
        series: [{
            name: '小程序',
            type: 'bar',
            stack: '使用情况',
            data: [],
            /* 柱子的显示宽度 */
            barWidth: 10,
            itemStyle: {
                normal: { color: "#3ba1ff" },
            }
        }, {
            name: 'app',
            type: 'bar',
            stack: '使用情况',
            data: [],
            itemStyle: {
                normal: { color: "#52d427" },
            }
        }]
    };
    myCharts_member.setOption(option_member);
    var initMemberActiveFn = function(){
        $.ajax({
            type: "POST",
            url:  "/home/getMemberLoginCountList",
            cache: false,
            success: function (res) {
                if(res.code=="200") {
                    var list = res.data;
                    var y_data_array_small = [];
                    var y_data_array_app = [];
                    var x_data_array = ["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24"];
                    for(var x=0,len = x_data_array.length;x< len;x++){
                        var indexDate = x_data_array[x];
                        indexDate = indexDate < 10 ? "0"+ indexDate :indexDate;
                        if(list != null && list.length != 0){
                            for(var index in list){
                                var map = list[index];
                                if(indexDate == map.indexDate){
                                    y_data_array_small[x] = map.smallCount;
                                    y_data_array_app[x]= map.appCount;
                                    break;
                                }else{
                                    y_data_array_small[x] = 0;
                                    y_data_array_app[x]= 0;
                                }
                            }
                        }else{
                            y_data_array_small[x] = 0;
                            y_data_array_app[x]= 0;
                        }
                        x_data_array[x] =indexDate + ":00";
                    }
                    //重新加载统计图形
                    myCharts_member.setOption({
                        xAxis: {
                            data:x_data_array
                        },
                        series: [{
                            name: '小程序',
                            type: 'bar',
                            stack: '使用情况',
                            data: y_data_array_small,
                            /* 柱子的显示宽度 */
                            barWidth: 10,
                            itemStyle: {
                                normal: { color: "#3ba1ff" },
                            }
                        }, {
                            name: 'app',
                            type: 'bar',
                            stack: '使用情况',
                            data: y_data_array_app,
                            itemStyle: {
                                normal: { color: "#52d427" },
                            }
                        }]
                    });
                }
            }
        });
    };

    //---------------------------------------------------------------------------------------
    //小区统计
    var dom_org = document.getElementById("residential_org_data");
    var dom_est = document.getElementById("residential_est_data");
    var myChart_residential_org,myChart_residential_est;

    var getResidentialDataFn = function(){
        $.ajax({
            type: "POST",
            url:  "/home/getResidentialData",
            cache: false,
            success: function (res) {
                if(res.code=="200") {
                    initResidentialDataFn(res.data);
                }
            }
        });
    };

    function initResidentialDataFn(data){
        //计算条形图的高度
        var orgLength = data.orgData.title.length;
        var estLength = data.estData.title.length;
        var maxLength = orgLength > estLength ? orgLength : estLength;
        var height = maxLength > 5 ? maxLength * 60 : maxLength * 90;
        dom_org.style.height = height + 'px';
        dom_est.style.height = height + 'px';
        //插件初始化
        myChart_residential_org = echarts.init(dom_org);
        myChart_residential_est = echarts.init(dom_est);
        //    机构小区柱形图渲染
        var option_residential_org = {
            title: {
                text: '机构小区统计',
                textStyle: {
                    color: '#333333',
                    fontWeight:'bold',
                    fontSize: 18
                },
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data: ['全部', '当月']
            },
            grid: {
                left: '1%',
                right: '1%',
                bottom: '1%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'value'
                }
            ],
            yAxis: [
                {
                    type: 'category',
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            // 		color: '#FFFFFF',
                            // fontSize: '38',//字体大小
                        },
                        fontSize: 16,//字体大小
                    },
                    data: data.orgData.title
                }
            ],
            series: [
                {
                    name: '全部',
                    type: 'bar',
                    label: {
                        show: true
                    },
                    itemStyle: {
                        normal: { color: "#52d427" },
                    },
                    data: data.orgData.totalCount
                },
                {
                    name: '当月',
                    type: 'bar',
                    label: {
                        show: true,
                        position: 'inside'
                    },
                    itemStyle: {
                        normal: { color: "#3ba1ff" },
                    },
                    data: data.orgData.monthCount
                },
            ]
        };
        if (option_residential_org && typeof option_residential_org === "object") {
            myChart_residential_org.setOption(option_residential_org, true);
        }
        //    物业小区柱形图渲染
        var option_residential_est = {
            title: {
                text: '物业小区统计',
                textStyle: {
                    color: '#333333',
                    fontWeight:'bold',
                    fontSize: 18
                },
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data: ['全部', '当月']
            },
            grid: {
                left: '1%',
                right: '1%',
                bottom: '1%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'value'
                }
            ],
            yAxis: [
                {
                    type: 'category',
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            // 		color: '#FFFFFF',
                            // fontSize: '38',//字体大小
                        },
                        fontSize: 16,//字体大小
                    },
                    data: data.estData.title
                }
            ],
            series: [
                {
                    name: '全部',
                    type: 'bar',
                    label: {
                        show: true
                    },
                    itemStyle: {
                        normal: { color: "#52d427" },
                    },
                    data: data.estData.totalCount
                },
                {
                    name: '当月',
                    type: 'bar',
                    label: {
                        show: true,
                        position: 'inside'
                    },
                    itemStyle: {
                        normal: { color: "#3ba1ff" },
                    },
                    data: data.estData.monthCount
                },
            ]
        };

        if (option_residential_est && typeof option_residential_est === "object") {
            myChart_residential_est.setOption(option_residential_est, true);
        }
    }
    //***************************************************************************************

    //用户占比
    var myCharts_member_per = echarts.init(document.getElementById('member_per_data'), myEchartsTheme);
    var data_member_per= [
        {value: 0, name: '小程序', itemStyle: { normal: { color: "#3ba1ff" } } },
        { value: 0, name: 'APP', itemStyle: { normal: { color: "#52d427" } } },
    ];
    var option_member_per = {
        title: {
            text: '用户占比',
            textStyle: {
                color: '#333333',
                fontWeight:'bold',
                fontSize: 18
            },
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)",
            backgroundColor:'rgba(255,255,255,0.8)',//通过设置rgba调节背景颜色与透明度
            color:'black',
            borderWidth:'1',
            borderColor:'#dadada',
            textStyle:{
                color:'#575757',
                fontSize:'12'
            },
            extraCssText:'line-height:26px;padding:10px;box-shadow:0 0 10px rgba(0,0,0,0.3)',
        },

        series: [
            {
                name: '',
                type: 'pie',
                clockWise: true,
                hoverAnimation: false,
                radius: [100, 100],
                center: ['50%', '40%'],
                label: {
                    normal: {
                        position: 'center'
                    }
                },
                data: [
                    {
                        tooltip: {
                            show: false
                        },
                        value: 1,
                        label: {
                            normal: {
                                formatter: '总数',
                                textStyle: {
                                    color: '#5a5a5a',
                                    fontSize: 14
                                }
                            }
                        }
                    }, {
                        tooltip: {
                            show: false
                        },
                        label: {
                            normal: {
                                formatter: '\n0',
                                textStyle: {
                                    color: '#5a5a5a',
                                    fontSize: 20
                                }
                            }
                        }
                    }]
            },
            {
                name: '用户占比',
                type: 'pie',
                radius: ['50%', '65%'],  //设置饼图大小
                center: ['50%', '40%'],
                label: {
                    normal: {
                        show: false,
                    }
                },
                data: data_member_per
            }

        ],
        legend: {
            x: 'center',
            orient: 'vertical', //垂直
            bottom: 5,
            itemGap: 30,
            itemWidth: 5,
            icon: "circle",   //  这个字段控制形状  类型包括 circle，rect ，roundRect，triangle，diamond，pin，arrow，none
            itemWidth: 10,  // 设置形状宽度
            itemHeight: 10, // 设置形状高度
            textStyle: {
                fontSize: 12
            },
            align: 'left',
            data: data_member_per,
            formatter: function (name) {
                return name + '{c||} ' + ' {a|' + '0% }   {b|0}';
            },
            textStyle: {
                fontSize: 14,
                color: '#5a5a5a',
                rich: {
                    a: {
                        fontSize: 14,
                        verticalAlign: 'middle',
                        align: 'center',

                    },
                    b: {
                        fontSize: 14,
                        align: 'center',

                    },
                    c: {
                        color: '#5a5a5a',
                        align: 'center',
                        padding: [0, 10, 0, 10],
                    }
                }
            }
        },
    };
    myCharts_member_per.setOption(option_member_per);
    var initMemberPercentFn = function(){
        $.ajax({
            type: "POST",
            url:  "/home/getMemberTypeCount",
            cache: false,
            success: function (res) {
                var data = res.data;
                if(res.code=="200"&&data) {
                    var wxAppletCount=data.wxAppletCount;
                    if(!wxAppletCount){
                        wxAppletCount=0;
                    }
                    var appCount=data.appCount;
                    if(!appCount){
                        appCount=0;
                    }
                    var totalCount=appCount+wxAppletCount;
                    data_member_per = [{
                        value: wxAppletCount,
                        name: '小程序',itemStyle: { normal: { color: "#3ba1ff" }}
                    }, {
                        value: appCount,
                        name: 'APP'
                        , itemStyle: { normal: { color: "#52d427" } }
                    }];
                    var option_member_per = {
                        series: [
                            {
                                data: [{
                                    value: 1,
                                    tooltip: {
                                        show: false
                                    },
                                    label: {
                                        normal: {
                                            formatter: '总数',
                                            textStyle: {
                                                color: '#666666',
                                                fontSize: 14
                                            }
                                        }
                                    }
                                }, {
                                    tooltip: {
                                        show: false
                                    },
                                    label: {
                                        normal: {
                                            formatter: '\n'+totalCount,
                                            textStyle: {
                                                color: '#666666',
                                                fontSize: 20
                                            }
                                        }
                                    }
                                }]
                            },
                            {
                                data: data_member_per,
                            }
                        ],
                        legend: {
                            data: data_member_per,
                            formatter: function (name) {
                                var total = 0;
                                var target;
                                for (var i = 0, l = data_member_per.length; i < l; i++) {
                                    total += Number(data_member_per[i].value);
                                    if (data_member_per[i].name == name) {
                                        target = Number(data_member_per[i].value);
                                    }
                                }
                                if(total>0){
                                    var arr = [
                                        '{a|' + ((target / total) * 100).toFixed(2) + '%}',
                                        '{b|' + name + '  ' + target + '}',
                                    ]
                                    return name + '{c||} ' + ' {a|' + ((target / total) * 100).toFixed(2) + '% }   {b|' + target + '}';
                                }else{
                                    var arr = [
                                        '{a|' + '0%}',
                                        '{b|' + name + '  ' + target + '}',
                                    ]
                                    return name + '{c||} ' + ' {a|' + '0% }   {b|' + target + '}';
                                }
                            }
                        },
                    };
                    myCharts_member_per.setOption(option_member_per);
                }
            }
        });
    }


    // 切换选项卡重新渲染
    element.on('tab(tabZZT)', function (data) {
        $('.layui-btn-sm').removeClass("layui-this");
        $('.layui-btn-sm[data-type="0"]').addClass("layui-this");
        if (data.index == 0) {
            myCharts_device.resize();
            initDeviceFaultCharts(getFormatDate(),0);
            initDeviceProvinceRankFn();
        } else {
            myCharts_ad.resize();
            initAdWatchCharts(getFormatDate(),0);
            initProvinceRankFn();
        }
        index = data.index;
    });

    $('.layui-btn-sm').click(function () {
        $('.layui-btn-sm').removeClass("layui-this");
        $(this).addClass("layui-this");
        var dataType = $(this).attr("data-type");
        if(index == 0){
            if(dataType == 0){
                initDeviceFaultCharts(getFormatDate(),0);
            }else if(dataType == 2){
                initDeviceFaultCharts(getFormatDate(2),2);
            }else if(dataType == 3){
                initDeviceFaultCharts(getFormatDate(3),3);
            }else{
                initDeviceFaultCharts(getFormatDate(),1);
            }
        }else{
            if(dataType == 0){
                initAdWatchCharts(getFormatDate(),0);
            }else if(dataType == 2){
                initAdWatchCharts(getFormatDate(2),2);
            }else if(dataType == 3){
                initAdWatchCharts(getFormatDate(3),3);
            }else{
                initAdWatchCharts(getFormatDate(),1);
            }
        }
    });

    // 窗口大小改变事件
    window.addEventListener("resize", function () {
        myCharts_member.resize();
        myCharts_open.resize();
        myCharts_device.resize();
        myCharts_ad.resize();
        myCharts_member_per.resize();
        myCharts_ad_type.resize();
    });

    //字典
    var initDictFn = function() {
        if (window.localStorage.getItem("dictList") == null){
            $.ajax({
                url     :   '/permissions/dict/getDictTreeList',
                success :   function(result){
                    let dictList = result.list[0].subList
                    dictList = JSON.stringify(dictList);
                    window.localStorage.setItem("dictList",dictList);
                }
            });
        }
    };

    //  初始化
    (function () {
        initDictFn();
        //设备覆盖数量
        initDeviceCoverFn();
        //下属账户数量
        initSubordinateFn();
        //小区总数量及本月新增
        initResidentialFn();
        //单元总数量及本月新增
        initUnitFn();
        //住户总数量及本月新增
        initUserFn();
        //待审核住户数量
        initApplyUserFn();
        //广告投放总数量及本月新增
        initAdPushFn();
        //会员数量及本月新增
        initMemberFn();
        //设备故障表格
        initDeviceFaultCharts(getFormatDate(),0);
        //设备故障排名
        initDeviceProvinceRankFn();
        //设备开门方式
        initOpenWayFn();
        //广告观看类别
        initAdTypeFn();
        //用户活跃
        initMemberActiveFn();

        //小区数据
        // getResidentialDataFn();
        //用户占比
        initMemberPercentFn();
    })();

    function getFormatDate(type) {
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        if(type == 2){
            return year +"-"+ month;
        }
        if(type == 3){
            return year;
        }
        return year +"-"+ month +"-"+ strDate;
    };

    function paddingData(array,pre,suf,list) {
        var y_data_array = new Array();
        for(var x=0,len = array.length;x< len;x++){
            var indexDate = array[x];
            if(list != null && list.length != 0){
                for(var index in list){
                    var map = list[index];
                    if(Number(x+1) == Number(map.indexDate)){
                        y_data_array[x] = map.indexCount;
                        break;
                    }else{
                        y_data_array[x] = 0;
                    }
                }
            }else{
                y_data_array[x] = 0;
            }
            array[x] =pre + indexDate + suf;
        }
        return y_data_array;
    };


});
