$(function() {
|
initPage(); // 初始化页面高度
|
|
// 设置页面的左侧可以左右缩放
|
$('.page-content .content-item.side-bar-container').resizable({
|
'minWidth': 230,
|
'maxWidth': 400,
|
'containment': 'parent'
|
});
|
|
$(window).resize(function() {
|
initPage();
|
});
|
});
|
|
// 初始化页面的高度
|
function initPage() {
|
var winHt = $(window).height();
|
var bodyHt = $('body').height();
|
var minHt = 400;
|
var contentHt = $('.page-content').height();
|
var realHt = winHt - bodyHt + contentHt - 32;
|
if(realHt > 400) {
|
$('.page-content').height(realHt);
|
}else {
|
$('.page-content').height(400);
|
}
|
|
// 初始化表格的高度
|
if($('.tbl-body').length != 0) {
|
initTblBody();
|
}
|
|
if($('.data-container-body').length != 0) {
|
initDataContianer();
|
}
|
}
|
|
// 定义表格的高度
|
function initTblBody() {
|
var containHt = $('.data-show .data-container').height();
|
var filterHt = $('.filter-container').height();
|
var tblHeaderHt = $('.tbl-header').height();
|
var dataFooter = $('.data-footer').height();
|
var realHt = containHt - filterHt - tblHeaderHt - dataFooter;
|
$('.tbl-body').height(realHt);
|
setTblWidth($('.tbl-header'), $('.tbl-body'));
|
}
|
|
//定义data-container内结构的高度
|
function initDataContianer() {
|
var containHt = $('.data-show .data-container').height();
|
var dataContHeaderHt = $('.data-container-header').height();
|
var dataContFooterHt = $('.data-container-footer').height();
|
var realHt = containHt - dataContHeaderHt - dataContFooterHt;
|
$('.data-container-body').height(realHt);
|
}
|
|
// 点击筛选按钮显示或隐藏筛选条件
|
function changeFilterStats() {
|
$('.filter-container .filter-content').slideToggle(function() {
|
initTblBody();
|
});
|
}
|
//定义一个自动创建表格的函数
|
//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);
|
}
|
|
|
//生成列表
|
function createLiList(ele, options) {
|
var defaults = {
|
txt: [],
|
val:[]
|
}
|
this.opts = $.extend({}, defaults, options||{});
|
|
// 如果没有val值就用文本值代替
|
if(this.opts.val.length == 0) {
|
this.opts.val = this.opts.txt;
|
}
|
var _ul = '<ul></ul>';
|
// 遍历txt值生成列表元素
|
for(var i=0; i<this.opts.txt.length; i++) {
|
_ul +='<li>';
|
_ul += '<a href="javascript:;" value="'+this.opts.val[i]+'">'+this.opts.txt[i]+'</a>';
|
_ul +='</li>';
|
}
|
_ul += '</ul>';
|
ele.html(_ul);
|
}
|