bsdsjj_siping/web/WEB-INF/view/platform/console/main_top.jspf

<%@page import="java.util.Properties"%>
<%@page import="java.io.InputStream"%>
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="security" uri="http://www.springframework.org/security/tags"%>
<%
	Properties prop = new Properties(); 
	InputStream in;  
	in = this.getClass().getResourceAsStream("/conf/app.properties");//加载配置文件
	prop.load(in);
%>
	<f:link href="jquery/plugins/jquery.chosen.css"></f:link>
	<script type="text/javascript" src="${ctx}/js/jquery/plugins/jquery.tips.js"></script>
<script type="text/javascript" src="${ctx}/js/im/im.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery/plugins/jquery.chosen.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery/plugins/jquery.htselect.js"></script>
<script type="text/javascript">
var serverUrl = "<%=prop.getProperty("serverUrl")%>";
var socketUrl = "<%=prop.getProperty("socketUrl")%>";
	var isStop = false,pWidth,sWidth;
	$(function(){
		jQuery("#setSubSystem").chosen();
		$(".moreinfo").htselect();
		$("a.normalOrg").click(function(){
			var posid=$(this).attr("posid"),
    			form=new com.hotent.form.Form();
    		form.creatForm("orgform", "${ctx}/platform/console/switchCurrentOrg.ht");
    		form.addFormEl("posId", posid);
    		form.submit();
		});
		$("a.normalSysLanguage").click(function(){
			var language=$(this).attr("language"),
    			form=new com.hotent.form.Form();
    		form.creatForm("sysLanguageform", "${ctx}/platform/console/switchSysLanguage.ht");
    		form.addFormEl("language", language);
    		form.submit();
		});
		
		if("${message.message}" != "") {
			alert("${message.message}");
		}
		
	});
	
	
	
	function selectSystem() {
		if ($(".show_sys").css("display") == "none") {
			$(".show_sys").css("display", "block");
		} else {
			$(".show_sys").css("display", "none");
		}
	};
	function rollLeft() {
		var lef = pWidth - sWidth;
		var cLeft = parseInt($("div.menuPanel").css("left").replace("px", ""));
		if (cLeft <= lef)
			return;
		$("div.menuPanel").animate({
			left : "-=30px"
		}, 20, function() {
			if (!isStop) {
				rollLeft();
			}
		});
	};
	function startRoll(e) {
		isStop = false;
		if (e == 0) {
			pWidth = $("div.menuParent").width();
			sWidth = parseInt($("div.menuPanel").css("padding-left")
					+ $("div.menuPanel").css("padding-left"));
			var count = 0, temp = 0;
			$("a.menuItem").each(
					function() {
						count++;
						temp = parseInt($(this).css("margin-left"))
								+ parseInt($(this).css("margin-right"))
								+ parseInt($(this).css("padding-left"))
								+ parseInt($(this).css("padding-right"));
						sWidth += $(this).width();
					});
			sWidth += (count + 1) * temp;
			rollLeft();
		} else {
			rollRight();
		}
	};
	function breakRoll() {
		isStop = true;
	};
	function rollRight() {
		var cLeft = parseInt($("div.menuPanel").css("left").replace("px", ""));
		if (cLeft >= 0)
			return;
		$("div.menuPanel").animate({
			left : "+=30px"
		}, 20, function() {
			if (!isStop) {
				rollRight();
			}
		});
	};

	// 刷新未读信息
	function refresh() {

		$.post(__ctx + "/platform/system/messageSend/notReadMsg.ht", function(data) {

			$('#labMsgSize').text(data);
			if (data == 0) {
				$('#inMsg').attr('src',
						__ctx + '/styles/default/images/msg_none.png');
			}
		});
		$("iframe[name='home']").attr('src',__ctx+'/platform/console/home.ht');
		if(this.win)
			this.win.close();
	}

	function showReadMsgDlg(id) {
		var msgLength = $('#labMsgSize').text();
		if (msgLength > 0) {

			var url = __ctx + '/platform/system/messageSend/readMsgDialog.ht';
			if(typeof id!='undefined'){
				url += '?id='+id
			}
			win = $.ligerDialog.open({
				allowClose: false,
				url : url,
				height : 450,
				width : 600,
				isResize : false,
				title : '站内消息'
			});
		}
	}
	function changeSkin(styleName){
		$.post(__ctx + "/platform/system/sysPaur/changeSkin.ht",{'styleName':styleName}, function(response) {
			var json=$.parseJSON(response);
			if(json.result){
				window.location.reload(true);	
			}
			else{
				alert(json.message);
			}
		});
	}
	
	//更改指定皮肤分风格
	function setLink(linktitle,styleName,obj){
		var updatelogo=true;
		
		$('link[rel=stylesheet]:[title='+linktitle+']',obj).each(
			function(){
				var curhref=this.href;
				var startIndex=curhref.indexOf("/styles/");
				var endIndex=curhref.indexOf("/css/");
				var substr=curhref.substring((startIndex+8),endIndex);
				this.href=curhref.replace(substr,styleName) ;
				if(updatelogo){
					var newlogo=$('#logoImg').attr("src").replace(substr,styleName);
					$('#logoImg').attr("src",function(){ return newlogo});
					updatelogo=false;
				}
			}		
		);
	}
	function showList(o) {
		if($(".dropdown-content").hasClass("show")){
			hideList("dropdown-content" + o.id);
		}else{
		    hideList("dropdown-content" + o.id);
		    document.getElementById("dropdown-" + o.id).classList.toggle("show");
		}
	}
	 
	function hideList(option) {
	    var dropdowns = document.getElementsByClassName("dropdown-content");
	     
	    for (var i = 0; i < dropdowns.length; i++) {
	        var openDropdown = dropdowns[i];
	        if (openDropdown.id != option) {
	            if (openDropdown.classList.contains('show')) {
	                openDropdown.classList.remove('show');
	            }
	        }
	    }
	}
</script>
<!-- div 横排 -display:inline-->
<style>
.moreinfo{ display:inline}
.msg_div{ display:inline}

.jstx{
	display:block;
	width: 33px;
	height: 33px;
}
.jstx2{
	animation:move 3s 0s infinite;
	-webkit-animation:move 3s 0s infinite;
	transform-origin:bottom;
	-webkit-transform-origin:bottom;
}

@keyframes move
{
	0%, 65%{
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
	70% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	75% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	80% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	85% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	90% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	95% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	100% {
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
}
@-webkit-keyframes move
{
	0%, 65%{
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
	70% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	75% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	80% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	85% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	90% {
		-webkit-transform:rotate(6deg);
		transform:rotate(6deg);
	}
	95% {
		-webkit-transform:rotate(-6deg);
		transform:rotate(-6deg);
	}
	100% {
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #4482eb;
    min-width: 239px;
    box-shadow: 0px 8px 16px 5px rgba(0, 0, 0, 0.2);
    margin-top:15px;
    margin-left:-7px;
}
.dropdown-content a {
    color: black;
    padding: 12px 24px;
    text-decoration: none;
    display: block;
    text-align: left;
}
.dropdown-content a:hover {
    color: white;
    background-color: #81d0f2;
}
.show {
    display: block;
}
.dropItem {
	cursor:pointer;
}
.dropItem  img{
float:left;
margin-left: 33px;
}
.dropItem  span{
	font-size: 14px;
    line-height: 31px;
     font-weight: 900; 
    padding-left: 9px;
   color:#fff;
}
</style>
<c:set var="ctx" value="${pageContext.request.contextPath }" />

<div class="index_top" > 
	<div class="left_logo">
		<a id="a" href="javascript:void(0)" class="dropbtn" onclick="showList(this)" >
			<img id="logoImg" src="${ctx}${currentSystem.logo}" />
		</a>
        <div class="dropdown-content" id="dropdown-a" onmouseleave="hideList(this)">
        </div>
	</div>
	<div class="search_welcome">
						<!--<div class="welDive" >
							欢迎您，
							<security:authentication property="principal.fullname" />
							</div>-->
						<div class="welDive">
							<a class="more loginButtonIndex" href="${ctx}/platform/console/main.ht" title="主页"></a>	
							
							<%-- <span class="more messageIndex" href="${ctx}/platform/console/main.ht" title="信息"><i>66</i><span id="loginButton" ></span>
							<ul style="padding: 3px" class="messageul">
								    <li><a class="more "  resid="-001" target="_blank"><span style="margin-bottom: 3px">信息111</span></a></li>
									<li style="border-top-style: solid;border-top-width: 1px"><a class="more " resid="-002" href="/xtbg/platform/system/sysUser/get.ht?userId=1&amp;canReturn=1" target="_blank">
									<span style="margin-bottom: 3px">信息222</span></a></li>
								</ul>
							</span>
 --%>

							<%--<span class="moreinfo" style="display:block;float:left;margin-left: 17px;margin-right:22px;cursor:pointer;">
								<a id="ima" onclick="openIm()" class="jstx" title="即时通讯"><img src="${ctx}/styles/im/im.png"/></a >

							</span>--%>

<!-- 							<span class="moreinfo" style="display:block;float:left;margin-right:10px;"> -->
<!-- 							<a class="more switch2" resid="-003" href="javascript:;" title="切换岗位"></a> -->
<%-- 								<c:if test="${curPosition!=null}"> --%>
<!-- 									<ul> -->
<%-- 										<c:forEach var="position" items="${positions}"> --%>
<%-- 											<c:choose> --%>
<%-- 							           			<c:when test="${position.posId==curPosition.posId}"> --%>
<%-- 							           				<li><a class="curOrg" posid="${position.posId}">${position.posName}</a></li> --%>
<%-- 							           			</c:when> --%>
<%-- 							           			<c:otherwise> --%>
<%-- 							           				<li><a class="normalOrg" posid="${position.posId}" href="javascript:;">${position.posName}</a></li> --%>
<%-- 							           			</c:otherwise> --%>
<%-- 							           		</c:choose> --%>
<%-- 										</c:forEach> --%>
<!-- 									</ul> -->
<%-- 								</c:if> --%>
<!-- 							</span> -->
							<span class="moreinfo" style="display:block;float:left;margin-right: 3px;">
							<span style="cursor: pointer;text-decoration: underline;" title='设置'> <span id="loginButton" ></span></span>
						
							<!--<span class="xiala"></span>-->
								<ul style="padding: 3px">
								    <li><a class="more edit2"  href="${ctx}/platform/system/sysUser/modifyPwdView.ht?userId=${userId}" resid="-001" href="javascript:;" target="_blank"><span style="margin-bottom: 3px">修改密码</span></a></li>
									<li style="border-top-style: solid;border-top-width: 1px"><a class="more detail2"  resid="-002" href="${ctx}/platform/system/sysUser/get.ht?userId=${userId}&canReturn=1" target="_blank"><span style="margin-bottom: 3px">个人资料</span></a></li>
								</ul>
						 </span>
						<%-- <span  style="display:block;float:left;margin-right:18px;cursor:pointer;">
							<a style="display:block;width:33px;height:33px; margin-top:14px;"  onclick="daka()"  title="打卡签到"><img src="${ctx}/styles/im/daka.png"/></a>
							</span>--%>
						  <a class="more exit2" href="${ctx}/logout" title='退出切换用户'></a>
						<%--  </c:if> --%>
						 <c:if test="${not empty cookie.origSwitch}">
							<a href="${ctx}/j_spring_security_exit_user?j_username=${cookie.origSwitch.value}">退出切换用户</a>
						 </c:if>
						 
					</div>
				<!--<div colspan="2" class="welDive">
					<select id="setSubSystem" onchange="saveCurrentSys();" hasSearch="0">
							<c:forEach var="subSystemItem" items="${subSystemList}">
								<option value="${subSystemItem.systemId}"
									<c:if test="${subSystemItem.systemId==currentSystem.systemId }">selected="selected"</c:if>>
									${subSystemItem.sysName}</option>
							</c:forEach>
					</select>
				</div>-->
		</div>
	</div>
	<div class="index_menu">
		<div class="menuParent" >
			<div id="menuPanel" class="menuPanel"></div>
		</div>
		<div class="nav_button">
			<a class="nav_left" href="javascript:;" onclick="rollRight()" onmousedown="startRoll(1)" onmouseup="breakRoll()" title="向左移动"></a>
			<a class="nav_right" href="javascript:;" onclick="rollLeft()" onmousedown="startRoll(0)" onmouseup="breakRoll()" title="向右移动"></a>
		</div>
	</div>
	<%--<div class="changge_skin"  title='换肤'>
		
	    
	    <a href="javascript:void(0)"  onclick="changeSkin('bjxg')" ><img src="${ctx}/styles/bjxg/images/icons/icons_40-68.png" /> </a>
			<img src="${ctx}/styles/default/images/icons/icons_44-73.png" onclick="changeSkin('other')"/>
		
			<img src="${ctx}/styles/default/images/icons/icons_41-71.png" onclick="changeSkin('blue')"/>
			
			
	
			
	</div>--%>
	<div class="changge_div">
		<a class="changge_a1" href="javascript:void(0)"  onclick="changeSkin('default')"  style="text-decoration: none !important;" >	 </a>
		<a class="changge_a2" href="javascript:void(0)"  onclick="changeSkin('green')"  style="text-decoration: none !important;"></a>
	    <a class="changge_a3" href="javascript:void(0)"  onclick="changeSkin('blue')"  style="text-decoration: none !important;"> </a>
	    <a class="changge_a4" href="javascript:void(0)"  onclick="changeSkin('red')"  style="text-decoration: none !important;"></a>
	    </div> 
	    	<script>
	    	
	    	//记录即时通讯未读消息数量
	    	var msgCount = 0;
	    	
			$(function(){
				 var user=$("#useraccount").val();
				$(".changge_skin").toggle(function(){
						$('.changge_div').animate({opacity:'1'});
						$(".search_welcome").animate({right:'125px'});
						$(".changge_skin").animate({right:'165px'});
				},function(){
					$('.changge_div').animate({opacity:'0'});
					$(".search_welcome").animate({right:'0px'});
					$(".changge_skin").animate({right:'43px'});
				});
				
				$(".messageIndex").hover(function(){
					$(".messageul").toggle();
				});

	
	            // 定时发送心跳
	            setInterval(reConnect, 5000);
				// 构建聊天业务CHAT
	            window.CHAT = {
	                socket: null,
	                init: function() {
	                    if (window.WebSocket) {

	                        if (CHAT.socket != null
	                            && CHAT.socket != undefined
	                            && CHAT.socket.readyState === WebSocket.OPEN) {
	                            return false;
	                        }

	                      //  CHAT.socket = new WebSocket(socketUrl);
	                        CHAT.socket.onopen = CHAT.wsonopen,
							CHAT.socket.onclose = CHAT.wsonclose,
							CHAT.socket.onerror = CHAT.wsonerror,
							CHAT.socket.onmessage = CHAT.wsonmessage;
	                    } else {
	                        alert("浏览器不支持websocket协议...");
	                    }
	                },
	                wsonopen: function() {
	                    console.log("websocket连接已建立...");
	                    // 发送websocket
	                    CHAT.socket.send(',fhadmin-join,'+user+ "oa_pc"); //传入用户名
	                },
	                wsonclose: function() {
	                    console.log("连接关闭...");
	                    //发送下线消息
	                    CHAT.socket.send(',fhadmin-leave,');
	                    CHAT.socket = null;
	                },
	                wsonerror: function() {
	                    console.log("发生错误...");
	                    CHAT.socket = null;
	                },
	                wsonmessage: function(e) {

	                    var message = JSON.parse(e.data);

	                    console.log("接受到消息：" + message);

	                    if('friend' == message.type || 'group' == message.type){ //接收好友或群发送的消息
	                        msgCount ++ ;
	                    }else if('user_join' == message.type){
	                        //上线了
	                    }else if('user_leave' == message.type){
	                        //下线了
	                    }else if('user_online' == message.type){
	                        msgCount ++ ;		//好友设置在线状态
	                    }else if('user_hide' == message.type){
	                        msgCount ++ ;	//好友设置隐身状态
	                    }else if('user_applyfriend' == message.type){
	                        msgCount ++ ;					//申请加好友
	                    }else if('user_emove' == message.type){
	                        msgCount ++ ;		//删除好友(被动删，被拉黑)
	                    }else if('agreefriend' == message.type){
	                        msgCount ++ ;			//对方同意添加好友
	                    }else if('applyqgroup' == message.type){
	                        msgCount ++ ;					//申请加群申请
	                    }else if('agreeqgroup' == message.type){
	                        msgCount ++ ;			//对方同意群申请
	                    }else if('kickoutqgroup' == message.type){
	                        msgCount ++ ;		//踢出群
	                    }else if('delqgroup' == message.type){
	                        msgCount ++ ;	//群解散
	                    }
	                    
	                    showImMessage(message.username, message.content, msgCount);

	                },
	                keepalive: function() {
	                    console.log("websocket心跳...");
	                    // 发送心跳
	                    CHAT.socket.send(',fhadmin-keepalive,');
	                }
	            };
				
	            /**
	             * 与FH即时通讯后台连接，能实时收到消息提醒
	             */
	           // CHAT.init();

	            /**
	             * 获取离线未读消息

	            $.ajax({
	                type: "POST",
	                url: '${ctx}/im/imController/getNoreadMsgByUserName.ht',		//未读消息(离线消息)接口
	                data: {fh_url:serverUrl,username:user,tm:new Date().getTime()},
	                dataType:'json',
	                cache: false,
	                success: function(json){

	                    if (json.result === 1) {
	                        var message = $.parseJSON(json.message);
	                        var result = $.parseJSON(message.message);
	                        if('has' == result.result){
	                            $.each(result.list, function(i, list){
	                                msgCount++;
 	                                showImMessage(list.NAME, list.CONTENT, msgCount);
	                            });
	                        } else if('no' == result.result) {
// 	                            $("#ima").tips({
// 	                                side:3,
// 	                                msg:  "消息数量为0",
// 	                                bg:'#AE81FF',
// 	                                time:10
// 	                            });
	                        }
	                    }else {
	                        alert(json.message);
	                    }
	                }
	            });
			});
				 */

			//打卡
            function daka(){
				$.ligerDialog.confirm("确认打卡？","提示",function(rtn){
					if(!rtn){
						return;
					}
					$.ajax({
	                    type: "POST",
	                    url: '${ctx}/platform/console/savePunch.ht',  
	                    data: {tm:new Date().getTime()},
	                    dataType:'json',
	                    cache: false,
	                    success: function(json){
	                        if(json.result == 1){
	                        	   if (json.message=='0'){
	                        		   $.ligerDialog.success("谢谢，打卡成功!", '提示', function(rtn) {
	                        			   window.location.href = "${ctx}/platform/console/main.ht";   
	                        		   } ); 

	                        	   }else if(json.message=='1'){
	                        		   $.ligerDialog.warn("温馨提示,上班迟到!", '提示', function(rtn) {
	                        			   window.location.href = "${ctx}/platform/console/main.ht";   
	                        		   } );
	                        	   }
	                        	   else if(json.message=='2'){
	                        		   $.ligerDialog.warn("温馨提示,下班早退!", '提示', function(rtn) {
	                        			   window.location.href = "${ctx}/platform/console/main.ht";   
	                        		   } );
	                        	   }
	                        	   else if(json.message=='4'){
	                        		   $.ligerDialog.warn("您已完成上下班打卡，无需重复打卡!", '提示' );
	                        	   }

	                        }
	                    }
	                });
				});
            }
			
            /**
    		 * 更新未读消息数量
    		 * 显示消息内容
    		 */
            function showImMessage(user, content, count) {

                //$("#msgCount").html("消息（"+count+"）");
                $("#ima").tips({
                    side:3,
                    msg:  '【'+user+'】:'+content,
                    bg:'#AE81FF',
                    time:10
                });
            }

            //websocket重新连接
			//心跳连接
            function reConnect() {
           		$("#ima").removeClass();
            	if(msgCount==0){
                	$("#ima").addClass("jstx");
            	}else{
            		$("#ima").addClass("jstx2  jstx");
            	}
                if (CHAT.socket == null || CHAT.socket === undefined || CHAT.socket.readyState != WebSocket.OPEN) {
                   // CHAT.init();
                }else {
                    // 定时发送心跳
                   // CHAT.keepalive();
                }

            }
			
            /**
             * 点击消息图标，跳转FH首页，需要传递当前登录用户的帐号和密码
             * 需要注意的是，当前帐号和密码，必须与FH帐号密码同步
             * 否则，即时通讯不好使
             * 懂？？？？
             */
            function openIm() {
            	var user=$("#useraccount").val();
                $.ajax({
                    type: "POST",
                    url: '${ctx}/im/imController/encrypt.ht',		//加密接口
                    data: {username:user, tm:new Date().getTime()},//传入用户名
                    dataType:'json',
                    cache: false,
                    success: function(json){

                        if(json.result === 1) {
                            msgCount = 0;
                            $("#msgCount").html("消息（"+msgCount+"）");
                            window.open(serverUrl+"/appiminterface/im_login?param="+json.message);
                        }

                    }
                });
            }
            
		</script>
	<div class="head_bg">
	</div>
	<input id="useraccount" value="<security:authentication property="principal.account" />"  type="hidden" />
</div>