<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<title>蓄电池信息配置管理</title>
|
<link rel="stylesheet" type="text/css" href="css/basic.css" />
|
<link rel="stylesheet" type="text/css" href="css/query.css" />
|
<link rel="stylesheet" type="text/css" href="css/popup-tbl.css" />
|
<link rel="stylesheet" type="text/css" href="jqueryui/jquery-ui.css">
|
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
|
<script type="text/javascript" src="jqueryui/jquery-ui.js"></script>
|
<style type="text/css" media="screen">
|
.revise{
|
color: #293EF6;
|
}
|
|
.revise .revise-none {
|
color: #000;
|
}
|
|
.revise .revise-ipt-active{
|
padding: 0;
|
}
|
|
.revise .revise-ipt-active input {
|
width: 100%;
|
height: 100%;
|
}
|
|
.revise .revise-time {
|
color: #61FD47;
|
}
|
|
.revise .revise-sel {
|
color: #F8DD08;
|
}
|
</style>
|
</head>
|
<body>
|
<!--头部内容开始-->
|
<div id="top">
|
<div id="top_cont">
|
<img src="image/tieta-logo.gif" alt="" title="铁塔" />
|
<!--用户登录后显示用户名鼠标经过显示下拉菜单-->
|
<div id="sign_out">
|
<a href="#" id="user_name">霍东伟<span class="triangle"></span></a>
|
<ul>
|
<li><a href="pwdChange.html" target="_blank">密码修改</a></li>
|
<li><a href="#">退出</a></li>
|
</ul>
|
</div>
|
<!--结束-->
|
</div>
|
</div>
|
<!--头部内容结束-->
|
<div id="main">
|
<!--导航开始-->
|
<div id="nav"></div>
|
<!-- 查询条件开始 -->
|
<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>
|
</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:;" class="export">导出</a>
|
<a href="javascript:;" class="new-item">新建</a>
|
<a href="javascript:;" class="reflush">刷新</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" src="js/query.js"></script>
|
<script type="text/javascript" src="js/rightmenu.js"></script>
|
<script type="text/javascript">
|
var arrTh = new Array();
|
var arrTd = new Array();
|
arrTh = [
|
'机房编号', '城市', '区县', '机房名称', '设备名称', '机房IP', 'FBS设备ID(重要)',
|
'FBS设备IP(重要)', 'FBS设备名称', 'FBS电池索引(0-3)', '电池组ID', '机房内电池组编号', '电池组名称', '浮充电压阀值(V)',
|
'离线电压阀值(V)', '浮充电流阀值(A)', '单体数量', '标称容量(AH)', '标称单体电压(V)', '标称单体内阻(mΩ)', '标称单体电导',
|
'单体电压次低偏移量(V)', '电池品牌', '电池型号', '电池生产日期', '投入使用日期'
|
];
|
|
for(var i =0; i < 100; i++) {
|
for(var j = 0; j < arrTh.length; j++) {
|
arrTd.push(arrTh[j]+i);
|
}
|
}
|
|
// 生成表格
|
$(function() {
|
createFullTbl($('.tbl-header'), $('.tbl-body'), arrTh, arrTd);
|
|
$('.tbl-body').scroll(function() {
|
setTblWidth($('.tbl-header'), $('.tbl-body'));
|
});
|
});
|
|
// 右键菜单功能
|
$(function() {
|
$('.tbl-body').get(0).oncontextmenu=function(){
|
return false;
|
};
|
|
//添加右键内容
|
var menuItems=[
|
{txt:'确定', cla:'ensure'},
|
{txt:'修改', cla:'revise'}
|
];
|
|
// 给表格添加自己的右键菜单
|
$('.tbl-body').on('mousedown','table tbody tr',function(e){
|
var trIndex = $(this).index(); // 获取当前行
|
$('.tbl-body table tbody tr').removeClass('active');
|
$(this).addClass('active')
|
if (e.which == 3) {
|
var disX = (e || event).clientX + 10; //获取鼠标点击的横坐标
|
var disY = (e || event).clientY + 10; // 获取鼠标点击的纵坐标
|
|
rightMenu.showMenu(menuItems, disX, disY);
|
}
|
|
// 点击修改给激活的td添加特殊的class
|
$('body').on('click', '#rightMenu .revise', function() {
|
addClassToTd();
|
});
|
});
|
});
|
|
// 点击表格内要修改的位置触发的事件
|
$(function() {
|
var hdTr = $('.tbl-header table tbody tr');
|
$('.tbl-body').on('dblclick', 'table tbody .revise .revise-ipt', function() {
|
var txt = $(this).text();
|
|
|
$(this).html('<input type="text" name="" value="'+txt+'">');
|
hdTr.eq($(this).parent().index()).find('td').eq($(this).index()).html('<input type="text" name="" value="'+txt+'">');
|
|
$(this).addClass('revise-ipt-active').removeClass('revise-ipt');
|
hdTr.eq($(this).parent().index()).find('td').eq($(this).index()).addClass('revise-ipt-active').removeClass('revise-ipt');
|
});
|
|
$('.tbl-body').on('click', 'table tbody td', function() {
|
if(!$(this).hasClass('revise-ipt-active')) {
|
var valIpt =$('.tbl-body table tbody .revise-ipt-active input').val();
|
$('.tbl-body table tbody .revise-ipt-active').text(valIpt).addClass('revise-ipt').removeClass('revise-ipt-active');
|
$('.tbl-header table tbody .revise-ipt-active').text(valIpt).addClass('revise-ipt').removeClass('revise-ipt-active');
|
}
|
});
|
});
|
|
// 给td特定列的td添加class
|
function addClassToTd() {
|
var activeTr = $('.tbl-body table tbody tr.active');
|
var hdTr = $('.tbl-header table tbody tr').eq(activeTr.index());
|
|
activeTr.addClass('revise');
|
hdTr.addClass('revise');
|
var addC = '';
|
for(var i = 0; i < activeTr.find('td').length; i++) {
|
if(i == 9) {
|
addC = 'revise-sel';
|
}else if(i==10 || i==11) {
|
addC = 'revise-none';
|
}else if(i==24 || i==25){
|
addC = 'revise-time';
|
}else {
|
addC = 'revise-ipt';
|
}
|
|
activeTr.find('td').eq(i).addClass(addC);
|
hdTr.find('td').eq(i).addClass(addC);
|
}
|
}
|
|
// 恢复表格的内容
|
function recoveryTbl(ele) {
|
ele.each(function(){});
|
}
|
</script>
|
</body>
|
</html>
|
