{extend name="base" /} {block name="head"} <script src="{$static}/js/zTree_v3/js/jquery.ztree.core-3.5.min.js" type="text/javascript"></script> <link href="{$static}/js//zTree_v3/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" /> <style type="text/css"> .tab-content{width: 100%;height: 100%; overflow: hidden;} .tab-content .tab-pane{width: 100%;height: 100%; overflow: hidden;} </style> {/block} {block name="main"} <div class="zt_header"> {$title} <span>{$version}</span> <span class="zt_download">{$copyright}</span> </div> <div class="zt_main"> <div class="zt_navi"> <div class="zt_navi_inner"> <div class="ztree" id="zt_navi_tree"></div> </div> </div> <div class="zt_content" style="overflow: hidden;"> <ul id="apiTab" class="nav nav-tabs"> <li id="index_tab" class="active"><a href="#index_tab_content" data-toggle="tab">搜索</a></li> </ul> <div class="tab-content"> <div class="tab-pane fade in active" id="index_tab_content"><iframe id="zt_text" src="{$root}/doc/search" width="100%" height="100%" frameborder="0"></iframe></div> </div> </div> </div> {/block} {block name="footer"} <script type="text/javascript"> var setting = { view: { selectedMulti: false }, callback: { beforeClick: beforeClick, onClick: onClick }, data:{ key:{ children: "actions", name: "title", url:"", } } }; function beforeClick(treeId, treeNode, clickFlag) { if (treeNode.isParent) { zTree.expandNode(treeNode); return false; }else if(!treeNode.isText){ return false; } return true; } function onClick(event, treeId, treeNode, clickFlag) { if (!treeNode.isParent) { if(treeNode.isText){ var tab_id = treeNode.tId; var name = treeNode.title; loadText(tab_id, name, treeNode.name); } } } function closeTab(tab) { var id = $(tab).parent().parent().attr('id'); $("#" + id).remove(); $("#" + id + "_content").remove(); //显示最后一个tab id = $("#apiTab").find('>li:last').attr('id'); $("#"+id+" > a").click(); } function loadText(tab_id, title, name){ //创建tab var tab_id = tab_id + "_tab"; if($("#"+tab_id).length == 0) { // class="active" $("#apiTab").append('<li id="'+ tab_id +'"><a href="#' + tab_id + '_content" data-toggle="tab">'+ title +' <span class="glyphicon glyphicon-remove" onclick="closeTab(this)" style="cursor:pointer"></span></a></li>'); }else{ $("#"+tab_id+" > a").click(); } var tab_content = tab_id + "_content"; if($("#"+tab_content).length == 0) { // active $(".zt_content > .tab-content").append('<div class="tab-pane fade in" id="'+ tab_content +'"><iframe id="zt_text" src="" width="100%" height="100%" frameborder="0"></iframe></div>'); $("#"+tab_id+" > a").click(); } var content_text = $("#" + tab_content).find("#zt_text"); $(content_text).html("<p>加载中……</p>"); $(content_text).attr("src","{$root}/doc/info?name="+name); initHeight(); } var zTree; $(document).ready(function(){ $.ajax({ url: "{$root}/doc/list", dataType: "json", success: function(data){ var zNodes = data.list; zTree = $.fn.zTree.init($("#zt_navi_tree"), setting, zNodes); var currentId = data.firstId || '<?php str_replace('\\', '\\\\', $doc) ?>'; if(currentId) { var node = zTree.getNodeByParam("name", currentId); loadText(node.tId, node.title, node.name); zTree.selectNode(node); } } }); initHeight(); }); function initHeight() { $(".tab-content").height($(".zt_content").height() - $("#apiTab").height()); } </script> {/block}