skyversation
/
meidu2021


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
							<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<html>
	<head>
		<meta charset="utf-8" />
		<title>看板设置</title>
	</head>
	<body>
		<div id="board" style="display: none;"></div>
		<div class="w-board">
			<div class="board-title">
				栏目看板设置
				<span class="closed-icon" onclick="closeBoard()"></span>
			</div>
			<div class="all-opr">
				<span class="chk ml20"></span>
				<span class="chk-t ml10">全选</span>
				<button class="btn-save">保存</button>
			</div>
			<ul class="board-list">
				<c:forEach items="${dashboardDtos }" var="dboard">
					<li class="board <c:if test="${dboard.requiredFlag == 0 }">board-disab</c:if><c:if test="${dboard.requiredFlag == 1 }">board-def</c:if>" >
						<input type="hidden" value="${dboard.id}">
						<div style="margin-top: 11px;">
							<span class="chk ml20"><c:if test="${dboard.checkedStatus == 0 }"><span class="chked <c:if test="${dboard.requiredFlag == 0 }">chked-disable</c:if>"></span></c:if></span>
							<span class="chk-t ml10">${dboard.name }</span>
						</div>
						<span class="up-icon"></span>										
					</li>
				</c:forEach>
			</ul>
		</div>
	</body>
</html>
<script>
function openBoard(){
	$('#boarddiv').show();	
		$("body").height($(window).height()).css({
		  "overflow-y": "hidden"
		});
}

function closeBoard(){
	$('#boarddiv').hide();	
	$('body').height($(window).height()).css({
		"overflow-y": "auto"
	});
}

$(".up-icon").on("click",function(){
	var tIndex=$(this).parent().index()-1;
	if(tIndex>=0){
		var pSbiling=$(this).parent().parent().children(".board")[tIndex];
		
		$(this).parent().fadeOut(100,function(){
			$(this).insertBefore(pSbiling);
			$(this).fadeIn(500,function(){			
				$(this).css({
					"box-shadow":"0px 0px 10px #5187c9 inset",
					"border-color":"#5187c9"
				});
				var xThis=$(this);
				setTimeout(function(){
					xThis.css({
								"box-shadow":"0 0 10px 0 rgba(0, 0, 0, 0.1)",
								"border-color":"#dcdcdc"
							});
				},400);			
			});
		});
	}
	liHover($(this).parent());//鼠标经过事件
});
function liHover(name){//鼠标经过事件
	name.hover(function() {
		$(this).css({
			"border" : "1px solid #5187c9",
			"box-shadow" : "0 0 10px 0 rgba(67, 123, 191, 0.2)"
		});
	},function(){
		name.css({
			"border" : "1px solid #dcdcdc",
			"box-shadow" : "0 0 10px 0 rgba(0, 0, 0, 0.1)"
		});

    });
};

$(".board-def .chk").on("click",function(){
	var checkhtml = $(this).html();
	if(checkhtml == ""){
		$(this).html('<span class="chked"></span>');
	}else{
		$(this).html('');
	}
	var count = $(".board-def .chk .chked").length;
	var licount = $(".board-def").length;
	if(count == licount){
		$(".all-opr .chk").html('<span class="chked"></span>');
	}else{
		$(".all-opr  .chk").html('');
	}
});

$(".all-opr .chk").on("click",function(){
	var checkhtml = $(this).html();
	if(checkhtml == ""){
		$(this).html('<span class="chked"></span>');
		$(".board-def .chk").html('<span class="chked"></span>');
	}else{
		$(this).html('');
		$(".board-def .chk").html('');
	}
});

$(".btn-save").on("click",function(){
	var objs = $(".board-list li");
	var ids=[];
	var requiredFlags=[];
	var checkedStatus=[];
	var sortNums=[];
	$.each(objs,function(i,obj){
		var id = $(obj).find('input').val();
		var flag = $(obj).find('.chk').html() != '' ? 0:1;
		var flag1 = $(obj).hasClass("board-def") ? 1:0;
		ids.push(id);
		checkedStatus.push(flag);
		sortNums.push(i);
		requiredFlags.push(flag1);
	});
	var formdom = '<form method="post" id="formdom" action="homepageController.do?updateBoards"><input name="ids" value="'+ids+'" /><input name="requiredFlags" value="'+requiredFlags+'" /><input name="checkedStatus" value="'+checkedStatus+'" /><input name="sortNums" value="'+sortNums+'" /></form>';
	$("#board").html(formdom);
	handleAjaxSimple("homepageController.do?updateBoards", $("#formdom").serialize(), boardhandleSuccess);
	
});

function boardhandleSuccess(){
	location.reload(); 
}
//选择看板悬浮样式  兼容ie10 hover样式ie10不启作用
$(".board-def").on("mouseover mouseout",function(event){
	 if(event.type == "mouseover"){
	   //鼠标悬浮
	    $(this).css({
			"border" : "1px solid #5187c9",
			"box-shadow" : "0 0 10px 0 rgba(67, 123, 191, 0.2)"
		});
		$(this).find(".up-icon").show();
	
	 }else if(event.type == "mouseout"){
	 	 //鼠标离开
	 	$(this).css({
			"border" : "1px solid #dcdcdc",
			"box-shadow" : "0 0 10px 0 rgba(0, 0, 0, 0.1)"
		});
	    $(this).find(".up-icon").hide();
	 }
});

//首页悬浮 兼容ie10 hover样式ie10不启作用
$(".float-icon").on("mouseover mouseout",function(event){
	 if(event.type == "mouseover"){
	   //鼠标悬浮
	    $(this).css({
			"background" : "#5187C9",
			"cursor": "pointer"
		});
		$(".float-icon").find(".board-set-icon").css({
			"background" : "url(images/board-set-icon-sel.png) no-repeat"
		});
	
	 }else if(event.type == "mouseout"){
	 	 //鼠标离开
	 	$(this).css({
			"background" : "rgba(0,0,0,0.1)",
			"cursor": "pointer"
		});
	    $(".float-icon").find(".board-set-icon").css({
			"background" : "url(images/board-set-icon-def.png) no-repeat"
		});
	 }
});


</script>