<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="/WEB-INF/taglib/c.tld" prefix="c"%>
<%@ include file="../../common/init.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="../../common/top.jsp"%>
<link rel="stylesheet" type="text/css" href="${ctx}/static/style/exam.css">
<link rel="stylesheet" type="text/css" href="${ctx}/static/themes/bootstrap/bootstrapSwitch.css">
<script type="text/javascript" src="${ctx}/static/js/jquery.edatagrid.js"></script>
<script type="text/javascript" src="${ctx}/static/js/bootstrapSwitch.js"></script>
<script type="text/javascript" src="${ctx}/static/js/bootstrap-alert.js"></script>
<script type="text/javascript" src="${ctx}/static/js/bootstrap.js"></script>
</head>
<body class="easyui-layout">
	<%@ include file="../../common/header.jsp"%>
	<div data-options="region:'center',title:'首页 -【考试数据维护】- 设置评卷员'">
		<div class="easyui-layout" data-options="fit:true,border:false">
			<div data-options="region:'center'"
				style="border-color: #ccc; border-left: none;">
				<div class="row-fluid exam-add-content">
					<div class="exam-add-right span10 ">
						<div class="current-position">
							<div class="curr-nav">当前位置：新建考试-设置评卷员-${currentSubject.name}</div>
							<%@ include file="../../common/message.jsp"%>
						</div>
						<div class="detail-cont row-fluid">
							<div class="span2 detail-cont-left">
								<div class="detail-cont-left-title">科目</div>
								<div class="detail-cont-left-subnav">
									<span class="all-btn"> </span>
									<ul id="subjectList">
										<c:forEach items="${subjectList}" var="subject">
										<c:if test="${subject.current==true }">
											<li class="curr" data-subject-id="${subject.id}" title="${subject.name}">
												<a href="javascript:void(0)">${subject.name}
													<i class="icon-right icon-white fr icon-mr"></i>
												</a>
											</li>
										</c:if>
										<c:if test="${subject.current==false }">
											<li class="<c:if test="${subject.success==true }">success</c:if><c:if test="${subject.success==false }">wrong</c:if>"
												data-subject-id="${subject.id}" title="${subject.name}">
												<a href="${ctx}/admin/exam-param/marker/${subject.id}">${subject.name}
													<i class="<c:if test="${subject.success==true }">icon-ok</c:if> 
													<c:if test="${subject.success==false }">icon-sign</c:if>
													fr icon-mr"></i>
												</a>
											</li>
										</c:if>
										</c:forEach>
									</ul>
								</div>
							</div>
							
							<div id="marker-list-div" class="span10 detail-cont-right" >
								<div class="detail-cont-right-title">评卷员列表</div>
								<div class="detail-cont-right-content">
									<div class="serach-btn">
										<ul>
										<!--  
										<li>
											<span class="switch-text fl">是否可登录：</span>
											<div class="switch fr">
												<input type="checkbox" checked />
											</div>
										</li>
										<li>
											<button type="submit" class="btn">
												<i class="icon-search"></i> 搜索
											</button>
										</li> 
										-->
										<li>
											<button type="button" class="btn btn-primary fr" id="add-button">
												<i class="icon-plus icon-white"></i> 添加
											</button>
										</li>
										<li class="multi-control" style="display:none">
											<button class="btn btn-danger fr" id="multi-delete-button">
												<i class="icon-trash icon-white"></i> 全部删除
											</button>
										</li>
										<!-- 
										<li class="multi-control" style="display:none">
											<span class="switch-text fl">是否可登录：</span>
											<div class="switch data-on-label="是" data-off-label="否"">
												<input type="checkbox" checked />
											</div>
										</li>
										 -->
										</ul>
									</div>
									
									<div class="tab-list list-bg">
										<em class="list-num"><input type="checkbox" id="multi-checkbox"></em> 
										<i class="list-text"><strong>登录名</strong></i> 
										<i class="list-text"><strong>姓名</strong></i> 
										<i class="list-text"><strong>密码</strong></i> 
										<i class="list-text"><strong>是否可登录</strong></i>
										<p class="list-edit mt1">
											<strong>操作</strong>
										</p>
									</div>
									<c:forEach items="${markerList}" var="marker">
										<div class="tab-list marker-list" data-value="${marker.id}">
											<em class="list-num"><input class="marker-checkbox" type="checkbox"></em> 
											<i class="list-text code-text">${marker.code}</i> 
											<i class="list-text name-text">${marker.name}</i>
											<i class="list-text password-text">${marker.password}</i> 
											<i class="list-text status-text" data-value="${marker.status}">
												<c:if test="${marker.status==1}">是</c:if>
												<c:if test="${marker.status==0}">否</c:if>
											</i>
											<p class="list-edit">
												<a class="btn btn-primary edit-button">编辑</a> 
												<a class="btn btn-danger delete-button">删除</a>
											</p>
										</div>
										<div class="tab-edit marker-edit-list" data-value="${marker.id}" style="display:none">
											<em class="list-num-no"></em> 
											<i class="list-text"><input class="input-small code-input" type="text" value="${marker.code}" disabled/></i> 
											<i class="list-text"><input class="input-small name-input" type="text"></i>
											<i class="list-text"><input class="input-small password-input" type="text"></i> 
											<i class="list-text">
												<div class="switch switch-small mt2" data-on-label="是" data-off-label="否"><input type="checkbox" checked/></div>
											</i>
											<p class="list-edit">
												<a class="btn btn-success save-button">保存</a>
												<a class="btn cancel-button">取消</a>
											</p>
										</div>
									</c:forEach>
								</div>
							</div>
							
							<div id="marker-add-div" class="span10 detail-cont-right" style="display:none">
								<div class="detail-cont-right-title">添加评卷员</div>
								<div class="detail-cont-right-content">
									<ul class="nav nav-tabs weight-no">
  										<li class="active"><a href="#manual-div" data-toggle="tab">批量创建</a></li>
  										<!--  <li><a href="#import-div" data-toggle="tab">EXCEL导入</a></li>-->
									</ul>
									<div class="tab-content">
										<div class="tab-pane active change" id="manual-div">
											<form id="add-marker-form" action="${ctx}/admin/exam-param/marker/addmarkers" method="post">
												<input type="hidden" name="classTypeSubjectId" value="${classTypeSubjectId}"/>
												<input type="hidden" name="examId" value="${examId}"/>
												<input type="hidden" name="schoolId" value="${schoolId}"/>
												<input type="hidden" name="markerType" value="0"/>
												<ul class="fl">
													<li>
														<span>代码前缀</span>
														<input id="codePrefix" name="codePrefix" class="input-large" type="text" onblur="queryStartValue()"/>
													</li>
													<li>
														<span>代码起始值</span>
														<input id="startValue" name="startValue" class="input-large" type="text"/>
													</li>
													<li>
														<span>评卷员个数</span>
														<input name="number" class="input-large" type="text"/>
													</li>
													<li>
														<span>代码位数</span>
														<input name="bits" class="input-large" type="text"/>
													</li>
													<li>
														<span> 
															<label class="radio fr mr-t1">
																<input type="radio" name="passwordType" id="optionsRadios1" value="1" checked>统一密码
															</label>
														</span> 
														<input name="password" class="input-large" type="text" placeholder="输入密码"/>
													</li>
													<li>
														<span> 
															<label class="radio fr mr-t1">
																<input type="radio" name="passwordType" id="optionsRadios0" value="0">随机密码
															</label>
														</span> 
														<input name="passwordLen" class="input-large" type="text" placeholder="密码长度"/>
													</li>
													<li>
														<span>是否允许登录</span> 
														<select name="status">
															<option value="1">是</option>
															<option value="0">否</option>
														</select>
													</li>
												</ul>
												<div class="control-group mr-t mr-r">
													<div class="controls">
														<a class="btn btn-primary" id="manual-submit-button">保存</a>
														<a class="btn return-button">返回</a>
													</div>
												</div>
											</form>
										</div>
										
										<div class="tab-pane leading-in" id="import-div">
											 <!--  
											<ul>
												<li><span>附件：</span><input name="" type="file"></li>
												<li><span>模板：</span>112.xls</li>
											</ul>
											<div class="control-group fl mr-t">
												<div class="controls">
													<a href="exam05-3.html"><button class="btn btn-primary"
															type="button">保存</button></a>
													<button class="btn return-button" type="button">返回</button>
												</div>
											</div>
											-->
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
</body>
<script type="text/javascript">
$(document).ready(function() {
	$('.nav-tabs a').click(function (e) {
		e.preventDefault();
		$(this).tab('show');
	});
	$('.delete-button').click(function(){
		del($(this).parent().parent().attr('data-value'));
	});
	$('.edit-button').live("click", function(){
		var markerDiv = $(this).parent().parent();
		var marker = {
				id: markerDiv.attr('data-value'),
				name: markerDiv.find('.name-text').html(),
				password: markerDiv.find('.password-text').html(),
				status: markerDiv.find('.status-text').attr('data-value')==1
		};
		var editDiv = $('.marker-edit-list[data-value="'+marker.id+'"]');
		editDiv.find('.name-input').val(marker.name);
		editDiv.find('.password-input').val(marker.password);
		editDiv.find('div.switch').bootstrapSwitch('setState', marker.status);
		markerDiv.hide();
		editDiv.show();
	});
	$('.save-button').live("click", function(){
		var editDiv = $(this).parent().parent();
		var marker = {
			id: editDiv.attr('data-value'),
			name: editDiv.find('.name-input').val(),
			password: editDiv.find('.password-input').val(),
			status: editDiv.find('div.switch').bootstrapSwitch('status')?1:0
		}
		if(marker.password==''){
			alert("评卷员密码不能为空！");
			return;
		}
		$.post('${ctx}/admin/exam-param/marker/save.json', marker, function(obj){
			if(obj.success){
				alert("保存成功");
				var markerDiv = $('.marker-list[data-value="'+marker.id+'"]');
				markerDiv.find('.name-text').html(marker.name);
				markerDiv.find('.password-text').html(marker.password);
				markerDiv.find('.status-text').html(marker.status==1?'是':'否');
				markerDiv.find('.status-text').attr('data-value', marker.status);
				editDiv.hide();
				markerDiv.show();
			}else{
				alert(obj.message);
			}
		});	
	});
	$('.cancel-button').live("click", function(){
		var id=$(this).parent().parent().attr('data-value');
		$('.marker-list[data-value="'+id+'"]').show();
		$(this).parent().parent().hide();
	});
	$('#add-button').click(function(){
		initAddDiv();
		$('#marker-list-div').hide();
		$('#marker-add-div').show();
	});
	$('.return-button').click(function(){
		$('#marker-list-div').show();
		$('#marker-add-div').hide();
	});
	$('#manual-submit-button').click(function(){
		var passwordType = $('#add-marker-form :input[name=passwordType]:checked').val();
		var password = $('#add-marker-form :input[name=password]').val();
		var passwordLength = $('#add-marker-form :input[name=passwordLen]').val();
		if(passwordType==1 && password==''){
			alert("统一密码不能为空");
			return false;
		}
		if(passwordType==0 && (passwordLength=='' || passwordLength<1)){
			alert("随机密码长度不能小于1");
			return false;
		}
		$('#add-marker-form').submit();
	});
	$('#multi-checkbox').click(function(){
		if($(this).attr('checked')){
			$('.marker-list :checkbox').each(function(index, obj){
				$(obj).attr("checked","true");
			});
		}else{
			$('.marker-list :checkbox').each(function(index, obj){
				$(obj).removeAttr("checked");
			});
		}
		toggleMultiControl();
	});
	$('.marker-list :checkbox').click(toggleMultiControl);
	$('#multi-delete-button').click(function(){
		var ids = new Array();
		$('.marker-list input:checked').each(function(index, obj){
			ids.push($(obj).parent().parent().attr('data-value'));
		});
		multiDel(ids);
	});
});

function toggleMultiControl(){
	if($('.marker-list input:checked').length>0){
		$('.multi-control').show();
	}else{
		$('.multi-control').hide();
	}
}

function del(markerId) {
	if (confirm('确定删除这个评卷员吗？')) {
		$.post('${ctx}/admin/exam-param/marker/delete.json', {markerId: markerId}, function(obj){
			if(obj.success){
				$('.marker-list[data-value="'+markerId+'"]').remove();
				$('.marker-edit-list[data-value="'+markerId+'"]').remove();
				alert("删除成功");
			}else{
				alert(obj.message);
			}
		});
	}
}

function multiDel(markerIds) {
	if(markerIds.length>0 && confirm('确定删除这些评卷员吗？')){
		$.post('${ctx}/admin/exam-param/marker/multi-delete.json', {markerIds: markerIds.join(',')}, function(obj){
			if(obj.count>0){
				$.each(obj.ids.split(','), function(index, id){
					$('.marker-list[data-value="'+id+'"]').remove();
					$('.marker-edit-list[data-value="'+id+'"]').remove();
				});
			}
		});
	}
}

function initAddDiv(){
	$('#add-marker-form :input').each(function(){
		if(!$(this).is(':hidden')){
			$(this).val('');
		}
	});
}

function queryStartValue(){
	var codePrefix=$('#codePrefix').val();
	$.post('${ctx}/admin/exam-param/marker/query-start-value.json',{codePrefix:codePrefix, classTypeSubjectId: '${classTypeSubjectId}', examId: ${examId}},function(res){
		$("#startValue").val(res+1);
	});
}
</script>
</html>