define(['utils', 'api'], function (utils, api) {

    var modVars = {
      "chart": null
    };

    function init() {
        //setUserName();
        initCharts(); // 初始化图表实例
    }

    function setUserName() {
        var option = {
            type: 'post',
            url: api.user.getSystemUser,
            success: function (ret) {
                if (ret.code === 200) {
                    console.log(ret.obj);
                }else {
                    layer.msg('code：' + ret.code + ' 信息: ' + ret.msg, {icon: 2});
                }
            }
        };
        utils.ajax(option);
    }

    /**
     * 初始化图表实例
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function initCharts() {
        modVars.chart = {
            "barChart": echarts.init($('#barChart')[0], 'shine'),
            "stackedLineChart": echarts.init($('#lineChart')[0], 'shine'),
            "pieChart": echarts.init($('#pieChart')[0], 'shine')
        };

        // ECharts图表在div尺寸变化时的自适应
        window.onresize = function(){
            modVars.chart.barChart.resize();
            modVars.chart.stackedLineChart.resize();
            modVars.chart.pieChart.resize();
        };
        getChartsData(); // 获取所有图表的数据
    }

    /**
     * 获取所有图表的数据
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function getChartsData() {
        function successFun(ret) {
            if (ret.code === 200) {
                var obj = ret.obj;
                renderCharts(obj);
            } else {
                layer.msg("首页数据获取失败！");
            }
        }
        /*var option = {
            url: api.home.getHomePageStatistics,
            success: successFun
        };
        utils.ajax(option);*/

        $.getJSON("../../js/model/home/content.json", "", successFun);
    }

    /**
     * 渲染图表
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function renderCharts(data) {

        $('#userCount').html(data.userCount); // 总用户数
        $('#monthloginCount').html(data.monthloginCount); // 本月登录用户数
        $('#dayloginCount').html(data.dayloginCount); // 今日登录用户数
        $('#loginTotalCount').html(data.loginTotalCount); // 总登录次数

        // 数字从低到高动态累加
        $('.counter').counterUp({
            delay: 100,
            time: 1200
        });

        $('#appTotalCount').html(data.appTotalCount); // 总应用数量


        renderBar(data.activiUserRanking); // 渲染柱状图(活跃用户排行榜)
        renderStackedLine(data.appRateRanking); // 渲染堆叠折线图(系统使用频率分析)
        renderPie(data.appRateStatistic); // 渲染圆饼图(每个应用登录次数)

    }

    /**
     * 渲染柱状图(活跃用户排行榜)
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function renderBar(barData) {
        var one = barData[0].loginCount,
            two = barData[1].userCount,
            ranking = barData[2].ranking; // 排行榜数据

        var xAxisData = [], // x轴上的类别
            oneData = [],
            twoData = [];

        // 获取状元，榜眼，探花每个月的登录次数
        for (monthName in one) {
            if (one.hasOwnProperty(monthName)) {
                xAxisData.push(monthName);

                var oneItem = (one[monthName] === 0) ? 0 : one[monthName];
                oneData.push(oneItem);

                var twoItem = (two[monthName] === 0) ? 0 : two[monthName];
                twoData.push(twoItem);
            }
        }


        // 获取当前月的状元，榜眼，探花 (短路&&)
        ranking.one && $('#first').html(ranking.one.username);
        ranking.two && $('#second').html(ranking.two.username);
        ranking.three && $('#third').html(ranking.three.username);

        // 配置项：用于控制条形柱顶部显示数量，或文字等
        var itemStyle = {
            normal: {
                label: {
                    show: false, // 不显示（暂时）
                    position: 'top', // 在上方显示
                    textStyle: { // 数值样式
                        color: 'black',
                        fontSize: 14
                    },
                    formatter: function (param) {
                        if (param.value === 0) {
                            return '';
                        } else {
                            return param.data.username;
                        }
                    }

                }
            }
        };

        var option = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            // 自定义tooltip显示
            // formatter: function (params) {
            //     var res = params[0].name;
            //     res += '<style>td{padding:3px;padding-top: 1px;}</style><table>';
            //     if (params[0].data) {
            //         res += '<tr><td>' + params[0].marker + '状元:</td><td>' + params[0].data.username + '</td></tr>';
            //     }
            //     if (params[1].data) {
            //         res += '<tr><td>' + params[1].marker + '榜眼:</td><td>' + params[1].data.username + '</td></tr>';
            //     }
            //     if (params[2].data) {
            //         res += '<tr><td>' + params[2].marker + '探花:</td><td>' + params[2].data.username + '</td></tr>';
            //     }
            //     res += '</table>';
            //     return res;
            // },
            xAxis: {
                type: 'category',
                data: xAxisData
            },
            yAxis: {
                type: 'value',
                min: 0,
                minInterval: 1,
                name: '',
                axisLabel: {
                    formatter: ' {value}'
                },
                "axisLine": {       //y轴
                    "show": false
                },
                "axisTick": {       //y轴刻度线
                    "show": false
                },
                "splitLine": {     //网格线
                    "show": true
                },
            },
            series: [{
                name: '使用次数',
                type: 'bar',
                data: oneData,
                // 暂时不用，需要时，将对象里的show变为true
                itemStyle: itemStyle
            }, {
                name: '用户数',
                type: 'bar',
                data: twoData,
                // 暂时不用，需要时，将对象里的show变为true
                itemStyle: itemStyle
            }]
        };

        // 使用刚指定的配置项和数据显示图表。
        modVars.chart.barChart.setOption(option);

    }

    /**
     * 渲染堆叠折线图(系统使用频率分析)
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function renderStackedLine(lineData) {

        var xAxisData = [], // x轴上的类别
            legendArr = [], // 图例
            seriesData = [];

        for (var i = 0; i <= lineData.length; i++) {
            var appObj = {}; // 保存每个应用的数据
            var appItem = lineData[i]; // 每个应用对象，只有一个属性
            for (appName in appItem) {
                if (appItem.hasOwnProperty(appName)) {

                    var appItemMonthData = appItem[appName]; // 每个应用对应的月份数据
                    appObj = {
                        "name": appName, // 应用名
                        "type": "line",
                        "stack": appName,
                        "data": [] // 该应用每个月的使用频率
                    };
                    for (monthName in appItemMonthData) {
                        if (appItemMonthData.hasOwnProperty(monthName)) {
                            if (i === 0) {
                                xAxisData.push(monthName);  // 获取x轴上的类别
                            }
                            appObj.data.push(appItemMonthData[monthName]);
                        }

                    }
                    legendArr.push(appName);
                    seriesData.push(appObj);
                }
            }
        }

        var option = {
            title: {
                // text: '折线图堆叠'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'line'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data: legendArr
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: xAxisData
            },
            yAxis: {
                // minInterval: 10,
                min: 0,
                minInterval: 1,
                type: 'value',
                axisLabel: {
                    formatter: ' {value}'
                },
                "axisLine": {       //y轴
                    "show": false

                },
                "axisTick": {       //y轴刻度线
                    "show": false
                },
                "splitLine": {     //网格线
                    "show": true
                }
            },
            series: seriesData
        };

        // 使用刚指定的配置项和数据显示图表。
        modVars.chart.stackedLineChart.setOption(option);
    }

    /**
     * 渲染圆饼图(每个应用登录次数)
     * @author [刘耀填]
     * @date 2018/10/08
     */
    function renderPie(pieData) {
        var option = {
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            color: ['rgb(59,192,195)', 'rgb(241,60,110)', 'rgb(249,205,173)', 'rgb(26,41,66)', 'rgb(131,175,155)'],
            series: [
                {
                    name: '使用次数',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '60%'],
                    data: pieData,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        },
                        normal: {
                            label: {
                                show: false   //隐藏标示文字
                            },
                            labelLine: {
                                show: false   //隐藏标示线
                            }
                        }
                    }
                }
            ]
        };
        // 使用刚指定的配置项和数据显示图表。
        modVars.chart.pieChart.setOption(option);
    }

    return {
        'init': init
    }
});