if(typeof(Mobile_NS) == 'undefined'){
	Mobile_NS = {};
}

Mobile_NS.GaugeChart = {};

Mobile_NS.GaugeChart.onload = function(p){
	this.build(p);
};

Mobile_NS.GaugeChart.build = function(p){
	var sql = p.sql;
	var $chartContainer = $("#NMEC_" + p.id).find(".wev-chart").height(p.height || 250);
    if(p.width){
        $chartContainer.width(p.width);
    }
    var _build = function (datas){
		var vm = (function (dm) {
			var vm = {};
			vm.series = {
				axisLine: {            // 坐标轴线
					lineStyle: {       // 属性lineStyle控制线条样式
						width: 6
					}
				},
				axisTick: {            // 坐标轴小标记
					length: 12,        // 属性length控制线长
					lineStyle: {       // 属性lineStyle控制线条样式
						color: 'auto'
					}
				},
				splitLine: {           // 分隔线
					length: 20,         // 属性length控制线长
					lineStyle: {       // 属性lineStyle（详见lineStyle）控制线条样式
						color: 'auto'
					}
				},
				axisLabel: {			//仪表盘标签数字
					fontSize: 14
				},
				pointer: {
					width: 4
				},
				title: {
					offsetCenter: [0, '-30%'],       // x, y，单位px
				},
				radius: "85%",
				detail: {
					formatter: '{value}',
					fontSize: 24
				}
			};

			vm.series.radius = (parseInt(dm.radius) || 85) + "%";
			vm.series.axisLabel.fontSize = parseInt(dm.labelFontSize) || 14;
			vm.series.title.fontSize = parseInt(dm.gaugeTitleFontSize) || 14;
			vm.series.title.color = dm.gaugeTitleFontColor || "auto";
			vm.series.detail.fontSize = parseInt(dm.gaugeDetailFontSize) || 20;
			vm.series.detail.color = dm.gaugeDetailFontColor || "auto";

			var axisColor = dm.axisColor || [];
			if (axisColor.length) {
				var lineColor = [];
				axisColor.forEach(function (item) {
					var color = [parseFloat(item.end / 100), item.color];
					lineColor.push(color);
				});
				vm.series.axisLine.lineStyle.color = lineColor;
			}

			return vm;
		})(p);

		// 基于准备好的dom，初始化echarts实例
		var theChart = echarts.init($chartContainer[0]);
		var dataObj = datas[0];

		var seriesName = dataObj.name || "",
			dataValue = parseFloat(dataObj.value) || 0;
		dataLabel = dataObj.label || "";
		//	unit = String(dataObj.value).split(dataValue)[1] || "";

		var series = vm.series || {};

		series.type = "gauge";
		series.name = seriesName;
		series.data = [{ value: dataValue, name: dataLabel }];
		series.detail.formatter = function(data){
			return require("mec").formatNumber(data,p.labelFormat);
		};
		
		series.min = parseFloat(dataObj.min) || 0;
		series.max = parseFloat(dataObj.max) || 100;

		var option = {
			tooltip: {
				confine: true,
				formatter:function(data){
					return data.name + "<br/>" + data['seriesName']+ " : "+ require("mec").formatNumber(data['value'],p.labelFormat);
				}
			},
			series: series,
			toolbox: {
				showTitle: false,
				itemSize: 28,
				right: 20,
				top: 20,
				feature: {
					myTool: {
						show: p["advancedSearch"] == '1',
						icon: 'image:///mobilemode/mobile/images/plugin/filter.png',
					}
				}
			}
		};

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

	if (p.isdefault) {
		var datas = [{
			label: "完成率",
			max: "100",
			min: "0",
			name: "业务指标",
			value: "79.99"
		}];

		return _build(datas);
	}

	var msgStyle = "color: #bbb;font-size: 14px;padding: 35px 5px 9px 22px;";
	var msg = "", multiLJson = p['multiLJson'] || {};
	if(!$.trim(sql)){
		msg = multiLJson['4205'];//图表信息设置不完整，未配置数据来源SQL
	}else if (/\{(.*?)\}/.test(sql)) {
		msg = multiLJson['4206'];//SQL中可能包含待解析的参数变量，需运行时显示
	}
	if(msg){
		return $chartContainer.html("<div style=\""+msgStyle+"\">"+msg+"</div>");
	}

	var _u = require("utils");

	_u.api("designer/plugin", {
		action: "getDataBySQLWithEChart",
		notification: false,
		data: {
			datasource: p.datasource,
			sql: compressByLZ(sql)
		}
	}, function (res) {
		_build(res.data);
	}, function () {
		$chartContainer.html("<div style=\""+msgStyle+"\">"+multiLJson['4208']+"</div>");//查询数据来源SQL时出现错误，请检查SQL是否拼写正确
	});
};