<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<title>设备充放电模块参数</title>
|
<link href="css/basic.css" type="text/css" rel="stylesheet" />
|
<link rel="stylesheet" type="text/css" href="css/query.css">
|
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
|
</head>
|
<body>
|
|
<!--头部内容结束-->
|
<div id="main">
|
<!-- 查询条件开始 -->
|
<div class="query-list">
|
<div class="query-header"><a href="javascript:;">电池放电测试查询条件</a></div>
|
<!-- 查询条件内容开始 -->
|
<div class="query-body">
|
<table>
|
<thead>
|
<tr>
|
<th>维护区</th>
|
<th>机房站点</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr>
|
<td>
|
<select>
|
<option value="">全部</option>
|
<option value="">维护区1</option>
|
<option value="">维护区2</option>
|
<option value="">维护区3</option>
|
</select>
|
</td>
|
<td>
|
<select>
|
<option value="">全部</option>
|
<option value="">机房站点1</option>
|
<option value="">机房站点2</option>
|
<option value="">机房站点3</option>
|
</select>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
<!-- 查询条件内容结束 -->
|
</div>
|
<!-- 查询条件结束 -->
|
<!-- 查询结果开始 -->
|
<div class="tbl-header"></div>
|
<div class="tbl-body"></div>
|
<!-- 查询结果结束 -->
|
<!-- 分页内容 -->
|
<div id="paging">
|
<a href="javascript:" class="search">查询</a>
|
<a href="javascript:;">导出</a>
|
<span id="current">当前1/4</span>
|
<span>每页<input type="text" id="number"/>条</span>
|
<span id="total">数据总量 10</span>
|
<a href="javascript:" id="home">首页</a>
|
<a href="javascript:" id="pre">上一页</a>
|
<a href="javascript:" id="next_p">下一页</a>
|
<a href="javascript:" id="last">尾页</a>
|
</div>
|
</div>
|
<script type="text/javascript" src="js/buildNav.js"></script>
|
<script type="text/javascript" src="js/createTab.js"></script>
|
<script type="text/javascript">
|
var arrTh = new Array();
|
var arrTd = new Array();
|
arrTh = [
|
'端口电压', 'DCDC输出电压', '电池电压', '放电电流', '充电电流',
|
'放电温度', '充电温度', '告警标志位1', '告警标志位2', '版本', '工作模式设定',
|
'启动/停止', '充电电流', '放电电压', '放电电流'
|
];
|
|
// 初始化页面内容
|
$(function() {
|
initPageHt();
|
// 当页面大小改变后执行内容
|
$(window).resize(function() {
|
initPageHt();
|
setTblWidth($('.tbl-header'), $('.tbl-body'));
|
});
|
|
// 表格滚动同步
|
$('.tbl-body').scroll(function() {
|
setTblWidth($('.tbl-header'), $('.tbl-body'));
|
});
|
|
// 点击条件筛选显示和隐藏内容
|
var queryBodyHt = $('.query-list .query-body').height();
|
$('.query-list .query-header').click(function() {
|
queryToggle(queryBodyHt);
|
});
|
|
// 生成表格
|
createFullTbl($('.tbl-header'), $('.tbl-body'), arrTh, arrTd);
|
});
|
|
|
// 初始化页面高度
|
function initPageHt() {
|
var winHt = $(window).height();
|
var bodyHt = $('body').height();
|
var shiftHt = winHt - bodyHt;
|
var tblHt = $('.tbl-body').height() + shiftHt;
|
if(tblHt > 300) {
|
$('.tbl-body').height(tblHt);
|
}
|
|
}
|
|
// 隐藏表格功能按钮列表
|
function toggleBtnList() {
|
var btnList = $('.btn-list');
|
if(btnList.hasClass('hide')) {
|
btnList.removeClass('hide');
|
}else {
|
btnList.addClass('hide');
|
}
|
|
}
|
|
// 显示和隐藏查询条件
|
function queryToggle(ht) {
|
var queryBody = $('.query-list .query-body');
|
var tblBodyHt = $('.tbl-body').height();
|
|
if(queryBody.hasClass('collapsed')) {
|
queryBody.removeClass('collapsed');
|
$('.tbl-body').height(tblBodyHt - ht);
|
queryBody.slideDown(function() {
|
initPageHt();
|
});
|
}else {
|
queryBody.addClass('collapsed');
|
queryBody.slideUp(function() {
|
$('.tbl-body').height(tblBodyHt + ht);
|
});
|
}
|
}
|
</script>
|
</body>
|
</html>
|
