(function($){
var win = window ;
var bb = win.bigbear = win.bigbear || {
ui : {}
} ;
var ui = bb.ui = {} ;
var Tab = function(elem,opts){
this.elem = elem ;
this.opts = opts ;
} ;
var tabProto = Tab.prototype ;
/* update time 2015 1/26 15:36 */
tabProto._isDisplayMax = function(size){
var displayMax = this.getOpts()["displayMax"] || 5 ;
return (size <= displayMax) ? true : false ;
} ;
tabProto._isEmptyResult = function(){
if(!this.getOpts()["result"].length){
return false ;
}
return true ;
} ;
tabProto._saveOrUpdateStatus = function(item,status){
item["status"] = status ;
} ;
tabProto._getItemListByStatus = function(status){
var list = [] ;
var result = this.getOpts()["result"] ;
$.each(result,function(i,item){
if(status == item["status"]){
list.push(item) ;
}
}) ;
return list ;
} ;
tabProto._getStatusByIndex = function(index){
var status = null ;
var result = this.getOpts()["result"] ;
$.each(result,function(i,item){
if(index == item["index"]){
status = item["status"] ;
}
}) ;
return status ;
} ;
tabProto._renderConsolePanel = function(status){
var that = this ;
var root = that.getElem().find(".console-panel") ;
this._resetConsolePanel() ;
$.each(that._getItemListByStatus(status),function(i,item){
var elem = $("
").appendTo(루트) ;
$("
")
.data("항목",항목)
.appendTo(elem) ;
$("
").text(item["text"]).appendTo(elem) ;
}) ;
if(root.find("div").size()){
$("
")
.on("클릭",function(){
var data = root.find("input[type=radio]:checked").data("item") ;
if(that._getItemListByStatus("1").length < that.getOpts()["displayMax"]){
that.getElem().find(".title .items div").eq(data["index"]).fadeIn(function(){
that._saveOrUpdateStatus(data,"1") ;
})
.trigger("클릭") ;
}
그렇지 않으면{
that._saveOrUpdateStatus(data,"2") ;
}
that.getElem().find(".title .adder").trigger("클릭") ;
})
.appendTo(루트) ;
}
그렇지 않으면{
root.text("暂无任何可添加的项目!") ;
}
} ;
/* 업데이트 시간 2015년 1/26 15:36 */
tabProto._setCurrent = 함수(색인){
var items = this.getElem().find(".title .items div").removeClass("active") ;
items.eq(index).addClass("active") ;
var 내용 = this.getElem().find(".content .c").hide() ;
내용.eq(index).show() ;
} ;
tabProto.getElem = 함수(){
this.elem을 반환하세요 ;
} ;
tabProto.getOpts = function(){
this.opts를 반환하세요 ;
} ;
tabProto._resetContent = function(){
this.getElem().find(".content").html("") ;
} ;
tabProto._setContent = 함수(html){
this.getElem().find(".content").html(html) ;
} ;
tabProto._getContent = 함수(url){
$.ajax({
반환
url : url
}) ;
} ;
tabProto._deleteItem = 함수(elem){
var that = this ;
this.getElem().find(".title .items div")
.eq(elem.index())
.fadeOut(함수(){
that._resetContent() ;
that._saveOrUpdateStatus(elem.data("item"),"0") ;
that._triggerItem(elem.index() + 1) ;
}) ;
} ;
tabProto._triggerItem = function(next){
var nextStatus = this._getStatusByIndex(next) ;
var items = this.getElem().find(".title .items div") ;
next = items.eq(next) ;
if(next.size() && "1" == nextStatus){ //后继dom节点存在
next.trigger("click") ;
}
else{
items.eq(0).trigger("click") ;
}
} ;
tabProto._resetConsolePanel = function(){
this.getElem().find(".console-panel").empty() ;
} ;
tabProto.init = function(){
if(this._isEmptyResult()){
this._setContent("暂无任何模块!") ;
}
var that = this ;
this.getElem().find(".title .adder")
.text("+" + this.getOpts()["buttonText"])
.on("click",function(){
that.getElem().find(".console-panel").slideToggle(function(){
that._renderConsolePanel("0") ;
}) ;
}) ;
$.each(this.getOpts()["result"],function(i,item){
if(that._isDisplayMax(i + 1)){
that._saveOrUpdateStatus(item,"1") ;
}
else{
that._saveOrUpdateStatus(item,"2") ;
}
that._render(item) ;
}) ;
if(!that._isDisplayMax(this.getOpts()["result"].length)){
this.getElem().find(".title .more-mod").fadeIn(function(){
$(this).find(".tag").on("click",function(){
var root = $(this).next() ;
root.empty() ;
$.each(that._getItemListByStatus("2"),function(i,data){
$("
").text(data["text"])
.on("click",function(){
if(that._getItemListByStatus("1").length < that.getOpts()["displayMax"]){
that.getElem().find(".title .items div").eq(data["index"]).fadeIn(function(){
that._saveOrUpdateStatus(data,"1") ;
}) ;
}
else{
alert("不能添加任何模块，目前已经是最大数量！") ;
}
})
.appendTo(root) ;
}) ;
root.toggle() ;
}) ;
});
}
this.getElem().find(".title .items div")
.eq(0)
.trigger("click") ; // 假定是必须有一项，否则插件意义就不大了！
} ;
tabProto._render = function(data){
var that = this ;
var item = $("
").text(data["text"]).appendTo(this.getElem().find(".title .items")) ;
데이터["index"] = item.index() ;
item.on("클릭",function(){
that._setCurrent($(this).index()) ;
that._getContent(data["url"]).done(function(result){
that._setContent(결과) ;
})
.fail(함수(){
throw new Error("Net Error !") ;
});
})
.data("항목",data) ;
if("2" == 데이터["상태"]){
item.hide() ;
}
if("1" == 데이터["showClose"]){
$("
X")
.on("클릭",function(){
if(win.confirm("是否删除此项?")){
that._deleteItem(항목) ;
거짓을 반환 ; // 阻止冒泡
}
})
.appendTo(항목) ;
}
} ;
ui.createTab = 함수(elem,opts){
var 탭 = 새 탭(elem,opts) ;
tab.init() ;
리턴 탭 ;
} ;
})(jQuery) ;
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
