// 页面的初始化
|
$(function() {
|
initPage();
|
$(window).resize(function() {
|
initPage();
|
setTblWidth($('.tbl-header'), $('.tbl-body'));
|
});
|
// 点击条件筛选显示和隐藏内容
|
var queryBodyHt = $('.query-list .query-body').height();
|
$('.query-list .query-header').click(function() {
|
queryToggle(queryBodyHt);
|
});
|
});
|
|
// 点击表格选项显示表格选项和遮罩层
|
function showTblOpt(optStatus) {
|
console.info(optStatus);
|
// 获取表表格选项的复选框
|
var _checkbox = $('.tbl-opt .tbl-content-body table tbody').find('input[type="checkbox"]');
|
// 根据optstatus的值确定复选框是否被选中
|
for(var i = 0; i < optStatus.length; i++) {
|
if(optStatus[i] == 1) {
|
_checkbox.eq(i).prop('checked', true);
|
}else {
|
_checkbox.eq(i).prop('checked', false);
|
}
|
}
|
|
// 显示表格选项和遮罩层
|
$('.tbl-opt').addClass('show').removeClass('hide');
|
$('.tbl-opt-mask').show();
|
|
// 使表格上下对齐
|
setTblWidth($('.tbl-opt .tbl-content-header'), $('.tbl-opt .tbl-content-body'));
|
}
|
|
|
// 隐藏表格选项和遮罩层
|
function hideTblOpt() {
|
$('.tbl-opt').addClass('hide').removeClass('show');
|
$('.tbl-opt-mask').hide();
|
}
|
|
//对于弹出窗口串口进行定位(position:fixed)
|
function centerDiv(ele){
|
//获取屏幕的高度对弹出窗口进行定位
|
var srnHei=$(window).height(); //屏幕的高度
|
var eleHei=ele.height(); //弹出窗口的高度
|
var topHei=parseInt((srnHei-eleHei)/2); //获取居中高度
|
ele.css({
|
'top':topHei
|
});
|
}
|
|
// 隐藏表格功能按钮列表
|
function toggleBtnList() {
|
var btnList = $('.btn-list');
|
if(btnList.hasClass('hide')) {
|
btnList.removeClass('hide');
|
}else {
|
btnList.addClass('hide');
|
}
|
|
}
|
|
// 初始化页面高度
|
function initPage() {
|
var winHt = $(window).height();
|
var bodyHt = $('body').height();
|
var shiftHt = winHt - bodyHt;
|
var tblHt = $('.tbl-body').height();
|
var resultHt = tblHt + shiftHt - 32;
|
|
if(shiftHt > 0 || resultHt > 300) {
|
$('.tbl-body').height(resultHt);
|
}else {
|
$('.tbl-body').height(300);
|
}
|
}
|
|
/**
|
* 显示和隐藏查询条件
|
* @param num ht 查询条件筛选的高度
|
*/
|
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() {
|
initPage();
|
});
|
}else {
|
queryBody.addClass('collapsed');
|
queryBody.slideUp(function() {
|
$('.tbl-body').height(tblBodyHt + ht);
|
});
|
}
|
}
|
|
// 根据表格的头部获取表格选项内容
|
function getTblOptCont(arrTh) {
|
var tblOptTd = new Array();
|
for(var i = 0; i < arrTh.length; i++) {
|
tblOptTd.push(i+1);
|
tblOptTd.push(arrTh[i]);
|
tblOptTd.push('<input type="checkbox" checked="checked"/>');
|
}
|
return tblOptTd;
|
}
|
|
// 根据表格选项的复选框状态获取状态数组的值
|
function getOptStatus() {
|
// 获取表表格选项的复选框
|
var _checkbox = $('.tbl-opt .tbl-content-body table tbody').find('input[type="checkbox"]');
|
var _optStatus = new Array();
|
// 遍历表格选项的复选框
|
_checkbox.each(function(i) {
|
if($(this).is(':checked')) {
|
_optStatus.push(1);
|
}else {
|
_optStatus.push(0);
|
}
|
});
|
return _optStatus;
|
}
|
|
//定义一个自动创建表格的函数
|
//ThArr表格的头数据，TdArr表格的单元格数据
|
function createTablenew(ele,ThArr,TdArr){
|
ele.children('table').remove();
|
var _table=$('<table></table>');
|
var _thead=$('<thead></thead>');
|
var _tbody=$('<tbody></tbody>');
|
var ThArray=new Array(); //设置th的数组
|
var TrArray=new Array(); //设置tr的数组
|
var TdArray=new Array(); //设置td的数组
|
var TdLength; //获取单元格个数
|
var TrLength; //获取行数
|
TdLength=TdArr.length;
|
TrLength=Math.ceil(TdLength/ThArr.length);
|
// 给每个th设置值
|
for(var i=0;i<ThArr.length;i++)
|
{
|
ThArray[i]=$("<th>"+ThArr[i]+"</th>");
|
}
|
// 给每个td设置值
|
for(var i=0;i<TdLength;i++)
|
{
|
TdArray[i]=$("<td>"+TdArr[i]+"</td>");
|
}
|
//设置tr
|
for(var i=0;i<TrLength;i++)
|
{
|
TrArray[i]=$("<tr></tr>");
|
}
|
//将td以col个赋给tr
|
var n=0;
|
for(var i=0;i<TrLength;i++)
|
{
|
for(var k=0;k<ThArr.length;k++)
|
{
|
TrArray[i].append(TdArray[n]);
|
n++;
|
}
|
}
|
//给th赋给thead
|
for(var i=0;i<ThArr.length;i++)
|
{
|
_thead.append(ThArray[i]);
|
}
|
_table.append(_thead);
|
// 将tr赋给table
|
for(var i=0;i<TrLength;i++)
|
{
|
_tbody.append(TrArray[i]);
|
}
|
_table.append(_tbody);
|
//将table添加到指定的容器中
|
ele.append(_table);
|
}
|
|
|
//通过表格选项的值返回表头数据
|
function getArrTh(__stateArr,__arrTh){
|
var __thIndex=0; //新表头数据的下标
|
var __newTh=new Array(); //存储新的表头数据
|
for(var i=0;i<__arrTh.length;i++)
|
{
|
if(__stateArr[i]==1)
|
{
|
__newTh[__thIndex]=__arrTh[i];
|
__thIndex++;
|
}
|
}
|
return __newTh;
|
}
|
//通过表格选项的值返回表内数据
|
function getArrTd(__stateArr,__arrTd){
|
var __tdIndex=0;
|
var __newTd=new Array();
|
for(var i=0;i<__arrTd.length;i++)
|
{
|
var stateIndex=i%__stateArr.length; //获取stateArr的下标
|
if(__stateArr[stateIndex]==1)
|
{
|
__newTd[__tdIndex]=__arrTd[i];
|
__tdIndex++;
|
}
|
}
|
return __newTd;
|
}
|
|
|
/*
|
创建表格
|
@param jquery对象 eleHead 表格头部容器
|
@param jquery对象 eleBody 表格body容器
|
@param array thList 表格头部数据
|
@param array tdList 表格body数据
|
@param array status 表格状态数组(没有则默认全部显示)
|
*/
|
function createFullTbl(eleHead, eleBody, thList, tdList, status) {
|
if(arguments.length < 5) {
|
var status = new Array();
|
for(var i = 0; i < thList.length; i++) {
|
status.push(1);
|
}
|
}
|
var arrNewTh = getArrTh(status, thList);
|
var arrNewTd = getArrTd(status, tdList);
|
|
createTablenew(eleHead, arrNewTh, arrNewTd);
|
createTablenew(eleBody, arrNewTh, arrNewTd);
|
|
setTblWidth(eleHead, eleBody);
|
}
|
|
/*
|
使表格的头部和body内容对齐
|
@param jquery对象 eleHead 表格头部容器
|
@param jquery对象 eleBody 表格body容器
|
*/
|
function setTblWidth(tbHead, tbBody) {
|
var tblBdWd = tbBody.find('table').width();
|
tbHead.find('table').width(tblBdWd);
|
var tbScrollLeft = tbBody.scrollLeft();
|
tbHead.find('table').css('left', -tbScrollLeft + 'px');
|
}
|
|
// 向已有的表格添加td
|
function addTr(ele, TdArr) {
|
var _tbody=ele.find('tbody');
|
var TdArray=new Array(); //设置td的数组
|
// 给每个td设置值
|
for(var i=0;i<TdArr.length;i++)
|
{
|
TdArray[i]=$("<td>"+TdArr[i]+"</td>");
|
}
|
var _tr = $('<tr></tr>');
|
_tr.append(TdArray);
|
//将tr添加到tbody的容器中
|
_tbody.append(_tr);
|
}
|
|
/*
|
创建表格
|
@param jquery对象 eleHead 表格头部容器
|
@param jquery对象 eleBody 表格body容器
|
@param array thList 表格头部数据
|
@param array tdList 表格body数据
|
@param array status 表格状态数组(没有则默认全部显示)
|
*/
|
function addFullTr(eleHead, eleBody, thList, tdList, status) {
|
if(arguments.length < 5) {
|
var status = new Array();
|
for(var i = 0; i < thList.length; i++) {
|
status.push(1);
|
}
|
}
|
var arrNewTd = getArrTd(status, tdList);
|
addTr(eleHead, arrNewTd);
|
addTr(eleBody, arrNewTd);
|
|
setTblWidth(eleHead, eleBody);
|
}
|
