/**
 * Created by sff on 2018/1/3.
 */
$(function(){
    //设置尺寸
    function setRem (){ // 绑定到窗口的这个事件中
        var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值
        var wH = window.innerHeight;// 当前窗口的高度
        var wW = window.innerWidth<=1920?1920:window.innerWidth;// 当前窗口的宽度
        var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
        $('html').css('font-size', rem + "px");
    }
    setRem ();
    $(window).resize(function(){
        setRem ();
        window.location.reload();
    });
    // 右上角时间显示
    $("#Timer").text(new Date().toLocaleString());
    setInterval(function(){
        $("#Timer").text(new Date().toLocaleString());
    },1000);

    var Arrdata = new Array();

    Arrdata[1] = '爱婴中心';
    Arrdata[2] = '门店中心';
    Arrdata[3] = '研发中心';
    Arrdata[4] = '客服中心';
    Arrdata[5] = '网销中心';
    Arrdata[6] = '微电影';
    Arrdata[7] = '服务督察组';
    Arrdata[8] = '人事部';
    Arrdata[9] = '莉帝希雅';
    Arrdata[10] = '市场部';
    Arrdata[11] = '回客组';

    var htmlIdArr = new Array();
    htmlIdArr[1] = 'aiyingzhongxin';
    htmlIdArr[2] = 'mendianzhongxin';
    htmlIdArr[3] = 'yanfazhongxin';
    htmlIdArr[4] = 'kefuzhongxin';
    htmlIdArr[5] = 'wangxiaozhongxin';
    htmlIdArr[6] = 'weidianying';
    htmlIdArr[7] = 'fuwuduchazu';
    htmlIdArr[8] = 'renshibu';
    htmlIdArr[9] = 'lidixiya';
    htmlIdArr[10] = 'shichangbu';
    htmlIdArr[11] = 'huikezu';

    var day = $('#e1dateStar').val();

    // layui方法 时间
    layui.use(['form', 'layedit', 'laydate', 'table'], function(){
        var form = layui.form,laydate = layui.laydate
        var start = $('#loop1dateStar').val();
        // 月营收与满意度  时间
        laydate.render({
            elem: '#loop1dateStar'
            ,min: start
            ,max: 0
            ,showBottom: false
            ,done: function(value, date){
                // layer.alert('你选择的日期是：' + value + '<br>获得的对象是' + JSON.stringify(date));
                var loopStar= value;
                var loopEnd = $('#loop1dateEnd').val();
                getMonthYingshou(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop1dateEnd'
            ,showBottom: false
            ,min: start
            ,max: 0
            ,done: function(value, date){
                // layer.alert('你选择的日期是：' + value + '<br>获得的对象是' + JSON.stringify(date));
                var loopStar= $('#loop1dateStar').val();
                var loopEnd = value;
                getMonthYingshou(loopStar,loopEnd);
            }
        });
        // 订单来源分析  时间
        laydate.render({
            elem: '#loop5dateStar'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= value;
                var loopEnd = $('#loop5dateEnd').val();
                analyseOrderFrom(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop5dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= $('#loop5dateStar').val();
                var loopEnd = value;
                analyseOrderFrom(loopStar,loopEnd);
            }
        });
        // 价格区间分析  时间
        laydate.render({
            elem: '#loop6dateStar'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= value;
                var loopEnd = $('#loop6dateEnd').val();
                analysePriceArea(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop6dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= $('#loop6dateStar').val();
                var loopEnd = value;
                analysePriceArea(loopStar,loopEnd);
            }
        });
        // 实时订单  时间  这个 貌似不用
        laydate.render({
            elem: '#loop7dateStar'
            ,showBottom: false
        });
        laydate.render({
            elem: '#loop7dateEnd'
            ,showBottom: false
        });
        // 门市业绩TOP5  时间
        laydate.render({
            elem: '#loop8dateStar'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= value;
                var loopEnd = $('#loop8dateEnd').val();
                menshiYeji(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop8dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= $('#loop8dateStar').val();
                var loopEnd = value;
                menshiYeji(loopStar,loopEnd);
            }
        });
        // 月营收与成本
        laydate.render({
            elem: '#loop3dateStar'
            ,showBottom: false
            ,min: start
            ,max: 0
            ,done: function(value, date){
                var loopStar= value;
                var loopEnd = $('#loop3dateEnd').val();
                monthYingshouCost(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop3dateEnd'
            ,showBottom: false
            ,min: start
            ,max: 0
            ,done: function(value, date){
                var loopStar= $('#loop3dateStar').val();
                var loopEnd = value;
                monthYingshouCost(loopStar,loopEnd);
            }
        });
        // 实收业绩与达成率
        laydate.render({
            elem: '#loop2dateStar'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= value;
                var loopEnd = $('#loop3dateEnd').val();
                shishouYejiRate(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#loop2dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                var loopStar= $('#loop3dateStar').val();
                var loopEnd = value;
                shishouYejiRate(loopStar,loopEnd);
            }
        });
        // 网销数据大盘  时间
        laydate.render({
            elem: '#e2dateStar'
            ,min: start
            ,max: 0
            ,showBottom: false
            ,done: function(value, date){
                // layer.alert('你选择的日期是：' + value + '<br>获得的对象是' + JSON.stringify(date));
                var loopStar= value;
                var loopEnd = $('#e2dateEnd').val();
                // 各组月转化率
                getGroupMonthConversion(loopStar,loopEnd);
                //网销业绩月排名
                getPerformanceMonthRanking(loopStar,loopEnd);
                // 各组实收业绩/转化率/达成率
                getGroupRanking(loopStar,loopEnd);
                // 当月客资渠道分布
                getMonthChannelDistribution(loopStar,loopEnd);
            }
        });
        laydate.render({
            elem: '#e2dateEnd'
            ,showBottom: false
            ,min: start
            ,max: 0
            ,done: function(value, date){
                // layer.alert('你选择的日期是：' + value + '<br>获得的对象是' + JSON.stringify(date));
                var loopStar= $('#e2dateStar').val();
                var loopEnd = value;
                // 各组月转化率
                getGroupMonthConversion(loopStar,loopEnd);
                //网销业绩月排名
                getPerformanceMonthRanking(loopStar,loopEnd);
                // 各组实收业绩/转化率/达成率
                getGroupRanking(loopStar,loopEnd);
                // 当月客资渠道分布
                getMonthChannelDistribution(loopStar,loopEnd);
            }
        });
        //日选择器
        laydate.render({
            elem: '#e1dateStar'
            ,type: 'date'
            ,done: function(value, date, endDate){
                day = value;
                for (var i = 1; i < Arrdata.length; i++) {
                    function_name20(Arrdata[i],day,htmlIdArr[i]);
                }
            }
        });


        //oa日期选择器

        //考勤  开始时间
        laydate.render({
            elem: '#e11dateStar'
            ,showBottom: false
            ,done: function(value, date){
                getClockLog();
            }
        });

        //考勤  结束时间
        laydate.render({
            elem: '#e11dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                getClockLog();
            }
        });

        //员工动态  开始时间
        laydate.render({
            elem: '#e12dateStar'
            ,showBottom: false
            ,done: function(value, date){
                getStaffDynamic();
            }
        });

        //员工动态  结束时间
        laydate.render({
            elem: '#e12dateEnd'
            ,showBottom: false
            ,done: function(value, date){
                getStaffDynamic();
            }
        });

    });
    var galleryThumbs = new Swiper('.gallery-thumbs', {
        spaceBetween: 0,
        slidesPerView: 4,
        loop: false,
        freeMode: true,
        loopedSlides: 4, //looped slides should be the same
        watchSlidesVisibility: true,
        watchSlidesProgress: true,
        preventClicksPropagation : false,
        on: {
            init: function(){
                getMonthYingshou();
                analyseOrderFrom();
                analysePriceArea();
                todayShishou();
                monthShishou();
                dayReachRate();
                yearReachRate();
                realTimeOrder();
                menshiYeji();
                monthYingshouCost();
                shishouYejiRate();
                setInterval(function(){
                    getMonthYingshou();
                    analyseOrderFrom();
                    analysePriceArea();
                    todayShishou();
                    monthShishou();
                    dayReachRate();
                    yearReachRate();
                    menshiYeji();
                    monthYingshouCost();
                    shishouYejiRate();
                },60000);
                setInterval(function(){
                    realTimeOrder();
                },5000);
            },
            //获取点击内容的索引
            click: function(){
                this.active = this.realIndex;
                // alert(galleryTop.activeIndex)
                var tab = $('.swiper-slide-thumb-active').html();
                if (tab=='日销售大盘') {
                    getMonthYingshou();
                    analyseOrderFrom();
                    analysePriceArea();
                    todayShishou();
                    monthShishou();
                    dayReachRate();
                    yearReachRate();
                    realTimeOrder();
                    menshiYeji();
                    monthYingshouCost();
                    shishouYejiRate();
                    setInterval(function(){
                        getMonthYingshou();
                        analyseOrderFrom();
                        analysePriceArea();
                        todayShishou();
                        monthShishou();
                        dayReachRate();
                        yearReachRate();
                        menshiYeji();
                        monthYingshouCost();
                        shishouYejiRate();
                    },60000);
                    setInterval(function(){
                        realTimeOrder();
                    },5000);
                }else if (tab=='运转数据大盘') {
                    

                    
                    for (var i = 1; i < Arrdata.length; i++) {
                        function_name20(Arrdata[i],day,htmlIdArr[i]);
                    }
                    /*function_name20();
                    function_name21();
                    function_name22();
                    function_name23();
                    function_name24();
                    function_name25();
                    function_name26();
                    function_name27();
                    function_name28();
                    function_name29();
                    function_name299();*/
                    // setInterval(function(){
                    //     function_name20();
                    //     function_name21();
                    //     function_name22();
                    //     function_name23();
                    //     function_name24();
                    //     function_name25();
                    //     function_name26();
                    //     function_name27();
                    //     function_name28();
                    //     function_name29();
                    //     function_name299();
                    // },60000);
                }else if (tab=='网销数据大盘') {
                    getRealtimeData();
                    getGroupDayConversion();
                    getGroupMonthConversion();
                    getPerformanceDayRanking();
                    getPerformanceMonthRanking();
                    getGroupRanking();
                    getMonthChannelDistribution();
                    setInterval(function(){
                        getRealtimeData();
                        getGroupDayConversion();
                        getGroupMonthConversion();
                        getPerformanceDayRanking();
                        getPerformanceMonthRanking();
                        getGroupRanking();
                        getMonthChannelDistribution();
                    },60000);
                }else if (tab=='办公数据大盘') {

                    //考勤
                    getClockLog();
                    //员工动态
                    getStaffDynamic();
                    //工作提醒
                    getWorkTip();

                    //男女比例
                    getOaSex();
                    //年龄分布
                    getOaAge();
                    //司龄比例
                    getOaSiLing();
                    //管理结构
                    getOaManagementStructure();
                    // 学历分布
                    getOaEducationBackground();
                    //编制人数
                    getOaPosition();

                }else{
                    getMonthYingshou();
                    analyseOrderFrom();
                    analysePriceArea();
                    todayShishou();
                    monthShishou();
                    dayReachRate();
                    yearReachRate();
                    realTimeOrder();
                    menshiYeji();
                    monthYingshouCost();
                    shishouYejiRate();
                    setInterval(function(){
                        getMonthYingshou();
                        analyseOrderFrom();
                        analysePriceArea();
                        todayShishou();
                        monthShishou();
                        dayReachRate();
                        yearReachRate();
                        menshiYeji();
                        monthYingshouCost();
                        shishouYejiRate();
                    },60000);
                    setInterval(function(){
                        realTimeOrder();
                    },5000);
                }
            },
        },
    });
    var galleryTop = new Swiper('.gallery-top', {
        spaceBetween: 10,
        loop: false,
        // direction: 'vertical',
        // effect : 'fade',
        speed: 1000,
        loopedSlides: 7, //looped slides should be the same
        thumbs: {
            swiper: galleryThumbs,
        },
    });

    /*---------------------------------------- 第一部分 日销售大盘 开始 ----------------------------------------*/
        // 月营收与满意度
        function getMonthYingshou (start,end) {
            if (!start) {
                var start= $('#loop6dateStar').val();
            };
            if (!end) {
                var end= $('#loop6dateEnd').val();
            };
            
            var myChart = echarts.init(document.getElementById('loop1'));
            myChart.clear();
            myChart.setOption({
                tooltip: {
                    trigger: 'axis',
                    // axisPointer: {
                    //     type: 'cross',
                    //     crossStyle: {
                    //         color: '#ffffff'
                    //     }
                    // }
                },
                grid: {
                    left: '5%',
                    right: '5%',
                    top: '5%',
                    bottom: '5%',
                    containLabel: true
                },
                color: ['#85e6ff','#fff100','#fcdd7f'],
                toolbox: {
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['line', 'bar']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    },
                    show: false
                },
                legend: {
                    data: [ '月营收', '满意度'],
                    show: false
                },
                xAxis: [
                    {
                        type: 'category',
                        // data: ['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'],
                        axisPointer: {
                            type: 'shadow'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '月营收',
                        min: 0,
                        // max: 25,
                        // interval: 5,
                        axisLabel: {
                            formatter: '{value} W'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    },
                    {
                        type: 'value',
                        name: '满意度',
                        min: 0,
                        max: 100,
                        interval: 20,
                        axisLabel: {
                            formatter: '{value} %'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                series: [
                    {
                        name: '月营收',
                        type: 'bar',
                        // data: [2.6, 5.9, 9.0, 21.4, 23.7, 20.7, 17.6, 12.2, 8.7, 18.8, 6.0, 2.6, 5.9, 9.0, 21.4, 23.7,2.6, 5.9, 9.0, 21.4, 23.7, 20.7, 17.6, 12.2, 8.7, 18.8, 20.7, 17.6, 12.2, 8.7, 18.8,]
                    },
                    {
                        name: '满意度',
                        type: 'line',
                        yAxisIndex: 1,
                        // data: [40.0, 82.2, 73.3, 64.5, 40.0, 82.2, 73.3, 64.5, 86.3, 90.2, 90.3, 93.4, 73.0, 96.5, 86.3, 90.2, 90.3, 93.4, 40.0, 82.2, 73.3, 64.5, 86.3, 90.2, 90.3, 93.4, 73.0, 96.5, 73.0, 96.5, 92.0, 96.2]
                    }
                ]
            })
            var arr=[];
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/getMonthYingshou',
                success: function(res){
                    myChart.setOption({
                        xAxis:[{
                            data:res.timezone
                        }],
                        series: [
                            {data:res.data.ys}
                            ,{data:res.data.myd}
                        ]
                    });
                }
            })
        }
        // 订单来源分析
        function analyseOrderFrom (start,end) {
            if (!start) {
                var start= $('#loop6dateStar').val();
            };
            if (!end) {
                var end= $('#loop6dateEnd').val();
            };

            var myChart = echarts.init(document.getElementById("loop5"));
            myChart.clear();
            myChart.setOption({
                color: ['#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#8378ea'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 300,
                    fontSize: 12
                },
                legend: {
                    orient: 'vertical',
                    right: '20',
                    top: '30',
                    // data: ['网销：27.6%', '体验：14.1%', '回客：17.4%', '转介绍：17.2%', '套系：10.3%', '爱婴：6.9%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 12,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '订单来源分析',
                        type: 'pie',
                        radius: [15, 75],
                        center: ['35%', '48%'],
                        roseType: 'area',
                        data: [
                            // {value: 27.6, name: '网销：27.6%'},
                            // {value: 24.1, name: '体验：14.1%'},
                            // {value: 17.4, name: '回客：17.4%'},
                            // {value: 17.2, name: '转介绍：17.2%'},
                            // {value: 10.3, name: '套系：10.3%'},
                            // {value: 6.9, name: '爱婴：6.9%'}
                        ]
                    }
                ]
            })
            $.ajax({
               type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/analyseOrderFrom',
                success: function(res){
                    myChart.setOption({
                        // legend: {
                        //     data: res.data.name
                        // },
                        series: [
                            {data:res.data.data}
                        ]
                    });
                } 
            })
        }
        // 价格区间分析
        function analysePriceArea (start,end) {
            if (!start) {
                var start= $('#loop6dateStar').val();
            };
            if (!end) {
                var end= $('#loop6dateEnd').val();
            };

            var myChart = echarts.init(document.getElementById("loop6"));
            myChart.clear();
            myChart.setOption({
                color: ['#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#8378ea'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 12
                },
                legend: {
                    orient: 'vertical',
                    right: '20',
                    top: '30',
                    // data: ['1w以下：27.6%', '1W-2W：14.1%', '2W-4W：17.4%', '4W-6W：17.2%', '6W-8W：10.3%', '8W-10W：6.9%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 12,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '价格区间分析',
                        type: 'pie',
                        radius: [20, 70],
                        center: ['35%', '48%'],
                        roseType: 'area',
                        data: [
                            // {value: 27.6, name:'1w以下：27.6%'},
                            // {value: 24.1, name:'1W-2W：14.1%'},
                            // {value: 17.4, name:'2W-4W：17.4%'},
                            // {value: 17.2, name:'4W-6W：17.2%'},
                            // {value: 10.3, name:'6W-8W：10.3%'},
                            // {value:  6.9, name:'8W-10W：6.9%'}
                        ]
                    }
                ]
            });
            $.ajax({
               type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/analysePriceArea',
                success: function(res){
                    myChart.setOption({
                        // legend: {
                        //     data: res.name
                        // },
                        series: [{
                            data:res.datas
                        }]
                    });
                } 
            })
        }
        // 当日实收 当日预约排控率
        function todayShishou(start,end){
            // 当日实收环比
            $.ajax({
               type: 'POST',
                data: {},
                url : '/crm/bg/todayShishou',
                success: function(res){
                    $("#dr_ss_hb_tu").attr("src",res.data.hbs);
                    $("#dr_ss_hb").html(res.data.hb);
                    $("#dr_ss").html(res.data.shishou);
                    $("#dr_yy_pkl").html(res.data.pkl);

                    // 当日预约排控率
                    var myChart = echarts.init(document.getElementById("loop4a"));
                    myChart.clear();
                    myChart.setOption({
                        title: {
                            text: '当日预约排控率1',
                            subtext: '当日预约排控率',
                            left: 'center',
                            show: false
                        },
                        textStyle:{
                            color:'#fff',
                            fontSize: 18
                        },
                        color: ['#285d8d','#62c9e4'],
                        tooltip: {
                            trigger: 'item',
                            formatter: '{a} <br/>{b}({d}%)'
                            // formatter: '{a} <br/>{b} : {c} ({d}%)'
                        },
                        legend: {
                            orient: 'vertical',
                            left: 'left',
                            data: ['', ''],
                            show: false
                        },
                        series: [
                            {
                                name: '当日预约排控率',
                                type: 'pie',
                                radius: '55%',
                                center: ['50%', '50%'],
                                data: [
                                    {value: res.data.paikongw, name: res.data.paikongw},
                                    {value: res.data.paikongy, name: res.data.paikongy},
                                ],
                                label: {
					                position: 'inner',
					                textStyle : {
					                    fontWeight : 300,
					                    fontSize : 12
					                },
					            },
                                emphasis: {
                                    itemStyle: {
                                        shadowBlur: 10,
                                        shadowOffsetX: 0,
                                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                                    }
                                }
                            }
                        ]
                    })
                    // myChart.setOption(option, true);
                } 
            })
        }
        // 当月实收 当日选片排控率
        function monthShishou(start,end){
            // 当日预约排控率
            var myChart = echarts.init(document.getElementById("loop4b"));
            myChart.clear();
            myChart.setOption({
                title: {
                    text: '当日选片排控率',
                    subtext: '当日选片排控率',
                    left: 'center',
                    show: false
                },
                textStyle:{
                    color:'#fff',
                    fontSize: 18
                },
                color: ['#285d8d','#62c9e4'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} ({d}%)'
                    // formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: ['', ''],
                    show: false
                },
                series: [
                    {
                        name: '当日选片排控率',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '50%'],
                        data: [
                            // {value: res.data.paikongy, name: res.data.paikongz},
                            // {value: res.data.paikongw, name: res.data.paikongz}
                        ],
                        label: {
			                position: 'inner',
			                textStyle : {
			                    fontWeight : 300,
			                    fontSize : 12
			                },
			            },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            })

            $.ajax({
               type: 'POST',
                data: {},
                url : '/crm/bg/monthShishou',
                success: function(res){
                    console.log(res);
                    $("#dy_ss_hb_tu").attr("src",res.data.hbs);
                    $("#dy_ss_hb").html(res.data.hb);
                    $("#dy_ss").html(res.data.shishou);
                    $("#dy_yy_pkl").html(res.data.pkl);

                    myChart.setOption({
                        series: [{
                            data: [
                                {value: res.data.paikongw, name: res.data.paikongw},
                                {value: res.data.paikongy, name: res.data.paikongy},
                            ], 
                        }]
                    });
                }
            })
        }
        // 当前达成率
        function dayReachRate(start,end){
            // 当前达成率
            var myChart = echarts.init(document.getElementById("loop4c"));
            myChart.clear();
            myChart.setOption({
                title: {
                    text: '本月目标',
                    subtext: '本月目标',
                    left: 'center',
                    show: false
                },
                textStyle:{
                    color:'#fff',
                    fontSize: 18
                },
                color: ['#285d8d','#62c9e4'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} ({d}%)'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: ['', ''],
                    show: false
                },
                series: [
                    {
                        name: '本月目标',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '50%'],
                        data: [
                            // {value: 200000, name: '200000'},
                            // {value: 3100000, name: '3100000'}
                        ],
                        label: {
			                position: 'inner',
			                textStyle : {
			                    fontWeight : 300,
			                    fontSize : 12
			                },
			            },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            })
            // 当前达成率
            $.ajax({
               type: 'POST',
                data: {},
                url : '/crm/bg/dayReachRate',
                success: function(res){
                    $("#dcl_y").html(res.data.dcl);
                    $("#mb_y").html(res.data.mubiao);
                    myChart.setOption({
                        series: [{
                            data: [
                                {value: res.data.wdc, name: res.data.wdc},
                                {value: res.data.dc, name: res.data.dc},
                            ]
                        }]
                    });
                }
            })
        }
        // 年度达成率
        function yearReachRate(start,end){
            var myChart = echarts.init(document.getElementById("loop4d"));
            myChart.clear();
            myChart.setOption({
                title: {
                    text: '年度目标',
                    subtext: '年度目标',
                    left: 'center',
                    show: false
                },
                textStyle:{
                    color:'#fff',
                    fontSize: 18
                },
                color: ['#285d8d','#62c9e4'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} ({d}%)'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: ['', ''],
                    show: false
                },
                series: [
                    {
                        name: '年度目标',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '50%'],
                        data: [
                            // {value: 400000, name: '400000'},
                            // {value: 3100000, name: '3100000'}
                        ],
                        label: {
			                position: 'inner',
			                textStyle : {
			                    fontWeight : 300,
			                    fontSize : 12
			                },
			            },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            })
            // 年度达成率
            $.ajax({
               type: 'POST',
                data: {},
                url : '/crm/bg/yearReachRate',
                success: function(res){
                    $("#dcl_n").html(res.data.dcl);
                    $("#mb_n").html(res.data.mubiao);
                    myChart.setOption({
                        series: [{
                            data: [
                                {value: res.data.wdc, name: res.data.wdc},
                                {value: res.data.dc, name: res.data.dc}
                            ]
                        }]
                    });
                }
            })
        }
        // 实时订单 （每隔5秒刷新一下）
        function realTimeOrder(){
            $.ajax({
                type: 'POST',
                data: {},
                url : '/crm/bg/realTimeOrder',
                success: function(res){
                    for (var i = 0; i < res.data.length; i++) {
                        $('.l7_con').eq(i).children().eq(1).html(res.data[i].shop_name);
                        $('.l7_con').eq(i).children().eq(2).html(res.data[i].orderId);
                        $('.l7_con').eq(i).children().eq(3).html(res.data[i].package_name);
                        $('.l7_con').eq(i).children().eq(4).html("￥"+res.data[i].total_money);
                    };
                }
            })
        }
        // 门市业绩Top5
        function menshiYeji(start,end){
            if (!start) {
                var start= $('#loop8dateStar').val();
            };
            if (!end) {
                var end= $('#loop8dateEnd').val();
            };

            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/menshiYeji',
                success: function(res){
                    for (var i = 0; i < res.data.length; i++) {
                        $('.l8_con').eq(i).children().eq(1).html(res.data[i].storeconsuitant1);
                        $('.l8_con').eq(i).children().eq(2).html(res.data[i].shop_name);
                        $('.l8_con').eq(i).children().eq(3).html(res.data[i].gxd);
                        $('.l8_con').eq(i).children().eq(4).html("￥"+res.data[i].pay);
                    };
                }
            })
        }
        // 月营收与成本
        function monthYingshouCost(start,end){
            if (!start) {
                var start= $('#e2dateStar').val();
            };
            if (!end) {
                var end= $('#e2dateEnd').val();
            };

            var myChart = echarts.init(document.getElementById('loop3'));
            myChart.clear();
            myChart.setOption({
                tooltip: {
                    trigger: 'axis',
                    // axisPointer: {
                    //     type: 'cross',
                    //     crossStyle: {
                    //         color: '#ffffff'
                    //     }
                    // }
                },
                grid: {
                    left: '5%',
                    right: '5%',
                    top: '5%',
                    bottom: '5%',
                    containLabel: true
                },
                color: ['#85e6ff','#fff100','#fcdd7f'],
                toolbox: {
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['bar', 'bar']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    },
                    show: false
                },
                legend: {
                    data: [ '月营收', '成本'],
                    show: false
                },
                xAxis: [
                    {
                        type: 'category',
                        // data: ['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'],
                        axisPointer: {
                            type: 'shadow'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '月营收',
                        min: 0,
                        // max: 25,
                        // interval: 5,
                        axisLabel: {
                            formatter: '{value} W'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    },
                    {
                        type: 'value',
                        name: '成本',
                        // min: 0,
                        // max: 100,
                        // interval: 20,
                        axisLabel: {
                            formatter: '{value} W'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                series: [
                    {
                        name: '月营收',
                        type: 'bar',
                        // data: [2.6, 5.9, 9.0, 21.4, 23.7, 20.7, 17.6, 12.2, 8.7, 18.8, 6.0, 2.6, 5.9, 9.0, 21.4, 23.7,2.6, 5.9, 9.0, 21.4, 23.7, 20.7, 17.6, 12.2, 8.7, 18.8, 20.7, 17.6, 12.2, 8.7, 18.8,]
                    },
                    {
                        name: '成本',
                        type: 'line',
                        yAxisIndex: 1,
                        // data: [40.0, 82.2, 73.3, 64.5, 40.0, 82.2, 73.3, 64.5, 86.3, 90.2, 90.3, 93.4, 73.0, 96.5, 86.3, 90.2, 90.3, 93.4, 40.0, 82.2, 73.3, 64.5, 86.3, 90.2, 90.3, 93.4, 73.0, 96.5, 73.0, 96.5, 92.0, 96.2]
                    }
                ]
            });
            var arr=[];
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/monthYingshouCost',
                success: function(res){
                    myChart.setOption({
                        xAxis:[{
                            data:res.timezone
                        }],
                        series: [
                            {data:res.data.ys}
                            ,{data:res.data.cb}
                        ]
                    });
                }
            })
        }
        // 实收业绩与达成率
        function shishouYejiRate(start,end){
            if (!start) {
                var start= $('#loop2dateStar').val();
            };
            if (!end) {
                var end= $('#loop2dateEnd').val();
            };

            var myChart = echarts.init(document.getElementById('loop2'));
            myChart.clear();
            myChart.setOption({
                tooltip: {
                    trigger: 'axis',
                    // axisPointer: {
                    //     type: 'cross',
                    //     crossStyle: {
                    //         color: '#ffffff'
                    //     }
                    // }
                },
                grid: {
                    left: '5%',
                    right: '5%',
                    top: '5%',
                    bottom: '5%',
                    containLabel: true
                },
                color: ['#fcdd7f','#00ffd6','#fcdd7f'],
                toolbox: {
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['line', 'bar']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    },
                    show: false
                },
                legend: {
                    data: [ '实收业绩', '达成率'],
                    show: false
                },
                xAxis: [
                    {
                        type: 'category',
                        // data: ['网销', '爱婴', '门店', '市场', '旅拍', '微电影'],
                        axisPointer: {
                            type: 'shadow'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '实收业绩',
                        min: 0,
                        max: 25,
                        interval: 5,
                        axisLabel: {
                            formatter: '{value} W'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    },
                    {
                        type: 'value',
                        name: '达成率',
                        min: 0,
                        max: 100,
                        interval: 20,
                        axisLabel: {
                            formatter: '{value} %'
                        },
                        axisLine:{
                            lineStyle:{
                                color:'#fff',
                                width:1
                            }
                        }
                    }
                ],
                series: [
                    {
                        name: '实收业绩',
                        type: 'bar',
                        // data: [2.6, 5.9, 9.0, 21.4, 23.7, 20.7]
                    },
                    {
                        name: '达成率',
                        type: 'bar',
                        yAxisIndex: 1,
                        // data: [40.0, 82.2, 73.3, 64.5, 40.0, 82.2]
                    }
                ]
            })
            var arr=[];
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/shishouYejiRate',
                success: function(res){
                    myChart.setOption({
                        xAxis:[{
                            data:res.data.name
                        }],
                        series: [
                            {data:res.data.yj}
                            ,{data:res.data.dcl}
                        ]
                    });
                }
            })
        }
    /*---------------------------------------- 第一部分 日销售大盘 结束 ----------------------------------------*/

    /*---------------------------------------- 第二部分 运转数据大盘 开始 ----------------------------------------*/

        
        function function_name20 (shop_name,day,htmlId) {  
            $.ajax({
                url:'/crm/bg/getYunzhuanData'
                ,type:'post'
                ,data:{shop_name:shop_name,day:day}
                ,success:function(res){
                    setYunHtml(shop_name,res.data,htmlId);
                }
            })
        }
        function setYunHtml(shop_name,data,htmlId){
            var str = "";
            
            if(shop_name == '爱婴中心' || shop_name == '门店中心' || shop_name == '网销中心' || shop_name == '微电影' || shop_name == '莉帝希雅' || shop_name == '市场部'){
                str+='<ul class="e1_tit"><li>关键指标</li><li>标准值</li><li>今日值</li><li>达成率</li><li>月汇总</li><li>月达成率</li><li>环比</li></ul>';
                for (var i = 0; i < data.length; i++) {
                    str+='<ul class="e1_con">';
                    str+='<li>'+data[i].target+'</li>';
                    data[i].biaozhun?str+='<li>'+data[i].biaozhun+'</li>':str+='<li></li>';
                    data[i].jinri?str+='<li class="'+data[i].jinri_class+'">'+data[i].jinri+'</li>':str+='<li></li>';
                    data[i].dachenglv?str+='<li class="'+data[i].dachenglv_class+'">'+data[i].dachenglv+'%</li>':str+='<li></li>';
                    data[i].yuehui?str+='<li class="'+data[i].yuehui_class+'">'+data[i].yuehui+'</li>':str+='<li></li>';
                    data[i].yuedachenglv?str+='<li class="'+data[i].yuedachenglv_class+'">'+data[i].yuedachenglv+'%</li>':str+='<li></li>';
                    data[i].huanbi?str+='<li class="'+data[i].huanbi_class+'">'+data[i].huanbi+'</li>':str+='<li></li>';
                    str+='</ul>';
                }
            }
            if(shop_name == '服务督察组' || shop_name == '回客组'){
                str+=' <ul class="e1_tit"><li>关键指标</li><li>标准值</li><li>今日值</li><li>月汇总</li><li>环比</li></ul>';
                for (var i = 0; i < data.length; i++) {
                    str+='<ul class="e1_con">';
                    str+='<li>'+data[i].target+'</li>';
                    data[i].biaozhun?str+='<li>'+data[i].biaozhun+'</li>':str+='<li></li>';
                    data[i].jinri?str+='<li class="'+data[i].jinri_class+'">'+data[i].jinri+'</li>':str+='<li></li>';
                    data[i].yuehui?str+='<li class="'+data[i].yuehui_class+'">'+data[i].yuehui+'</li>':str+='<li></li>';
                    data[i].huanbi?str+='<li class="'+data[i].huanbi_class+'">'+data[i].huanbi+'</li>':str+='<li></li>';
                    str+='</ul>';
                }
            }
            if(shop_name == '研发中心'){
                str+='<ul class="e1_tit"><li>关键指标</li><li>标准值</li><li>今日值</li><li>月汇总</li><li>月达成率</li><li>环比</li><li>&nbsp;</li><li>关键指标</li><li>今日值</li></ul>';
                for (var i = 0; i < data.length; i++) {
                    str+='<ul class="e1_con">';
                    str+='<li>'+data[i].target+'</li>';
                    data[i].biaozhun?str+='<li>'+data[i].biaozhun+'</li>':str+='<li></li>';
                    data[i].jinri?str+='<li class="'+data[i].jinri_class+'">'+data[i].jinri+'</li>':str+='<li></li>';
                    data[i].yuehui?str+='<li class="'+data[i].yuehui_class+'">'+data[i].yuehui+'</li>':str+='<li></li>';
                    data[i].yuedachenglv?str+='<li class="'+data[i].yuedachenglv_class+'">'+data[i].yuedachenglv+'</li>':str+='<li></li>';
                    data[i].huanbi?str+='<li class="'+data[i].huanbi_class+'">'+data[i].huanbi+'</li>':str+='<li></li>';
                    if(data[i].target == '服务建议率'){
                        str+='<li>调</li>';    
                    }else if(data[i].target == '化妆建议率'){
                        str+='<li>度</li>';
                    }else if(data[i].target == '拍摄服务建议率'){
                        str+='<li>组</li>';
                    }else{
                        str+='<li>&nbsp;</li>';    
                    }

                    str+='<li>'+data[i].target_child+'</li>';
                    data[i].biaozhun?str+='<li>'+data[i].biaozhun_child+'</li>':str+='<li></li>';
                    str+='</ul>';
                }
            }
            if(shop_name == '客服中心'){
                str+='<ul class="e1_tit"><li>&nbsp;</li><li>关键指标</li><li>今日值</li><li>月汇总</li><li>环比</li><li>&nbsp;</li><li>关键指标</li><li>饱和率</li></ul>';
                for (var i = 0; i < data.length; i++) {
                    str+='<ul class="e1_con">';
                    if(data[i].target == '预约量'){
                        str+='<li>今日</li>';
                    }else if(data[i].target == '到店量'){
                        str+='<li>门店</li>';
                    }else if(data[i].target == '到店率'){
                        str+='<li>摄控</li>';
                    }else{
                        str+='<li>&nbsp;</li>';    
                    }
                    str+='<li>'+data[i].target+'</li>';
                    data[i].jinri?str+='<li class="'+data[i].jinri_class+'">'+data[i].jinri+'</li>':str+='<li></li>';
                    data[i].yuehui?str+='<li class="'+data[i].yuehui_class+'">'+data[i].yuehui+'</li>':str+='<li></li>';
                    data[i].huanbi?str+='<li class="'+data[i].huanbi_class+'">'+data[i].huanbi+'</li>':str+='<li></li>';
                    if(data[i].target == '预约量'){
                        str+='<li>门店</li>';
                    }else if(data[i].target == '到店量'){
                        str+='<li>档期</li>';
                    }else if(data[i].target == '到店率'){
                        str+='<li>饱和率</li>';
                    }else{
                        str+='<li>&nbsp;</li>';    
                    }
                    str+='<li>'+data[i].target_child+'</li>';
                    data[i].manzulv_child?str+='<li>'+data[i].manzulv_child+'</li>':str+='<li></li>';
                    str+='</ul>';
                }               
            }
            
            if(shop_name == '人事部'){
                str+='<ul class="e1_tit"><li>关键指标</li><li>标准值</li><li>今日值</li><li>月汇总</li><li>关键指标</li><li>月汇总</li></ul>';
                for (var i = 0; i < data.length; i++) {
                    str+='<ul class="e1_con">';
                    str+='<li>'+data[i].target+'</li>';
                    data[i].biaozhun?str+='<li class="'+data[i].biaozhun_class+'">'+data[i].biaozhun+'</li>':str+='<li></li>';
                    data[i].jinri?str+='<li class="'+data[i].jinri_class+'">'+data[i].jinri+'</li>':str+='<li></li>';
                    data[i].yuehui?str+='<li class="'+data[i].yuehui_class+'">'+data[i].yuehui+'</li>':str+='<li></li>';
                    str+='<li>'+data[i].target_child+'</li>';
                    str+='</ul>';
                }
            }
            
            console.log('htmlId=',htmlId);
            console.log('str=',str);
            
            $("#"+htmlId).html(str);

        }
        /*
        function function_name21 (start,end) {
            // body...
        }
        function function_name22 (start,end) {
            // body...
        }
        function function_name23 (start,end) {
            // body...
        }
        function function_name24 (start,end) {
            // body...
        }
        function function_name25 (start,end) {
            // body...
        }
        function function_name26 (start,end) {
            // body...
        }
        function function_name27 (start,end) {
            // body...
        }
        function function_name28 (start,end) {
            // body...
        }
        function function_name29 (start,end) {
            // body...
        }
        function function_name291 (start,end) {
            // body...
        }*/
    /*---------------------------------------- 第二部分 运转数据大盘 结束 ----------------------------------------*/

    /*---------------------------------------- 第三部分 网销数据大盘 开始 ----------------------------------------*/
        // 实时数据
        function getRealtimeData () {
            $.ajax({
                type: 'POST',
                data: {},
                url : '/crm/bg/getRealtimeData',
                success: function(res){
                    $('.e8_con').eq(0).children().eq(1).html(res.data.kzl_r);
                    $('.e8_con').eq(0).children().eq(2).html(res.data.kzl_y);

                    $('.e8_con').eq(1).children().eq(1).html(res.data.yxkz_r);
                    $('.e8_con').eq(1).children().eq(2).html(res.data.yxkz_y);

                    $('.e8_con').eq(2).children().eq(1).html(res.data.cjkz_r);
                    $('.e8_con').eq(2).children().eq(2).html(res.data.cjkz_y);

                    $('.e8_con').eq(3).children().eq(1).html(res.data.yj_r);
                    $('.e8_con').eq(3).children().eq(2).html(res.data.yj_y);

                    $('.e8_con').eq(5).children().eq(1).html(res.data.xz_r);
                    $('.e8_con').eq(5).children().eq(2).html(res.data.xz_y);
                }
            })
        }
        // 各组日转化率
        function getGroupDayConversion () {
            $.ajax({
                type: 'POST',
                data: {},
                url : '/crm/bg/getGroupDayConversion',
                success: function(res){
                    // console.log(res);

                    var dom = document.getElementById("loop11");
                    var myChart = echarts.init(dom);
                    var app = {};
                    option = null;
                    option = {
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'shadow',
                                crossStyle: {
                                    color: '#fff'
                                },
                            },
                            formatter:'{b}\n{c}%',　　　　//这是关键，在需要的地方加上就行了
                            show: true
                        },
                        grid: {
                            left: '5%',
                            right: '8%',
                            top: '3%',
                            bottom: '5%',
                            containLabel: true
                        },
                        visualMap: {
                            orient: 'horizontal',
                            left: 'center',
                            min: 10,
                            max: 100,
                            text: ['High Score', 'LowHigh Score'],
                            // Map the score column to color
                            dimension: 0,
                            inRange: {
                                color: ['#ffaf74', '#65fbe3', '#ffae95', '#85e6ff', '#ffaf74', '#65fbe3', '#ffae95']
                            },
                            show: false
                        },

                        yAxis: {
                            data: res.data.name,
                            axisLine:{
                                lineStyle:{
                                    color:'#fff',
                                    width:1
                                }
                        },
                        axisLabel: {  
                             interval: 0, 
                             // rotate: 20, 
                             formatter:function(value)  
                                {  
                                    var ret = "";//拼接加\n返回的类目项  
                                    var maxLength = 4;//每项显示文字个数  
                                    var valLength = value.length;//X轴类目项的文字个数  
                                    var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数  
                                    if (rowN > 1)//如果类目项的文字大于3,  
                                    {  
                                        for (var i = 0; i < rowN; i++) {  
                                            var temp = "";//每次截取的字符串  
                                            var start = i * maxLength;//开始截取的位置  
                                            var end = start + maxLength;//结束截取的位置  
                                            //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧  
                                            temp = value.substring(start, end) + "\n";  
                                            ret += temp; //凭借最终的字符串  
                                        }  
                                        return ret;  
                                    }  
                                    else {  
                                         return value;  
                                    }  
                                 }  
                             }
                        
                        },
                        xAxis: {
                            axisLine:{
                                lineStyle:{
                                    color:'#fff',
                                    width:1
                                }
                            }
                            
                        },
                        series: [{
                            name: '',
                            type: 'bar',
                            data: res.data.data,
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true,
                                        position: 'right',
                                        formatter: '{c}%'//这是关键，在需要的地方加上就行了
                                    }
                                }
                            },
                            barWidth : 30,//柱图宽度
                        }],

                    };
                    myChart.setOption(option, true);

                }
            })
        }
        // 各组月转化率
        function getGroupMonthConversion (start,end) {
            if (!start) {
                var start= $('#e2dateStar').val();
            };
            if (!end) {
                var end= $('#e2dateEnd').val();
            };
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/getGroupMonthConversion',
                success: function(res){
                    // console.log(res);

                    var dom = document.getElementById("loop12");
                    var myChart = echarts.init(dom);
                    var app = {};
                    option = null;
                    option = {
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'shadow',
                                crossStyle: {
                                    color: '#fff'
                                },
                            },
                            formatter:'{b}\n{c}%',　　　　//这是关键，在需要的地方加上就行了
                            show: true
                        },
                        grid: {
                            left: '5%',
                            right: '8%',
                            top: '3%',
                            bottom: '5%',
                            containLabel: true
                        },
                        visualMap: {
                            orient: 'horizontal',
                            left: 'center',
                            min: 10,
                            max: 100,
                            text: ['High Score', 'LowHigh Score'],
                            // Map the score column to color
                            dimension: 0,
                            inRange: {
                                color: ['#ffaf74', '#65fbe3', '#ffae95', '#85e6ff', '#ffaf74', '#65fbe3', '#ffae95']
                            },
                            show: false
                        },

                        yAxis: {
                            data: res.data.name,
                            axisLine:{
                                lineStyle:{
                                    color:'#fff',
                                    width:1
                                }
                        },
                        axisLabel: {  
                             interval: 0, 
                             // rotate: 20, 
                             formatter:function(value)  
                                {  
                                    var ret = "";//拼接加\n返回的类目项  
                                    var maxLength = 4;//每项显示文字个数  
                                    var valLength = value.length;//X轴类目项的文字个数  
                                    var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数  
                                    if (rowN > 1)//如果类目项的文字大于3,  
                                    {  
                                        for (var i = 0; i < rowN; i++) {  
                                            var temp = "";//每次截取的字符串  
                                            var start = i * maxLength;//开始截取的位置  
                                            var end = start + maxLength;//结束截取的位置  
                                            //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧  
                                            temp = value.substring(start, end) + "\n";  
                                            ret += temp; //凭借最终的字符串  
                                        }  
                                        return ret;  
                                    }  
                                    else {  
                                         return value;  
                                    }  
                                 }  
                             }
                        
                        },
                        xAxis: {
                            axisLine:{
                                lineStyle:{
                                    color:'#fff',
                                    width:1
                                }
                            }
                            
                        },
                        series: [{
                            name: '',
                            type: 'bar',
                            data: res.data.data,
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true,
                                        position: 'right',
                                        formatter: '{c}%'　　　　//这是关键，在需要的地方加上就行了
                                    }
                                }
                            },
                            barWidth : 30,//柱图宽度
                        }],

                    };
                    myChart.setOption(option, true);
                    
                }
            })
        }
        // 网销业绩日排名
        function getPerformanceDayRanking () {
            $.ajax({
                type: 'POST',
                data: {},
                url : '/crm/bg/getPerformanceDayRanking',
                success: function(res){
                    for (var i = 0; i < 8; i++) {
                        $('.e9_con').eq(i).children().eq(1).html(res.data[i].name);
                        $('.e9_con').eq(i).children().eq(2).html(res.data[i].yj);
                        $('.e9_con').eq(i).children().eq(3).html(res.data[i].order);
                        $('.e9_con').eq(i).children().eq(4).html(res.data[i].zhl);
                    };
                }
            })
        }
        // 网销业绩月排名
        function getPerformanceMonthRanking (start,end) {
            if (!start) {
                var start= $('#e2dateStar').val();
            };
            if (!end) {
                var end= $('#e2dateEnd').val();
            };
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/getPerformanceMonthRanking',
                success: function(res){
                    for (var i = 0; i < 8; i++) {
                        var j = i*1 + 8;
                        $('.e9_con').eq(j).children().eq(1).html(res.data[i].name);
                        $('.e9_con').eq(j).children().eq(2).html(res.data[i].yj);
                        $('.e9_con').eq(j).children().eq(3).html(res.data[i].order);
                        $('.e9_con').eq(j).children().eq(4).html(res.data[i].zhl);
                    };
                }
            })
        }
        // 各组实收业绩/转化率/达成率
        function getGroupRanking (start,end) {
            if (!start) {
                var start= $('#e2dateStar').val();
            };
            if (!end) {
                var end= $('#e2dateEnd').val();
            };
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/getGroupRanking',
                success: function(res){
                    // console.log(res);

                    var dom = document.getElementById("loop9");
                    var myChart = echarts.init(dom);
                    var app = {};
                    option = null;
                    option = {
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'shadow',
                                crossStyle: {
                                    color: '#ffffff'
                                }
                            }
                        },
                        grid: {
                            left: '5%',
                            right: '5%',
                            top: '10%',
                            bottom: '5%',
                            containLabel: true
                        },
                        color: ['#fcdd7f','#00ffd6','#85e6ff'],
                        toolbox: {
                            feature: {
                                dataView: {show: true, readOnly: false},
                                magicType: {show: true, type: ['line', 'bar']},
                                restore: {show: true},
                                saveAsImage: {show: true}
                            },
                            show: false
                        },
                        legend: {
                            data: [ '实收业绩', '转换率', '达成率'],
                            show: true,
                            textStyle: {
                                fontWeight: 300,
                                fontSize: 14,    //文字的字体大小
                                color: '#fff'//文字的字体颜色
                            }
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: res.data.name,
                                axisPointer: {
                                    type: 'shadow'
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                name: '',
                                // min: 0,
                                // max: 25,
                                interval: 5,
                                // axisLabel: {
                                //     formatter: '{value} W'
                                // },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            },
                            {
                                type: 'value',
                                name: '',
                                // min: 0,
                                // max: 100,
                                interval: 20,
                                axisLabel: {
                                    formatter: '{value} %'
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            }
                        ],
                        series: [
                            {
                                name: '实收业绩',
                                type: 'bar',
                                data: res.data.yj
                            },
                            {
                                name: '转换率',
                                type: 'bar',
                                yAxisIndex: 1,
                                data: res.data.zhl
                            },
                            {
                                name: '达成率',
                                type: 'bar',
                                data: [0, 0, 0, 0, 0, 0, 0]
                            },
                        ]
                    };
                    myChart.setOption(option, true);
                }
            })
        }
        // 当月客资渠道分布
        function getMonthChannelDistribution (start,end) {
            if (!start) {
                var start= $('#e2dateStar').val();
            };
            if (!end) {
                var end= $('#e2dateEnd').val();
            };
            $.ajax({
                type: 'POST',
                data: {start:start,end:end},
                url : '/crm/bg/getMonthChannelDistribution',
                success: function(res){
                    // console.log(res);

                    var dom = document.getElementById("loop10");
                    var myChart = echarts.init(dom);
                    var app = {};
                    option = null;
                    option = {
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'shadow',
                                crossStyle: {
                                    color: '#fff'
                                },
                            },
                            show: true
                        },
                        grid: {
                            left: '3%',
                            right: '0',
                            top: '10%',
                            bottom: '5%',
                            containLabel: true
                        },
                        color: ['#fcdd7f','#00ffd6','#fcdd7f'],
                        toolbox: {
                            feature: {
                                dataView: {show: true, readOnly: false},
                                magicType: {show: true, type: ['line', 'bar']},
                                restore: {show: true},
                                saveAsImage: {show: true}
                            },
                            show: false
                        },
                        legend: {
                            data: [ '毛客资', '有效客资'],
                            show: true,
                            textStyle: {
                                fontWeight: 300,
                                fontSize: 14,    //文字的字体大小
                                color: '#fff'//文字的字体颜色
                            }
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: res.data.name,
                                axisPointer: {
                                    type: 'shadow'
                                },
                                axisLabel:{
                                    show:true,
                                    interval: 0,
                                    rotate:  25,
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                name: '',
                                // min: 0,
                                // max: 500,
                                interval: 100,
                                // axisLabel: {
                                //     formatter: '{value} W'
                                // },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            },
                            {
                                type: 'value',
                                name: '',
                                // min: 0,
                                // max: 100,
                                interval: 20,
                                // axisLabel: {
                                //     formatter: '{value} %'
                                // },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                },
                                show: false
                            }
                        ],
                        series: [
                            {
                                name: '毛客资',
                                type: 'bar',
                                data: res.data.mkz
                            },
                            {
                                name: '有效客资',
                                type: 'bar',
                                yAxisIndex: 1,
                                data: res.data.yxkz
                            }
                        ]
                    };
                    myChart.setOption(option, true);
                }
            })
        }
    /*---------------------------------------- 第三部分 网销数据大盘 结束 ----------------------------------------*/

    /*---------------------------------------- 第四部分 办公数据大盘 开始 ----------------------------------------*/

        //考勤
        function getClockLog(){
            var start = $('#e11dateStar').val();
            var end = $('#e11dateEnd').val();
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getClockLog',
                data:{start:start,end:end},
                success: function(res){
                    $('#oa_clock_shidao').html(res.data.shidao);
                    $('#oa_clock_xiujia').html(res.data.xiujia);
                    $('#oa_clock_chuchai').html(res.data.chuchai);
                    $('#oa_clock_waiqin').html(res.data.waiqin);
                    $('#oa_clock_queqin').html(res.data.queqin);
                    $('#oa_clock_avg').html(res.data.avg);
                }
            });
        }

        //员工动态
        function getStaffDynamic(){
            var start = $('#e12dateStar').val();
            var end = $('#e12dateEnd').val();
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getStaffDynamic',
                data:{start:start,end:end},
                success: function(res){
                    $('#oa_ms').html(res.data.ms);
                    $('#oa_rz').html(res.data.rz);
                    $('#oa_zl').html(res.data.zl);
                    $('#oa_qt').html(res.data.qt);
                    $('#oa_dg').html(res.data.dg);
                    $('#oa_staff_all').html(res.data.all);
                }
            });
        }

        //工作提醒
        function getWorkTip(){
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getWorkTip',
                success: function(res){
                    $('#oa_syq').html(res.data.syq);
                    $('#oa_ht').html(res.data.ht);
                    $('#oa_birthday').html(res.data.birthday);
                }
            });
        }

        //男女比例
        function getOaSex(){
            // loop14
            var dom = document.getElementById("loop14");
            var myChart = echarts.init(dom);
            myChart.setOption({
                color: ['#85e6ff', '#00ffd6', '#ffdb5c'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 13
                },
                legend: {
                    // orient: 'vertical',
                    left: 'center',
                    top: '80%',
                    //data: ['男生：50%', '女生：30%', '未知：20%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 13,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '男女比例',
                        type: 'pie',
                        radius: [20, 90],
                        center: ['50%', '35%'],
                        roseType: 'area',
                        data: [
                            //{value: 500, name: '男生：50%'},
                            //{value: 300, name: '女生：30%'},
                            //{value: 200, name: '未知：20%'}
                        ]
                    }
                ]
            });
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaSex',
                success: function(res){
                    myChart.setOption({
                        // legend: {
                        //     data: res.name
                        // },
                        series: [{
                            data:res.data
                        }]
                    });
                }
            });

        }
        //年龄分布
        function getOaAge(){
            // loop15
            var dom = document.getElementById("loop15");
            var myChart = echarts.init(dom);
            myChart.setOption({
                color: ['#85e6ff', '#ffaf74', '#00ffd6', '#ffdb5c'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 13
                },
                legend: {
                    // orient: 'vertical',
                    left: 'center',
                    top: '80%',
                    //data: ['25以下：50%', '25~30：30%', '30~35：10%', '35及以上：10%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 13,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '年龄分布',
                        type: 'pie',
                        radius: [20, 70],
                        center: ['50%', '35%'],
                        roseType: 'area',
                        data: [
                            //{value: 500, name: '25以下：50%'},
                            //{value: 300, name: '25~30：30%'},
                            //{value: 100, name: '30~35：10%'},
                            //{value: 100, name: '35及以上：10%'}
                        ]
                    }
                ]
            });

            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaAge',
                success: function(res){
                    myChart.setOption({
                        series: [{
                            data:res.data
                        }]
                    });
                }
            });

        }
        //司龄比例
        function getOaSiLing(){
            // loop16
            var dom = document.getElementById("loop16");
            var myChart = echarts.init(dom);
            myChart.setOption({
                color: ['#85e6ff', '#ffaf74', '#00ffd6', '#ffdb5c'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 13
                },
                legend: {
                    // orient: 'vertical',
                    left: 'center',
                    top: '80%',
                    //data: ['转正1～3年：35%', '试用：20%', '转正1年内：25%', '转正3年以上:20%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 13,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '司龄比例',
                        type: 'pie',
                        radius: [20, 65],
                        center: ['50%', '35%'],
                        roseType: 'area',
                        data: [
                            //{value: 500, name: '转正1～3年：35%'},
                            //{value: 300, name: '试用：20%'},
                            //{value: 200, name: '转正1年内：25%'},
                            //{value: 200, name: '转正3年以上:20%'}
                        ]
                    }
                ]
            });

            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaSiLing',
                success: function(res){
                    myChart.setOption({
                        series: [{
                            data:res.data
                        }]
                    });
                }
            });
        }

        //管理结构
        function getOaManagementStructure(){

            // loop17
            var dom = document.getElementById("loop17");
            var myChart = echarts.init(dom);
            myChart.setOption({
                color: ['#85e6ff', '#ffaf74', '#00ffd6', '#ffdb5c'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 13
                },
                legend: {
                    // orient: 'vertical',
                    left: 'center',
                    top: '80%',
                    //data: ['专业类：35%', '职能类：20%', '经营类：25%', '技术支持类:20%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 13,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '管理结构',
                        type: 'pie',
                        radius: [20, 80],
                        center: ['50%', '35%'],
                        roseType: 'area',
                        data: [
                            //{value: 500, name: '专业类：35%'},
                            //{value: 300, name: '职能类：20%'},
                            //{value: 200, name: '经营类：25%'},
                            //{value: 200, name: '技术支持类:20%'}
                        ]
                    }
                ]
            });
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaManagementStructure',
                success: function(res){
                    myChart.setOption({

                        series: [{
                            data:res.data
                        }]
                    });
                }
            });
        }

        //学历分布
        function getOaEducationBackground(){
            var dom = document.getElementById("loop18");
            var myChart = echarts.init(dom);
            myChart.setOption({
                color: ['#8378ea', '#e7bcf3', '#fb7293', '#ffaf74', '#ffdb5c', '#9fe6b8', '#32c5e9', '#37a2da', '#00ffd6', '#0072ff'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : {c} ({d}%)'
                },
                textStyle: {
                    fontWeight: 600,
                    fontSize: 13
                },
                legend: {
                    // orient: 'vertical',
                    left: 'center',
                    top: '75%',
                    //data: ['博士后：10%','博士：10%','硕士：10%','本科：10%','大专：10%','高职：10%','技校：10%','中专：10%','高中：10%','初中及以下：10%'],
                    textStyle: {
                        fontWeight: 300,
                        fontSize: 13,    //文字的字体大小
                        color: '#fff'//文字的字体颜色
                    }
                },
                series: [
                    {
                        name: '学历分布',
                        type: 'pie',
                        radius: [20, 80],
                        center: ['50%', '35%'],
                        roseType: 'area',
                        data: [
                            //{name: '博士后：10%',value: 10},
                            //{value: 10, name: '博士：10%'},
                            //{value: 10, name: '硕士：10%'},
                        ]
                    }
                ]
            });

            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaEducationBackground',
                success: function(res){
                    console.log('学历分布',res);
                    myChart.setOption({
                        // legend: {
                        //     data: res.name
                        // },
                        series: [{
                            data:res.data
                        }]
                    });
                }
            });

        }

        //编制人数  实际人数
        function getOaPosition(){
            var dom = document.getElementById("loop19");
            var myChart = echarts.init(dom);
            var app = {};
            $.ajax({
                type: 'POST',
                url : '/crm/bg/getOaPosition',
                success: function(res){

                    var option = null;
                    option = {
                        tooltip: {
                            trigger: 'axis',
                            axisPointer: {
                                type: 'shadow',
                                crossStyle: {
                                    color: '#fff'
                                },
                                formatter:'{b}\n{c}%'//这是关键，在需要的地方加上就行了
                            },
                            show: true
                        },
                        grid: {
                            left: '3%',
                            right: '0',
                            top: '10%',
                            bottom: '5%',
                            containLabel: true
                        },
                        color: ['#fcdd7f','#00ffd6','#fcdd7f'],
                        toolbox: {
                            feature: {
                                dataView: {show: true, readOnly: false},
                                magicType: {show: true, type: ['line', 'bar']},
                                restore: {show: true},
                                saveAsImage: {show: true}
                            },
                            show: false
                        },
                        legend: {
                            data: [ '编制人数', '员工人数'],
                            show: true,
                            textStyle: {
                                fontWeight: 300,
                                fontSize: 14,    //文字的字体大小
                                color: '#fff'//文字的字体颜色
                            }
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: res.data.title,
                                //data: ['北欧馆', '潮拍馆', '韩国馆', '炫酷管', '欧美馆', '轻奢馆', '高端亲子馆', '光华店', '花棉店', '小南店', '美丽孕记', '爱婴中心', '网销中心', '市场部', '客服部', '微电影', '运营中心', '利蒂希雅', '东门亲子馆', '挪威店', '新加坡馆'],
                                axisPointer: {
                                    type: 'shadow'
                                },
                                axisLabel:{
                                    interval: 0,
                                    rotate: 20,
                                    formatter:function(value)
                                    {
                                        var ret = "";//拼接加\n返回的类目项
                                        var maxLength = 4;//每项显示文字个数
                                        var valLength = value.length;//X轴类目项的文字个数
                                        var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
                                        if (rowN > 1)//如果类目项的文字大于3,
                                        {
                                            for (var i = 0; i < rowN; i++) {
                                                var temp = "";//每次截取的字符串
                                                var start = i * maxLength;//开始截取的位置
                                                var end = start + maxLength;//结束截取的位置
                                                //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
                                                temp = value.substring(start, end) + "\n";
                                                ret += temp; //凭借最终的字符串
                                            }
                                            return ret;
                                        }
                                        else {
                                            return value;
                                        }
                                    }
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                name: '编制人数',
                                min: 0,
                                max: 100,
                                interval: 20,
                                axisLabel: {
                                    formatter: '{value} '
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                }
                            },
                            {
                                type: 'value',
                                name: '员工人数',
                                min: 0,
                                max: 100,
                                interval: 20,
                                axisLabel: {
                                    formatter: '{value} ',
                                },
                                axisLine:{
                                    lineStyle:{
                                        color:'#fff',
                                        width:1
                                    }
                                },
                                show: false
                            }
                        ],
                        series: [
                            {
                                name: '编制人数',
                                type: 'bar',
                                data: res.data.bz,
                                itemStyle: {
                                    normal: {
                                        label: {
                                            show: true,
                                            position: 'top',
                                            // formatter: '{b}\n{c}%'　　　　//这是关键，在需要的地方加上就行了
                                        }
                                    }
                                }
                            },
                            {
                                name: '员工人数',
                                type: 'bar',
                                yAxisIndex: 1,
                                data: res.data.staff,
                                itemStyle: {
                                    normal: {
                                        label: {
                                            show: true,
                                            position: 'top',
                                            // formatter: '{b}\n{c}%'　　　　//这是关键，在需要的地方加上就行了
                                        }
                                    }
                                }
                            }
                        ]
                    };
                    myChart.setOption(option, true);
                }
            });


        }

    /*---------------------------------------- 第四部分 办公数据大盘 结束 ----------------------------------------*/



});