czapp/pages/tongji/tongji.js

(function () {

    var custmerform = {};
    var $scroll = '';
	
	var chartMap = {};
    // 图表数据
    function chart(data, $page) {
		
        if (data.length > 0) {
            chartMap = {};
            $.each(data, function (_index, _item) {
                var _html = '\
                <div class="lr-black-panel">\
                    <div class="lr-title">'+ _item.F_Name + '</div>\
                    <div class="lr-content lr-chart-content">\
                        <div class="lr-chart-container" id="'+ _item.F_Id + '"  data-desktop="' + _item.F_Type + '" ></div>\
                    </div>\
                </div>';
				
                $page.find('#lr_desktop_msg_content').append(_html);
                chartMap[_item.F_Id] = echarts.init(document.getElementById(_item.F_Id));

                // 获取后台数据
				var data = '{"Id":"1064e045-f075-42a2-8431-ba717e1539b3","value":[{"name":"2017.07.13","value":9000.00},{"name":"2017.08.11","value":100900.00},{"name":"2017.09.25","value":0.00},{"name":"2018.04.03","value":100.00},{"name":"2018.05.21","value":2.00}]}';
                //learun.httpget("", { type: 'chart', id: _item.F_Id }, function(data) {
				data = JSON.parse(data);
                    if (data) {
                        var type = $('#' + data.Id).attr('data-desktop');
                        var legendData = [];
                        var valueData = [];
                        $.each(data.value, function (_index, _item) {
                            legendData.push(_item.name);
                            valueData.push(_item.value);
                        });
                        var option = {};
						option.tooltip = {
							trigger: 'item',
							formatter: "{a} <br/>{b}: {c} ({d}%)"
						};
						console.log(option.tooltip);
						option.legend = {
							orient: 'vertical',
							left: 'left',
							data: legendData
						};
						console.log(option.legend);
						option.series = [{
							name: '占比',
							type: 'pie',
							radius: ['50%', '70%'],
							avoidLabelOverlap: false,
							label: {
								normal: {
									show: false,
									position: 'center'
								},
								emphasis: {
									show: true,
									textStyle: {
										fontSize: '30',
										fontWeight: 'bold'
									}
								}
							},
							labelLine: {
								normal: {
									show: false
								}
							},
							data: data.value
						}];
						console.log(option.series);
						option.color = ['#df4d4b', '#304552', '#52bbc8', 'rgb(224,134,105)', '#8dd5b4', '#5eb57d', '#d78d2f'];
						console.log(option);
                        chartMap[data.Id].setOption(option);
                    }
                //});
            });
        }
    }

    // 统计数据
    function target(data, $page) {
        if (data.length > 0) {
            var _html = '\
            <div class="lr-black-panel">\
                <div class="lr-title">统计数据</div>\
                <div class="lr-content lr-flex-content">\
                </div>\
            </div>';
            $page.find('#lr_desktop_msg_content').append(_html);
            //var $content = $desktop.find('.lr-flex-content');
            $.each(data, function (_index, _item) {
                var _itemHtml = '\
                    <div class="targetItem">\
                        <div class="name">'+ _item.F_Name + '</div>\
                        <div class="number" data-number="'+ _item.F_Id + '" ></div>\
                    </div>';
				$('#lr_desktop_msg_content').find('.lr-flex-content').append(_itemHtml);
                //$content.append(_itemHtml);
                // 获取后台数据
                learun.httpget(config.webapi + "learun/adms/desktop/data", { type: 'Target', id: _item.F_Id }, function(data){
                    if (data) {
                        $('[data-number="' + data.Id + '"]').text(data.value);
                    }
                });

            });

        }
    }


    function refreshDeskTop($page) {
        learun.clientdata.get('desktop', {
            callback: function (data) {
                //var $desktop = $('#lr_desktop_msg_content');
                //$desktop.html('');
				chart(data.chart || [], $page);
                target(data.target || [], $page);

                /*if (self) {
                    self.refresh(true);
                    self.endPulldownToRefresh();
                }*/
            }
        });
    }

    var page = {
        init: function ($page) {
            // 基础数据初始化
            learun.clientdata.init();
            refreshDeskTop($page);
           
            $scroll = $page.find('#lr_desktop_msg').pullRefresh({
                down: {
                    height: 30,
                    contentinit: '下拉可以刷新',
                    contentdown: '下拉可以刷新',
                    contentover: '松开立即刷新',
                    contentrefresh: '正在刷新...',
                    callback: function () {
                        refreshDeskTop($page);
                    }
                }
            });

            // 加载功能列表
            learun.clientdata.get('module', {
                callback: function (data) {
                    learun.myModule.get(data, function (myModules) {
                        var mylen = parseInt((myModules.length + 1) / 4) + ((myModules.length + 1) % 4 > 0 ? 1 : 0);
                        switch (mylen) {
                            case 1:
                                $page.find('.lr-workspace-page').css('padding-top', '210px');
                                break;
                            case 2:
                                $page.find('.lr-workspace-page').css('padding-top', '290px');
                                break;
                            case 3:
                                $page.find('.lr-workspace-page').css('padding-top', '370px');
                                break;
                        }

                        var map = {};
                        $.each(data, function (_index, _item) {
                            map[_item.F_Id] = _item;
                        });
                        var $appbox = $page.find('.appbox');
                        var $last = null;
                        $.each(myModules, function (_index, _id) {
                            var item = map[_id];
                            if (item) {
                                var _html = '\
                                        <div class="appitem appitem2" data-value="'+ item.F_Id + '">\
                                            <div><i class="'+ item.F_Icon + '"></i></div>\
                                            <span>'+ item.F_Name + '</span>\
                                        </div>';
                                var _$html = $(_html);
                                _$html[0].item = item;
                                if ($last === null) {
                                    $appbox.prepend(_$html);
                                }
                                else {
                                    $last.after(_$html);
                                }
                                $last = _$html;

                            }
                        });
                        $last = null;
                    });
                }
            });
        },
        reload: function ($page, pageinfo) {
            if (learun.isOutLogin) {// 如果是重新登录的情况刷新下桌面数据
                learun.isOutLogin = false;
                refreshDeskTop($page);
                learun.clientdata.clear('module');
                learun.myModule.states = -1;
            }
            // 加载功能列表
            learun.clientdata.get('module', {
                callback: function (data) {
                    learun.myModule.get(data, function (myModules) {
                        var mylen = parseInt((myModules.length + 1) / 4) + ((myModules.length + 1) % 4 > 0 ? 1 : 0);
                        switch (mylen) {
                            case 1:
                                $page.find('.lr-workspace-page').css('padding-top', '210px');
                                break;
                            case 2:
                                $page.find('.lr-workspace-page').css('padding-top', '290px');
                                break;
                            case 3:
                                $page.find('.lr-workspace-page').css('padding-top', '370px');
                                break;
                        }

                        var map = {};
                        $.each(data, function (_index, _item) {
                            map[_item.F_Id] = _item;
                        });
                        var $appbox = $page.find('.appbox');
                        var $last = null;
                        $appbox.find(".appitem2").remove();
                        $.each(myModules, function (_index, _id) {
                            var item = map[_id];
                            if (item) {
                                var _html = '\
                                        <div class="appitem appitem2" data-value="'+ item.F_Id + '">\
                                            <div><i class="'+ item.F_Icon + '"></i></div>\
                                            <span>'+ item.F_Name + '</span>\
                                        </div>';
                                var _$html = $(_html);
                                _$html[0].item = item;
                                if ($last === null) {
                                    $appbox.prepend(_$html);
                                }
                                else {
                                    $last.after(_$html);
                                }
                                $last = _$html;

                            }
                        });
                        $last = null;
                    });
                }
            });
            $.each(chartMap, function (id, obj) {
                obj.resize();
            });
        }
    };
    return page;
})();