define(['mUtil', "Component", "wev-loading","chartHelper"],function(mUtil, Component, WevLoading,chartHelper) {
	var RadarChart = function(options) {
		var _chart = {}, $errorTip, $chartContainer;
		
		Component.super(this, options);
		
		this.type = "RadarChart";
		this.tpl = this.type + "_html";
		this.css = "chart_css";
		
		this.components = {
			loading: new WevLoading({
				delay: 300,
				animation: 1
			}),
		};
		
		var vm = this.viewModel = {
			data : [],
			height : 250,//图表高度
			title : {
				show : false,
				x : "center",
				y : 0,
				text : "",//标题
				subtext: ""//副标题
			},
			legend : {
				show : true,//是否显示图例
				bottom : 5,//图例底部边距
				textStyle : {
					color : "#333"//字体颜色
				}
			},
			radar: {
				show: true
			},
			advancedSearch: {},
			labelFormat:'',
			color:"#c23531,#2f4554,#61a0a8,#d48265,#91c7ae,#749f83,#ca8622,#bda29a,#6e7074,#546570,#c4ccd3",//颜色，默认
			standalone : true
		};
		
		this.beforeMount = function(){
			var style = "";
			var height = parseFloat(vm.height) || 250;
			var width = parseFloat(vm.width);

			style += "height:" + height + "px;";
			style += width && ("width:" + width + "px;") || "";
			vm.style = style;
			
			if(mUtil.isString(vm.click) && vm.click != ""){
				var dataurl = vm.click;
				vm.click = function(params){
					var url = dataurl.replace(/\{_chart_name}/g, params.name).replace(/\{_chart_seriesName}/g, params.seriesName).replace(/\{_chart_value}/g, params.value);
					$u(url);
				};
			}

			vm.title = vm.title.text || '';
		};
		
		this.mounted = function(){
			$errorTip = this.$el.find(".wev-error");
			$chartContainer = this.$el.find(".wev-chart");
			
			this.refresh();
		};
		
		this.refresh = function(){
			var loading = this.components.loading;

			loading.setRefs(this.$comp, "wev-refreshing");
			loading.show();

			var _hideLoading = loading.hide.bind(loading);

			if(vm.standalone && mUtil.isArray(vm.data)){
				_chart.buildChart(vm.data, _hideLoading);
            } else {
				_chart.loadData(_hideLoading);
            }
		};
		
		this.cacheSearchLast = function(searchLast){//上一次查询参数map
			vm.searchLast = searchLast;
		};

		_chart.loadData = function(callback) {
			var actionUrl = vm.data,
				that = this;
			var timestamp = new Date().valueOf();    //时间戳

			that.timestamp = timestamp;

            if(!vm.standalone) {
				actionUrl = mUtil.getActionUrl(this.type, { action: "getDatas", "mec_id": vm.id }, this.pageid);
			} 
			
			if (!actionUrl) return;

			mUtil.getJSON(actionUrl, {}, function (result) {
				if (timestamp != that.timestamp) return;

				_chart.buildChart(result.data, callback);
				$errorTip.html("").hide();

				if (!vm.advancedSearch.enable) return;
				vm.toolbox = {
					showTitle: false,
					itemSize: 28,
					right: 20,
					top: 20,
					feature: {
						myTool: {
							show: true,
							icon: 'image:///mobilemode/mobile/images/plugin/filter.png',
							onclick: function () {
								require(["mService"], function (mService) {
									mService.show("customsearch", {
										id: that.id,
										pageid: that.pageid,
										searchLast: vm.searchLast || {},
										conditions: vm.advancedSearch.asFields,
										title: vm.title || ""
									});
								});
							}
						}
					}
				};
			}, function(res){
				that.$el.find(".wev-chart-title").removeClass("wev-chart-title-mb");
				$errorTip.html(res).show();
				$chartContainer.hide();
				mUtil.isFunction(callback) && callback.call(this);
			});
		};
		
		_chart.buildChart = function(datas, callback) {
			var that = this,
				$chart = $(".wev-chart", that.$el);
			
            require(["echarts"], function(echarts){
            	// 基于准备好的dom，初始化echarts实例
    			var theChart = echarts.init($chart[0]);
    			
    			var op_legend_data = [];
    			
    			var op_radar_indicator = [];
    			
    			var op_series_datas = [];
    			
    			for(var i = 0; i < datas.length; i++){
    				var da = datas[i];
    				
    				var j = 0;
    				for(var key in da){
    					if(key == 'max'){
    						break;
    					}
    					var value = da[key];
    					if(i == 0 && j > 0){
    						op_legend_data.push(key);
    					}
    					if(j == 0){
    						var indicator_one = {name: value}
    						da.max && (indicator_one.max = da.max);
    						op_radar_indicator.push(indicator_one);
    					}
    					if(j > 0){
    						var op_series_one = op_series_datas[j - 1];
    						if(!op_series_one){
    							op_series_one = {};
    							op_series_datas[j - 1] = op_series_one;
    						}
    						if(i == 0){
    							op_series_one.name = key;
    						}
    						
    						var op_series_one_data = op_series_one.value;
    						if(!op_series_one_data){
    							op_series_one_data = [];
    							op_series_one.value = op_series_one_data;
    						}
    						op_series_one_data.push(value);
    					}
    					j++;
    				}
    			}
    			
    			var op_series = [{
    				type: 'radar',
    				data: op_series_datas
    			}];
    			
    			//图例
    			var legend = vm.legend;
    			
    			//图例数据
					legend.data = op_legend_data; //['预算分配','实际开销'],
					legend.bottom = 5;
    			
    			var radar = vm.radar || {};
    			radar.indicator = op_radar_indicator;
    			
    			var option = {
    				tooltip: {
							confine: true,
    					formatter: function (data) {
    				    	var relVal = data.name;  
    				           for (var i = 0; i < data.value.length; i++) {  
    				                relVal += '<br/>' +   radar.indicator[i].name + ' : ' +  chartHelper.formatNumber(data.value[i], vm.labelFormat);  
    				            }  
    				           return relVal;  
    			
    			    	},
						position: function(point,params,dom,rect,size){
							dom.style.transform="translateZ(0)";
						}
    				},
    			    legend: legend,
    			    radar: radar,
    			    series : op_series,
    			    toolbox : vm.toolbox
    			};
    			
				var color = vm.color;

    			if(color){
    				option.color = color.split(",");
    			}
    			
    			// 使用刚指定的配置项和数据显示图表。
    			theChart.setOption(option);
    			
    			if(vm.click && mUtil.isFunction(vm.click)){
    				theChart.on('click', function (params) {
    					vm.click.call(this, params);
    				});
    			}
				
				mUtil.isFunction(callback) && callback.call(this);
            });
		};

		_chart.buildChart = _chart.buildChart.bind(this);
		_chart.loadData = _chart.loadData.bind(this);
    };

    return Component.init(RadarChart);
});