	<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
	<title>用户管理</title>
	<meta name="decorator" content="default"/>
	<%@include file="/webpage/include/treeview.jsp" %>
	<style type="text/css">
	</style>
	<script type="text/javascript">
        function refresh(){//刷新
            window.location="${ctx}/projectcontentinfo/projectcontentinfo/?project.id=${projectId}";
        }
        function refreshTrees(){
            $.getJSON("${ctx}/projectcontentinfo/projectcontentinfo/treeData?projectId=${projectId}",function(data){
                $.fn.zTree.init($("#ztree"), setting, data).expandAll(true);
            });
        }
        window.onload = function() {
            function allclose(){
                $('#ztree_1_switch').removeClass('noline_open').addClass('noline_close');
                $('#ztree_1_ico').removeClass('ico_open').addClass('ico_close');
                $('#ztree_1_ul').css('display','none');
			}
			function allopen(){
                $('#ztree_1_switch').removeClass('noline_close').addClass('noline_open');
                $('#ztree_1_ico').removeClass('ico_close').addClass('ico_open');
                $('#ztree_1_ul').css('display','block');
                var secondLevel = $('#ztree_1_ul').children();
                var lel2 = secondLevel.find('a.level1');
                var arr2 = [];
                for (var i = 0, length = lel2.length; i < length; i++) {
                    arr2.push(lel2[i]);
                    $(arr2[i].nextSibling).css('display','block');
                    $(arr2[i]).find('span').eq(1).removeClass('noline_close').addClass('noline_open');
                    $(arr2[i]).find('span').eq(2).removeClass('ico_close').addClass('ico_open');
                }
                var lel3 = $('a.level2');
                var arr3 = [];
                for (var i = 0, length = lel3.length; i < length; i++) {
                    arr3.push(lel3[i]);
                    $(arr3[i].nextSibling).css('display','block');
                    $(arr3[i]).find('span').eq(1).removeClass('noline_close').addClass('noline_open');
                    $(arr3[i]).find('span').eq(2).removeClass('ico_close').addClass('ico_open');
                }
                var lel4 = $('a.level3');
                var arr4 = [];
                for (var i = 0, length = lel4.length; i < length; i++) {
                    arr4.push(lel4[i]);
                    $(arr4[i].nextSibling).css('display','block');
                    $(arr4[i]).find('span').eq(1).removeClass('noline_close').addClass('noline_open');
                    $(arr4[i]).find('span').eq(2).removeClass('ico_close').addClass('ico_open');
                }
                var lel5 = $('a.level4');
                var arr5 = [];
                for (var i = 0, length = lel5.length; i < length; i++) {
                    arr5.push(lel5[i]);
                    $(arr5[i].nextSibling).css('display','block');
                    $(arr5[i]).find('span').eq(1).removeClass('noline_close').addClass('noline_open');
                    $(arr5[i]).find('span').eq(2).removeClass('ico_close').addClass('ico_open');
                }
			}
            allopen();
            var secondLevel = $('#ztree_1_ul').children();
            var lel2 = secondLevel.find('a.level1');
            var arr2 = [];
            for (var i = 0, length = lel2.length; i < length; i++) {
                arr2.push(lel2[i]);
                $(arr2[i].nextSibling).css('display','none');
                $(arr2[i]).find('span').eq(1).removeClass('noline_open').addClass('noline_close');
                $(arr2[i]).find('span').eq(2).removeClass('ico_open').addClass('ico_close');
            }
			$('.selected').on('click',function () {
				$('.sels').slideToggle();
            });

            $('.sels').on('click','li',function (e) {
                var choosesel = $(e.target).text().trim();
               $('.selected').text(choosesel);
               $('.sels').slideUp();
               if(choosesel=='全部收起'){
                   allclose();
			   } else if(choosesel=='2级'){
                   allopen();
				   var secondLevel = $('#ztree_1_ul').children();
                   var lel2 = secondLevel.find('a.level1');
                   var arr2 = [];
                   for (var i = 0, length = lel2.length; i < length; i++) {
                       arr2.push(lel2[i]);
                       $(arr2[i].nextSibling).css('display','none');
                       $(arr2[i]).find('span').eq(1).removeClass('noline_open').addClass('noline_close');
                       $(arr2[i]).find('span').eq(2).removeClass('ico_open').addClass('ico_close');
                   }
			   }else if(choosesel=='3级'){
                   allopen();
                   var lel3 = $('a.level2');
                   var arr3 = [];
                   for (var i = 0, length = lel3.length; i < length; i++) {
                       arr3.push(lel3[i]);
                       $(arr3[i].nextSibling).css('display','none');
                       $(arr3[i]).find('span').eq(1).removeClass('noline_open').addClass('noline_close');
                       $(arr3[i]).find('span').eq(2).removeClass('ico_open').addClass('ico_close');
                   }
               }else if(choosesel=='4级'){
                   allopen();
                   var lel4 = $('a.level3');
                   var arr4 = [];
                   for (var i = 0, length = lel4.length; i < length; i++) {
                       arr4.push(lel4[i]);
                       $(arr4[i].nextSibling).css('display','none');
                       $(arr4[i]).find('span').eq(1).removeClass('noline_open').addClass('noline_close');
                       $(arr4[i]).find('span').eq(2).removeClass('ico_open').addClass('ico_close');
                   }
               }else if(choosesel=='5级'){
                   allopen();
                   var lel5 = $('a.level4');
                   var arr5 = [];
                   for (var i = 0, length = lel5.length; i < length; i++) {
                       arr5.push(lel5[i]);
                       $(arr5[i].nextSibling).css('display','none');
                       $(arr5[i]).find('span').eq(1).removeClass('noline_open').addClass('noline_close');
                       $(arr5[i]).find('span').eq(2).removeClass('ico_open').addClass('ico_close');
                   }
               }else if(choosesel=='全部展开'){
                   allopen();
               }


            })
        }
	</script>
	<style>
		*{
			box-sizing: border-box;
		}
		body{
			background-color:transparent;
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26FFFFFF, endColorstr=#26FFFFFF);
			color:#ffffff;
			background-color:rgba(255,255,255,0);
			height:100%;
		}
		#left{
			position: relative;
		}
		.newsel{
			position: absolute;
			top: 0;
			right:3px;
			background: #fff;
			border: 1px solid #ccc;
			width: 80px;
			overflow: hidden;
			text-align: center;
			cursor: pointer;
		}
		.selected{
			width: 100%;
			height: 30px;
			line-height: 30px;
			background: #0f92fb;
			color: #fff;
		}
		.sels{
			display: none;
		}
		.sels li{
			height: 30px;
			line-height: 30px;
			border-top: 1px solid #ccc;
		}
	</style>
</head>
<body class="gray-bg">

<div class="wrapper wrapper-content full-width" id="divId">
	<sys:message content="${message}"/>
	<div id="content" class="pr full-height full-width">
		<div id="left"  class="contentShadow fl contents">
			<div><a href="${ctx}/projectcontentinfo/projectcontentinfo/list" class="nav-btn nav-btn-refresh" style="float: left">返回</a></div>
			<div class="newsel">
				<p class="selected">2级</p>
				<ul class="sels">
					<li>全部收起</li>
					<li>2级</li>
					<li>3级</li>
					<li>4级</li>
					<li>5级</li>
					<li>全部展开</li>
				</ul>
			</div>
			<br/>
			<div class="ztreeContainer">
				<div id="ztree" class="ztree leftBox-content"></div>
			</div>
		</div>
		<div id="right"  class="fl contents">
			<div class="layui-row contentShadow full-height tran-bg">
				<iframe id="userContent" name="userContent" src="${ctx}/projectcontentinfo/projectcontentinfo/list?project.id=${projectId}&id=${id}&view=${view}" width="100%" height="100%" frameborder="0"></iframe>

			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
    function addDiyDom(treeId, treeNode) {
        var spaceWidth = 15;
        var switchObj = $("#" + treeNode.tId + "_switch"),
            icoObj = $("#" + treeNode.tId + "_ico");
        switchObj.remove();
        icoObj.before(switchObj);

        if (treeNode.level > 0) {
            var spaceStr = "<span style='display: inline-block;width:" + (spaceWidth * treeNode.level)+ "px'></span>";
            switchObj.before(spaceStr);
        }
    }

    var setting = {data:{simpleData:{enable:true,idKey:"id",pIdKey:"pId",rootPId:'0'}},
        callback:{onClick:function(event, treeId, treeNode){
            var id = treeNode.id == '0' ? '' :treeNode.id;
            if (treeNode.level != '4'){
                $('#userContent').attr("src","${ctx}/projectcontentinfo/projectcontentinfo/list?id="+id+"&parentIds="+treeNode.pIds);
            }
        }
        }
        ,view:{
            showLine: false,
            showIcon: false,
            addDiyDom: addDiyDom
        }
    };

    function refreshTree(){
        $.getJSON("${ctx}/projectcontentinfo/projectcontentinfo/treeData?projectId=${projectId}",function(data){
            $.fn.zTree.init($("#ztree"), setting, data).expandAll(true);
        });
    }
    refreshTree();
</script>
</body>
</html>