~whychwj/haha.git

			@@ -13,7 +13,7 @@

			<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10" />
			<meta charset="UTF-8">
			<title>电池组配组管理</title>
			<title>电池组配组记录</title>
			<meta http-equiv="pragma" content="no-cache">
			<meta http-equiv="cache-control" content="no-cache">
			<meta http-equiv="expires" content="0">
			@@ -23,6 +23,7 @@
			<link rel="stylesheet" type="text/css" href="css/basic.css" />
			<link rel="stylesheet" href="css/common.css">
			<link rel="stylesheet" href="pages/css/common.css">
			<link rel="stylesheet" href="pages/css/mylayui.css">
			<style type="text/css">
			html, body {
			height: 100%;
			@@ -59,7 +60,14 @@
			<div class="layui-input-inline">
			<div class="layui-form" lay-filter="cityFilter">
			<select name="city" id="city" lay-filter="city">
			<option value="">请选择市/区</option>
			<option value="">请选择市</option>
			</select>
			</div>
			</div>
			<div class="layui-input-inline">
			<div class="layui-form" lay-filter="countyFilter">
			<select name="county" id="county" lay-filter="county">
			<option value="">请选择区/县</option>
			</select>
			</div>
			</div>
			@@ -69,18 +77,17 @@
			<option value="">请选择机房</option>
			</select>
			</div>

			</div>
			<div class="layui-input-inline">
			<div class="layui-form" lay-filter="groupFilter">
			<select name="group" id="group" lay-filter="group" lay-search="">
			<select name="group" id="group" lay-filter="group">
			<option value="">请选择电池组</option>
			</select>
			</div>

			</div>
			</div>
			<button class="layui-btn layui-btn-sm layui-btn-normal" id="search"><i class="fa fa-search"></i> 查询</button>
			<button class="layui-btn layui-btn-sm" id="search"><i class="fa fa-search"></i> 查询</button>
			</div>

			</div>
			@@ -90,19 +97,19 @@
			</div>
			</div>
			</div>
			<div id="setMatchGroupData"></div>
			<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
			<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/html" id="toolBar">
			<a class="layui-btn layui-btn-xs" lay-event="replace">更换</a>
			<a class="layui-btn layui-btn-xs" lay-event="matchGroup">配组</a>
			</script>
			<script type="text/javascript">
			layui.use(['layer', 'table', 'form', 'laytpl', 'element'],function() {
			var layer = layui.layer // 获取layer模块
			,table = layui.table // 获取table模块
			,form = layui.form
			,laytpl = layui.laytpl
			,element = layui.element;
			,form = layui.form;
			// 表格数据配置项
			var tOptions = {
			elem: '#groupTbl'
			@@ -116,8 +123,6 @@
			,{field:'brandname', title:'品牌名称', align:'center'}
			,{field:'nominalcap', title:'标称容量', align:'center'}
			,{field:'monvol', title:'标称电压（V）', align:'center'}
			,{field:'relcap', title:'实际容量', align:'center'}
			,{field:'percap', title:'容量百分比(%)', align:'center'}
			,{fixed: 'right', title:'操作', toolbar: '#toolBar', width: 70}
			]]
			,data:[]
			@@ -132,33 +137,112 @@

			// 点击查询根据查询条件获取电池组的单体列表
			$('#search').click(function() {
			var data = [{stationname: 'xxx'},{stationname: 'enen'}];
			var num = data.length;
			tOptions.data = data;
			// 设置分页信息
			// tOptions.page.layout = ['count', 'prev', 'page', 'next']; //自定义分页布局
			tOptions.page.limit = num;
			tOptions.page.limits = [num];
			// 重新绘制表格
			table.reload('groupTbl', tOptions);
			var groupData = $('#group').find('option:selected').data('data');
			// 判断是否已经选中电池组
			if(groupData) {
			searchData(groupData);
			}else {
			tOptions.data = [];
			table.render(tOptions);
			layer.msg('请选择一组电池');
			}
			});

			// 查询电池组下所有的单体
			function searchData(obj) {
			// 添加等待框
			var loading = layer.load(0, {shade: [0.1,'#fff']}); //0代表加载的风格，支持0-2
			var structData = structSearchData(obj);
			$.ajax({
			type: 'post',
			async: true,
			url:'BattInfAction!serchGroupByInfor',
			data: 'json='+JSON.stringify(structData),
			dataType: 'json',
			success: function(result) {
			layer.close(loading); // 关闭等待框
			var rs = JSON.parse(result.result);
			if(rs.code == 1) {
			var data = rs.data;
			var num = 0;
			var rsData = formaterTblData(data);
			num = rsData.length;
			tOptions.data = rsData;
			// 设置分页信息
			tOptions.page.layout = ['count', 'prev', 'page', 'next']; //自定义分页布局
			tOptions.page.limit= num;
			tOptions.page.limits = [num];
			}
			// 重新绘制表格内容
			table.reload('groupTbl', tOptions);
			}
			});
			}

			// 构造查询对象
			function structSearchData(data) {
			var obj = {};
			obj.StationName1 = '';
			obj.StationName2 = '';
			obj.StationName5 = '';
			obj.StationName3 = '';
			obj.BattGroupName = '';
			obj.BattGroupId = data.BattGroupId;
			return obj;
			}

			// 构造生成表格数据的方法
			function formaterTblData(data) {
			var rs = []; // 结果集
			console.log(data);
			// 遍历查询的结果根据查询结果生成指定的格式
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var obj = {};
			obj.stationname = _data.StationName; // 机房名称
			obj.groupname = _data.BattGroupName; // 电池组名称
			obj.monvol = _data.MonVolStd; // 标称电压
			obj.nominalcap = Number(_data.MonCapStd); // 标称容量
			obj.monnum = '#'+_data.MonNum; // 单体编号
			obj.brandname = _data.BattProducer; // 品牌
			// 不显示内容
			obj.num = _data.MonNum; // 单体编号不加#
			obj.battgroupid = _data.BattGroupId; // 电池组id
			obj.stationid = _data.StationId; // 机房id
			rs.push(obj);
			}

			return rs; // 返回结果集
			}

			// 点击表格工具栏更换
			table.on('tool(groupTbl)', function(obj) {
			var event = obj.event;
			switch(event) {
			case 'replace':
			showReplacePanel();
			case 'matchGroup':
			showMatchGroupPanel(obj.data);
			break;
			}
			});

			// 显示更换电池单体面板
			function showReplacePanel() {

			function showMatchGroupPanel(obj) {
			$('#setMatchGroupData').data('data', obj);
			// 设置弹出框的title的值
			var txt = obj.stationname+'-'+obj.groupname+'-'+obj.monnum+'('+obj.brandname+')';
			// 显示面板
			layer.open({
			type: 2,
			title: '<span style="font-weight:bold">配组：</span>'+txt,
			area: ['1200px', '500px'],
			fixed: false, //不固定
			maxmin: true,
			content: 'iframe/set-match-group.html'
			});
			}

			// 查询省下拉框
			var filterLoad = layer.load();
			searchProvince();
			// 查询省
			function searchProvince() {
			@@ -175,7 +259,7 @@
			var ele = $('#province'); // 目标select
			if(rs.code == 1) {
			var data = rs.data;
			list.push(getLayuiSelect('请选择省/直辖市', '', {}, {}));
			list.push(getLayuiSelect('请选择省/直辖市', '', {}, undefined));
			// 遍历查询结果
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			@@ -183,7 +267,7 @@
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无省/直辖市', '', {}, {}));
			list.push(getLayuiSelect('暂无省/直辖市', '', {}, undefined));
			}

			// 根据对象数组生成下拉列表
			@@ -199,15 +283,19 @@
			// 切换省-市
			form.on('select(province)', function(data) {
			// 查询市
			searchCity();
			searchCity(true);
			});

			// 查询市
			function searchCity() {
			function searchCity(isLoad) {
			// 构造查询条件
			var tmp = {
			StationName1: $("#province").val()
			};
			// 是否添加等待
			if(isLoad) {
			filterLoad = layer.load();
			}
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -221,7 +309,7 @@
			var ele = $('#city'); // 目标select
			if(rs.code == 1) {
			var data = rs.data;
			list.push(getLayuiSelect('请选择市/区', '', {}, {}));
			list.push(getLayuiSelect('请选择市', '', {}, undefined));
			// 遍历查询结果
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			@@ -229,12 +317,56 @@
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无市/区', '', {}, {}));
			list.push(getLayuiSelect('暂无市', '', {}, undefined));
			}

			// 根据对象数组生成下拉列表
			createLayuiSelect(ele, list);
			form.render('select', 'cityFilter');
			// 查询区/县
			searchCounty();
			}
			});
			}

			// 查询区/县
			function searchCounty(isLoad) {
			// 构造查询条件
			var tmp = {
			StationName1: $("#province").val(),
			StationName2: $("#city").val()
			};
			// 是否添加等待
			if(isLoad) {
			filterLoad = layer.load();
			}
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			async: true,
			url: 'BattInfAction!serchStationName5',
			dataType: 'json',
			data: "json = "+JSON.stringify(tmp),
			success: function(result) {
			var rs = JSON.parse(result.result);
			var list = []; // option结果集
			var ele = $('#county'); // 目标select
			if(rs.code == 1) {
			var data = rs.data;
			list.push(getLayuiSelect('请选择区/县', '', {}, undefined));
			// 遍历查询结果
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var _tmp = getLayuiSelect(_data.StationName5, _data.StationName5, {}, _data);
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无区/县', '', {}, undefined));
			}

			// 根据对象数组生成下拉列表
			createLayuiSelect(ele, list);
			form.render('select', 'countyFilter');

			// 查询机房
			searchHome();
			@@ -242,19 +374,31 @@
			});
			}

			// 切换市-机房

			// 切换市-区/县
			form.on('select(city)', function(data) {
			// 查询区/县
			searchCounty(true);
			});

			// 切换区/县-机房
			form.on('select(county)', function(data) {
			// 查询机房
			searchHome();
			searchHome(true);
			});

			// 查询机房
			function searchHome() {
			function searchHome(isLoad) {
			// 构造查询条件
			var tmp = {
			StationName1:$("#province").val(),
			StationName2:$("#city").val()
			StationName2:$("#city").val(),
			StationName5:$("#county").val()
			};
			// 是否添加等待
			if(isLoad) {
			filterLoad = layer.load();
			}
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -268,18 +412,18 @@
			var ele = $('#home'); // 目标select
			if(rs.code == 1) {
			var data = rs.data;
			list.push(getLayuiSelect('请选择机房', '', {StationId: ''}, {}));
			list.push(getLayuiSelect('请选择机房', '', {StationId: ''}, undefined));
			// 遍历查询结果
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			var _attr = {
			StationId: _data.StationId
			};
			var _tmp = getLayuiSelect(_data.StationName3, _data.StationName, _attr, _data);
			var _tmp = getLayuiSelect(_data.StationName, _data.StationName, _attr, _data);
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无机房', '', {}, {}));
			list.push(getLayuiSelect('暂无机房', '', {}, undefined));
			}

			// 根据对象数组生成下拉列表
			@@ -299,14 +443,19 @@
			});

			// 查询机房
			function searchGroup() {
			function searchGroup(isLoad) {
			// 构造查询条件
			var tmp = {
			StationName1:$("#province").val(),
			StationName2:$("#city").val(),
			StationName5:$("#county").val(),
			StationName: $("#home").val(),
			StationId: $("#home").find('option:selected').attr('stationid')
			};
			// 是否添加等待
			if(isLoad) {
			filterLoad = layer.load();
			}
			// 根据构造条件查询内容
			$.ajax({
			type: 'post',
			@@ -320,7 +469,7 @@
			var ele = $('#group'); // 目标select
			if(rs.code == 1) {
			var data = rs.data;
			list.push(getLayuiSelect('请选择电池组', '0', {}, {}));
			list.push(getLayuiSelect('请选择电池组', '', {}, undefined));
			// 遍历查询结果
			for(var i=0; i<data.length; i++) {
			var _data = data[i];
			@@ -334,53 +483,15 @@
			list.push(_tmp);
			}
			}else {
			list.push(getLayuiSelect('暂无机房', '', {}, {}));
			list.push(getLayuiSelect('暂无电池组', '', {}, undefined));
			}

			layer.close(filterLoad);
			// 根据对象数组生成下拉列表
			createLayuiSelect(ele, list);
			form.render('select', 'groupFilter');
			}
			});
			}

			// 生成特定的select列表
			function createLayuiSelect(ele, list) {
			// 清空内容
			ele.text('');
			// 遍历list结果集生成下拉
			for(var i=0; i<list.length; i++) {
			var _list = list[i];
			var option = $('<option></option>'); // option元素
			// 设置option的文本/属性值/data值
			option.text(_list.txt);
			option.val(_list.val);
			option.data('data', _list.data);
			Object.keys(_list.attr).forEach(function(key){
			var val = _list.attr[key];
			option.attr(key, val);
			});
			ele.append(option);
			}
			}

			// 构造生成select列表的对象数组
			function getLayuiSelect(txt, val, attr, data) {
			var obj = {
			val: '',
			txt: '',
			attr: {},
			data: {}
			};

			// 设置内容的值
			obj.val = val; // option的value值
			obj.txt = txt; // option的文本值
			obj.attr = attr; // option的自定义的属性
			obj.data = data; // option的data值

			// 返回构造的对象
			return obj;
			}
			});
			</script>