Template8.jsp 9.42 KB
<%@ page language="java" contentType="text/html; charset=GBK"%>
<%-- <%@ include file="/systeminfo/init.jsp"%> --%>
<%@ page import="weaver.hrm.*"%>
<%@ page import="java.util.*"%>
<%@ page import="weaver.general.*"%>
<jsp:useBean id="cmutil" class="weaver.kt.util.CommonTransUtil" scope="page" />
<jsp:useBean id="transUtil" class="weaver.secondary.util.TransUtil" scope="page" />
<jsp:useBean id="rs" class="weaver.conn.RecordSet" scope="page" />
<% 
	User user = HrmUserVarify.getUser (request , response) ;
	if (user == null){
	    response.sendRedirect("/login/Login.jsp");
	    return;
	}
    String userId = user.getUID()+"";
    String mapId = Util.null2String(request.getParameter("mapId"));
    String name = "";
    String remark = "";
 	 //创建人
    String creater ="";
    String docmodecontents = "";
    rs.executeSql("select name,remark,createrId,tId,docmodecontents from KT_Map where id="+mapId);
    if(rs.next()){
        name = Util.null2String(rs.getString("name"));
        remark = Util.convertDB2Input(rs.getString("remark"));
        docmodecontents = Util.convertDB2Input(rs.getString("docmodecontents"));
        creater = transUtil.getHrm(Util.null2String(rs.getString("createrId")));
    }
  	//文档编号
    String mapNum = ((1000000+Integer.parseInt(mapId))+"").substring(1);
%>
<html>
<head>
<title><%=name %></title>
<script type="text/javascript" src="/wui/common/jquery/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="/js/init.js"></script>
<script type="text/javascript" src="/js/ecology8/jNice/jNice/jquery.jNice.js"></script>

<link rel="stylesheet" href="/wui/theme/ecology8/page/perfect-scrollbar/perfect-scrollbar.css">
<script type="text/javascript" src="/wui/theme/ecology8/page/perfect-scrollbar/perfect-scrollbar.js"></script>
<script type="text/javascript" src="/wui/theme/ecology8/page/perfect-scrollbar/jquery.mousewheel.js"></script>
<style>
	body{
		margin:0;
		padding:0;
		font-size: 12px;
		min-width: 800px;
    }
    *{
    	font-family: '微软雅黑';
    }
     a {
		text-decoration: none;
	}
	
	/**头部和右侧边样式**/
	.top {
		height: 74px;
		margin: 0 0 0 50px;
		border-bottom: 1px solid #CFCFCF;
	}
	.topLeftDiv{
		float: left;
		font-size: 13px;
		width: 200px;
		margin-top: 7px;
	}
	.topLeftDiv div {
		line-height: 20px;
	}
	.titleDiv1{
/* 		float: left; */
		font-size: 18px;
		line-height: 108px;
		font-weight: bold;
		text-align: center;
		text-indent: -200px;
		height: 75px;
	}
	.logoDiv{
		background: #fff url('/knowledgetool/images/logo.png') no-repeat 0;
		width: 100px;
		height: 75px;
		top:0;
		right:0;
		position: absolute;
		z-index: 3;
	}
	.leftFrameDiv{
		height:100%;
		width:70px;
		background: #3072D3;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 2;
	}
	.menu {
		position: fixed;
		top: 100px;
		right: 7%;
		width: 200px;
		border: 1px solid #DDD;
		background: #FFF;
		z-index: 10;
		padding: 10px 0;
	}
	/**头部和右侧边样式**/
	
	.container {
		margin: 50px auto;
		border-left: 1px #ccc solid;
/* 		border-radius: 5px; */
		background-color: #fff;
		max-width: 900px;
		min-width: 600px;
		margin-left: 10%;
/* 		position: relative; */
	}
	
	.detail {
		padding: 0 15px;
	}
	
	.title {
		font-size: 25px;
		font-weight: bold;
		text-align: center;
		margin: 20px auto;
	}
	
	.disgest {
		padding: 10px;
	}
	
	.content {
/* 		padding: 10px; */
	}
	
	.title-item {
		position: relative;
		z-index: 1;
	}
	
	.title-logo {
		position: absolute;
/* 		top: 20px; */
		left: -15px;
		width: 25px;
		height: 24px;
		line-height: 24px;
		font-size: 16px;
		background: #519cea;
		color: #fff;
		text-align: center;
		border-radius: 0 2px 2px 0;
	}
	
	.title-new {
		display: inline-block;
		padding: 0 10px;
		background: #fff;
		margin-left: 10px;
		margin-top: -20px;
		margin-bottom: 20px;
	}
	
	.title-line {
		width: 100%;
		background-color: #ccc;
		height: 1px;
		position: absolute;
		margin-top: -51px;
		z-index: -1;
	}
	
	.nav {
		position: fixed;
		right: 7%;
		width: 200px;
		border: 1px solid #DDD;
		background: #FFF;
		z-index: 2;
		padding: 5px 0 5px 5px;
		top: 100px;
	}
	
	.navMove {
		position: absolute;
/* 		right:-200px; */
	}
	
	.scrollDiv{
		max-height: 400px;
/* 		margin: 10px; */
		padding-right: 10px;
	}
	
	.nav ul {
		list-style: none;
		padding-left: 24px;
	}
	
	.nav ul li {
		cursor: pointer;
		line-height: 24px;
		overflow: hidden;
		cursor: pointer;
		text-overflow: ellipsis;
	}
	
	.nav ul li:HOVER {
		background-color: #f0f0f0;
	}
	
	.nav .sn {
		padding-right: 5px;
		color: #999;
	}
	
	.nav .txt {
		white-space: nowrap;
	}
    
</style>
</head>
<body>
<div id="mainDiv" style="margin-right: 70px;">
	<div class="top">
		<div class="topLeftDiv">
			<div>文档编号:<%=mapNum %></div>
			<div style="color:#2D8B00;">凝聚分散智慧 协同提速发展</div>
			<div>发布人员:<span><%=creater %></span></div>
		</div>
<!-- 		<div class="titleDiv1"><%=name %></div> -->
	</div>
	<%
	if(remark.length() > 0){
		%>
		<div style="margin: 0 0 0 50px;">
			<div id="remarkComtainer" class="remarkComtainer">
		       <%
		       session.setAttribute("remark_"+mapId,remark);
		       %>
		       <iframe id="iframepage" src="/knowledgetool/template/ShowFckEditorDesc.jsp?sessionname=remark_<%=mapId %>&seth=0"  scrolling=no width="100%" onLoad="iFrameHeight(this)"  marginheight="0" marginwidth="0" allowTransparency="true" frameborder="0"></iframe>
		   	</div>
	   	</div>
		<%
	}
	%>
</div>
<div class="leftFrameDiv"></div>
<div class="logoDiv"></div>	
<script type="text/javascript"> 
var array = [];

$(document).ready(function() {
	$("h1").each(function(i, e) {
		var text = $(e).text();
		var html = "<div class=\"title-item\"><div class=\"title-logo\">" + (i + 1) + "</div><div class=\"title-new\"><h1>"
			+ text + "</h1></div><div class=\"title-line\"></div></div>"
			$(e).replaceWith(html);
	});
	
// 	$(".title-line").each(function(i, e) {
// 		$(e).css("width", ($(e).parent(".title-item").width() - $(e).parent(".title-item").find(".title-new").width() - 10) + "px");
// 	});
	
	var html = "<ul style=\"padding: 5px 0 5px 5px;\">";
// 	var fengmian = "";
// 		<%
// 		if(remark.length() > 0){
// 			%>
// 			fengmian ='<li style="color: rgb(0, 0, 0); font-weight: normal;" _index="-1"><span class="txt" style="font-weight: bold;">封面</span></li>';
// 			<%
// 		}
// 		%>
// 	html += fengmian;
	$(".title-item").each(function(i, e) {
		array.push($(e));
		var text = $(e).find("h1").text();
		html += "<li><span class=\"sn\">" + (i + 1) + "</span><span class=\"txt\" style=\"font-weight: bold;\" title='" + text + "'>" + text + "</span></li>";
		html += loadNav($(e), 2, (i + 1) + ".", 0);
	});
	html += "</ul>";
	$("#scrollDiv").html(html);
	
	var lis = $(".nav").find("li");
	window.onscroll = function() {
		var winScroll = jQuery(window).scrollTop(); 
		for(var i=0;i<array.length;i++){
			if(array[i].offset().top<winScroll + 5 && (i == array.length - 1 || array[i + 1].offset().top>winScroll + 5)){
				lis.eq(i)[0].style.color = "#2a7ee7";
				lis.eq(i)[0].style.fontWeight = "bold";
			}else{
				lis.eq(i)[0].style.color = "#000";
				lis.eq(i)[0].style.fontWeight = "normal";
			}
		}
		
		var containerTop = jQuery(".detail").offset().top;
		//menu距离右边body宽度的7%
		var menuRight = jQuery("body").width()*0.07;
		if(containerTop - winScroll < 100){
			jQuery(".nav").removeClass("navMove").css("top","100px");
		}else{
			//滚动到明细页面的时候添加menu移动的class
			var menuTop = jQuery(".container").offset().top;
		 	jQuery(".nav").addClass("navMove").css("top",menuTop+"px");
		}
	};
	
// 	for (var i = 0; i < lis.length; i++) {
// 		lis.eq(i).live("click", function() {
// 			var k = $(".nav").find("li").index($(this));
// 			$(array[k])[0].scrollIntoView();
// 		});
// 	}
	
	jQuery(".nav li").click(function(){
		var _index = $(this).attr("_index");
		if("-1" == _index){
			jQuery(window).scrollTop(0);
		}else{
			var k = jQuery(".nav li").index($(this));
			$(array[k])[0].scrollIntoView();
		}
		
	});
	
	jQuery("#scrollDiv").perfectScrollbar();
});

function loadNav(obj, deep, prev, f) {
	var _html = "<ul>";
	
	if (f == 0) {
		obj.nextUntil(".title-item").filter("h" + deep).each(function(i, e) {
			array.push($(e));
			var text = $(e).text();
			_html += "<li><span class=\"sn\">" + prev + "" + (i + 1) + "</span><span class=\"txt\" title='" + text + "'>" + text + "</span></li>";
			var __html = loadNav($(e), deep + 1, prev + (i + 1) + ".");
			_html += __html == "<ul></ul>" ? "" : __html;
		});
	} else {
		obj.nextUntil("h" + (deep - 1)).filter("h" + deep).each(function(i, e) {
			array.push($(e));
			var text = $(e).text();
			_html += "<li><span class=\"sn\">" + prev + "" + (i + 1) + "</span><span class=\"txt\" title='" + text + "'>" + text + "</span></li>";
			var __html = loadNav($(e), deep + 1, prev + (i + 1) + ".");
			_html += __html == "<ul></ul>" ? "" : __html;
		});
	}
	_html += "</ul>";
	return _html;
}

function iFrameHeight(obj) { 
	   var iframe = obj; 
		try{ 
     var bHeight =   iframe.contentWindow.document.body.scrollHeight; 
     var dHeight = iframe.contentWindow.document.documentElement.scrollHeight; 
     var height = Math.max(bHeight, dHeight); 
     iframe.height =  height; 
     jQuery(".leftFrameDiv").height(jQuery("html").height());
     
     var menuTop = jQuery(".container").offset().top;
 	jQuery(".nav").addClass("navMove").css("top",menuTop+"px");
     
		 }catch (ex){} 
}
</script>
<div class="container">
	<div class="detail">
		<div class="content"><%=docmodecontents %></div>
	</div>
	<div class="nav"><div id="scrollDiv" class="scrollDiv"></div></div>
</div> 
</body>
</html>