<%@ 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">
		/*.ztree {overflow:auto;margin:0;_margin-top:10px;padding:10px 0 0 10px;}*/
	</style>
	<script type="text/javascript">
		function refresh(){//刷新
			
			window.location="${ctx}/sys/office/";
		}
	</script>
	<style>
		body{
			background-color:transparent;
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26FFFFFF, endColorstr=#26FFFFFF);
			color:#ffffff;
			background-color:rgba(255,255,255,0);
			height:100%;
		}
	</style>
</head>
<body>
	<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 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="officeContent" name="officeContent" src="${ctx}/sys/office/list?id=&parentIds=" 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;
/*
					var id = treeNode.pId == '0' ? '' :treeNode.pId;
*/
					/*alert(id+"============="+treeNode.pIds);*/
					$('#officeContent').attr("src","${ctx}/sys/office/list?id="+id+"&parentIds="+treeNode.pIds);
				}
			},view:{
                showLine: false,
                showIcon: false,
                addDiyDom: addDiyDom
            }
		};
		
		function refreshTree(){
			$.getJSON("${ctx}/sys/office/treeData",function(data){
				$.fn.zTree.init($("#ztree"), setting, data).expandAll(true);
			});
		}
		refreshTree();

        // var width = $('#divId').width();
        // var leftWidth =  width*0.1; // 左侧窗口大小
		// var htmlObj = $("html"), mainObj = $("#main");
		// var frameObj = $("#left, #openClose, #right, #right iframe");
		// function wSize(){
		// 	var strs = getWindowSize().toString().split(",");
		// 	htmlObj.css({"overflow-x":"hidden", "overflow-y":"hidden"});
		// 	mainObj.css("width","auto");
		// 	frameObj.height(strs[0] - 120);
		// 	/*var leftWidth = ($("#left").width() < 0 ? 0 : $("#left").width());
		// 	$("#right").width($("#content").width()- leftWidth - $("#openClose").width() -60);
		// 	$(".ztree").width(leftWidth - 10).height(frameObj.height() - 46);*/
         //    $("#content").width(width);
         //    $("#left").width(width*0.12);
         //    $("#ztree").width(width*0.12);
         //    $("#ztree").height('86%');
         //    $("#right").width(width*0.82);
         //    $("#officeContent").width(width*0.82);
		// }
	</script>
	<%--<script src="${ctxStatic}/common/wsize.min.js" type="text/javascript"></script>--%>
</body>
</html>