~whychwj/haha.git

			@@ -15,7 +15,7 @@
			<meta http-equiv="expires" content="0">
			<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
			<meta http-equiv="description" content="This is my page">
			<title>机房流量统计查询</title> <!--流量统计-->
			<title>设备流量统计查询</title> <!--设备流量统计查询-->
			<link rel="stylesheet" type="text/css" href="pages/css/base.css">
			<link rel="stylesheet" type="text/css" href="jqueryui/jquery-ui.css">
			<link rel="stylesheet" type="text/css" href="src/css/layui.css">
			@@ -41,7 +41,7 @@
			<div class="layui-page-container">
			<!-- 条件筛选 -->
			<div class="layui-page-filter">
			<div class="page-filter-header layui-page-filter-fweight">机房流量统计查询</div>
			<div class="page-filter-header layui-page-filter-fweight">设备流量统计查询</div>
			<div class="page-filter-content">
			<table>
			<tr class="layui-page-filter-tbl-header layui-page-filter-fweight">
			@@ -149,6 +149,13 @@
			<!-- 表格内容 -->
			<table id="pageTbl" lay-filter="pageTbl"></table>
			</div>
			<div id="echarts-container" class="abs abs-top220 bg-red abs-index1n abs-bottom70">
			<div class="abs-container">
			<div class="graph">
			<div class="graph-content" id="lineGraph"></div>
			</div>
			</div>
			</div>
			<!-- 分页内容 -->
			<div id="paging">
			<a href="javascript:" class="search"><s:text name="Search"/><!-- 查询 --></a>
			@@ -162,12 +169,22 @@
			<script type="text/javascript" src="jqueryui/jquery-ui.min.js"></script>
			<script type="text/javascript" src="src/layui.js"></script>
			<script type="text/javascript" src="pages/js/mylayui.js"></script>
			<script type="text/javascript" src="pages/js/pages/control-common.js"></script>
			<script type="text/javascript">
			layui.use(['form', 'table', 'layer', 'laydate', 'element'], function() {
			var table = layui.table; // 获取表格模块
			var form = layui.form; // 获取表单模块
			var layer = layui.layer; // 获取弹出框模块
			var laydate = layui.laydate; // 获取日期模块
			var createLine = GLOBAL.eleDataGraph.createLine; // 生成折线图
			var $lineGraph = $('#lineGraph').get(0);
			var lineGraph = echarts.init($lineGraph);
			createLine(lineGraph, {});

			// 页面大小改变模块
			$(window).resize(function() {
			lineGraph.resize();
			});

			// 定义时间模块
			var date = new Date();
			@@ -193,6 +210,9 @@
			});


			var isNewLoad = true;

			var pre_province = getQueryString('province');
			// 查询省下拉框
			searchProvince();
			// 查询省
			@@ -215,6 +235,9 @@
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var _tmp = getLayuiSelect(_data, _data, {}, {});
			if(pre_province == _data && isNewLoad){
			_tmp = getLayuiSelect(_data, _data, {}, {},true);
			}
			list.push(_tmp);
			}
			}else {
			@@ -243,6 +266,7 @@
			var tmp = {
			StationName1: $("#province").val()
			};
			var pre_city = getQueryString('city');
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -261,6 +285,9 @@
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var _tmp = getLayuiSelect(_data.StationName2, _data.StationName2, {}, _data);
			if(pre_city == _data.StationName2 && isNewLoad){
			_tmp = getLayuiSelect(_data.StationName2, _data.StationName2, {}, _data,true);
			}
			list.push(_tmp);
			}
			}else {
			@@ -295,6 +322,7 @@
			if(isLoad) {
			filterLoad = layer.load();
			}
			var pre_county = getQueryString('county');
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -314,6 +342,9 @@
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var _tmp = getLayuiSelect(_data.StationName5, _data.StationName5, {}, _data);
			if(pre_county == _data.StationName5 && isNewLoad){
			_tmp = getLayuiSelect(_data.StationName5, _data.StationName5, {}, _data,true);
			}
			//console.info(_tmp);
			list.push(_tmp);
			}
			@@ -345,6 +376,8 @@
			StationName2:$("#city").val(),
			StationName5:$("#county").val(),
			};
			var pre_home = getQueryString('home');
			var auto_seach = false;
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -367,15 +400,23 @@
			dev_id: _data.FBSDeviceId
			};
			var _tmp = getLayuiSelect(_data.StationName, _data.StationName3, _attr, _data);
			if(pre_home == _data.StationName && isNewLoad){
			_tmp = getLayuiSelect(_data.StationName, _data.StationName3, _attr, _data,true);
			auto_seach = true;
			}
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无机房', '', {}, undefined));
			}

			// 根据对象数组生成下拉列表
			createLayuiSelect(ele, list);
			form.render('select', 'homeFilter');
			if(auto_seach){
			var temp = createSearchForm();
			sTblData(temp);
			}
			isNewLoad = false;

			}
			});
			@@ -413,12 +454,12 @@
			});

			// 切换数据显示类型
			var echartsCont = $('#echarts-container');
			form.on('switch(dataType)', function(data){
			console.log(this.checked);
			if(this.checked) {
			layer.msg('我是折线图');
			echartsCont.removeClass('abs-index1n');
			}else {
			layer.msg('我是表格！');
			echartsCont.addClass('abs-index1n');
			}
			});

			@@ -440,7 +481,7 @@
			layer.close(loading);
			// 解析获取的json
			var rs = JSON.parse(result.result);
			console.info(rs);
			//console.info(rs);
			// 初始化数据结果
			tOptions.data = [];
			if(rs.code == 1) {
			@@ -469,7 +510,12 @@

			// 生成表格数据
			table.render(tOptions);
			console.log(getLineData());

			// 获取类型
			var type = sData.num;
			var lineData = getLineData(type);
			var lineGraphOpts = getlineGraphOpts(lineData, type)
			createLine(lineGraph, lineGraphOpts);
			}
			});
			}
			@@ -487,12 +533,12 @@
			}

			// 处理并返回生成折线图的数据
			function getLineData() {
			function getLineData(type) {
			var rs = {
			x: [],
			y:[]
			};
			var type = $('#statistics').val();

			// 遍历allData的值
			for(var i=0; i<allData.length; i++) {
			var _allData = allData[i];
			@@ -544,6 +590,35 @@

			return rs;
			}

			// 获取生成折线图的配置项
			function getlineGraphOpts(data, type) {
			//console.log(data);
			var rs = {
			xdata:[],
			sdata: [],
			};
			rs.xdata = data.x;
			rs.sdata.push(data.y);
			rs.tname = '流量统计';
			rs.lname = ["使用流量"];
			switch(type) {
			case '3':
			rs.subtxt = '按年统计';
			rs.unit = "G";
			break;
			case '1':
			rs.subtxt = '按月统计';
			rs.unit = "M";
			break;
			default:
			rs.subtxt = '按天统计';
			rs.unit = "M";
			break;
			}
			//console.log(rs);
			return rs;
			}
			});
			</script>
			</body>