/**
|
* 展开和折叠内容
|
* @param jquery container 容器
|
* @param object content 列表内容
|
* content = [
|
* {title: str, items:[
|
* {txt: str, val: str_num},
|
* {txt: str, val: str_num},
|
* {txt: str, val: str_num}
|
* ]}
|
* ];
|
*/
|
function collapse(container, content) {
|
container.text(" "); // 清空容器内容
|
for(var i = 0; i < content.length; i++) {
|
var collapse = getCollapse(content[i].title, content[i].items);
|
container.append(collapse);
|
}
|
}
|
|
/**
|
* 获取collapse
|
* @param string title 标题内容
|
* @param array items 数据内容列表数据
|
* @return jquery collapse 返回折叠内容
|
*/
|
function getCollapse(title, items) {
|
// 添加标题内容
|
var collapse = $('<div class="collapse"></div>');
|
var collapse_hd = $('<div class="collapse-header"></div>');
|
var collapse_hd_con = $('<div class="collapse-header-content"></div>');
|
var collapse_hd_a = $('<a href="javascript:;" onclick="toggleCollapse(this)">'+title+'<span class="badge default position-right">'+items.length+'</span></a>');
|
collapse_hd_con.append(collapse_hd_a); // 将标题的内容添加到容器中
|
collapse_hd.append(collapse_hd_con); // 将标题添加到头部容器
|
collapse.append(collapse_hd); // 将头部内容添加到collapse中
|
// 生成折叠的内容
|
var collapse_content = $('<div class="collapse-content"></div>');
|
var collapse_content_con = $('<div class="content"></div>');
|
var collapse_content_con_ul = $('<ul></ul>');
|
if(items.length == 0){
|
var collapse_content_con_ul_li = $('<li><h3>暂无'+title+'数据!!</h3></li>');
|
collapse_content_con_ul.append(collapse_content_con_ul_li);
|
}else{
|
for(var i = 0; i < items.length; i++) {
|
var collapse_content_con_ul_li = getCollapseContent(title, items[i], i);
|
collapse_content_con_ul.append(collapse_content_con_ul_li);
|
}
|
}
|
|
collapse_content_con.append(collapse_content_con_ul); // 将列表添加到容器中
|
collapse_content.append(collapse_content_con); // 将容器添加到内容容器中
|
collapse.append(collapse_content); // 将内容添加到collapse中
|
|
|
return collapse; // 返回collapse
|
}
|
/**
|
* 获取collapse的内容
|
* @param string title 标题
|
* @param item [description]
|
* @param {[type]} num [description]
|
* @return {[type]} [description]
|
*/
|
function getCollapseContent(title, item, i) {
|
var num = i+1;
|
var li = $('<li><a href="javascript:;" value="'+item.val+'" stop="'+item.stop+'" ondblclick="addActive(this)">'+num+'.'+title+'-'+item.txt+'</a></li>');
|
return li;
|
}
|
|
/**
|
* 给折叠框列表添加双击事件
|
* @param dom param 当前点击的元素
|
*/
|
function addActive(param) {
|
var $this = $(param);
|
$('.collapse .collapse-content a').removeClass('active');
|
$this.addClass('active');
|
}
|
|
/**
|
* 页面中折叠框的点击事件
|
* @param dom param 当前点击的元素(collapse的标题)
|
*/
|
function toggleCollapse(param) {
|
var $this = $(param);
|
var collapse = $this.parent().parent().parent();
|
var collapse_content = collapse.find('.collapse-content');
|
if(collapse.hasClass('collapsed')) {
|
collapse_content.slideUp(function() {
|
collapse.removeClass('collapsed');
|
});
|
}else {
|
collapse_content.slideDown(function() {
|
collapse.addClass('collapsed');
|
});
|
}
|
}
|
|
|
// 生成一级的collapse
|
function specialCollapse(container, data) {
|
container.text(" "); // 清空容器内容
|
var collapse = getSpecialCollapse(data);
|
container.append(collapse);
|
}
|
|
// 获取
|
function getSpecialCollapse(data) {
|
// 添加标题内容
|
var collapse = $('<div class="collapse"></div>');
|
var collapse_hd = $('<div class="collapse-header"></div>');
|
var collapse_hd_con = $('<div class="collapse-header-content"></div>');
|
var collapse_hd_a = $('<a href="javascript:;" onclick="collapseFirClick(this);">放电数据<span class="badge default position-right">'+data.length+'</span></a>');
|
collapse_hd_a.data().attr = data;
|
collapse_hd_con.append(collapse_hd_a); // 将标题的内容添加到容器中
|
collapse_hd.append(collapse_hd_con); // 将标题添加到头部容器
|
collapse.append(collapse_hd); // 将头部内容添加到collapse中
|
|
// 生成折叠的内容
|
var collapse_content = $('<div class="collapse-content"></div>');
|
var collapse_content_con = $('<div class="content"></div>');
|
|
collapse_content.append(collapse_content_con); // 将容器添加到内容容器中
|
cSpecialCollapseContent(collapse_content_con, data);
|
|
collapse.append(collapse_content); // 将内容添加到collapse中
|
|
return collapse;
|
}
|
|
// 生成二级内容
|
function cSpecialCollapseContent(container, data) {
|
if(data.length > 0 && container.children('ul').length==0) {
|
var _ul = $('<ul></ul>');
|
for(var i=0; i<data.length; i++) {
|
var _num = i+1;
|
var _li = $('<li></li>');
|
var _a = $('<a href="javascript:void(0);" onclick="collapseSecClick(this)" class="charge-time">'+_num+'.'+data[i].test_starttime+'<i class="fa fa-caret-down"></i></a>');
|
_a.data().attr = data[i];
|
_li.append(_a);
|
_ul.append(_li);
|
}
|
container.append(_ul)
|
}else if(data.length == 0 && container.children('span').length==0){
|
var _span = $('<span style="font-weight:bold;">暂无放电数据</span>');
|
container.append(_span);
|
}
|
}
|
|
// 生成三级内容
|
function cSpecialCollapseThir(container, data) {
|
//container.next('ul').remove(); // 移除当前的列表
|
var _ul = $('<ul></ul>');
|
for(var i=0; i<data.length; i++) {
|
var _li = $('<li></li>');
|
var _a = $('<a href="javascript:void(0);" onclick="addActive(this)" class="ele-mon-item">电池单体#'+data[i].test_monnum+'</a>');
|
_a.data().attr = data[i];
|
_li.append(_a);
|
_ul.append(_li);
|
}
|
container.after(_ul);
|
}
|
//设置一级导航的点击事件
|
function collapseFirClick(ele) {
|
var $ele = $(ele);
|
var collapse = $ele.parent().parent().parent();
|
var content = $ele.parent().parent().siblings('.collapse-content').children('.content');
|
if(collapse.hasClass('collapsed')) {
|
content.slideUp(function() {
|
collapse.removeClass('collapsed');
|
});
|
}else {
|
content.slideDown(function() {
|
collapse.addClass('collapsed');
|
});
|
}
|
}
|
|
// 设置二级导航的点击事件
|
function collapseSecClick(ele) {
|
var $ele = $(ele);
|
var parents = $ele.parent().siblings();
|
|
parents.children('a').removeClass('show');
|
$ele.toggleClass('show');
|
}
|
