<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>评卷进度</title>
	<meta name="decorator" content="default"/>
	<%@include file="/WEB-INF/views/include/head.jsp" %>
	<style type="text/css">.sort{color:#0663A2;cursor:pointer;}</style>
	<script src="${ctxStatic}/echarts/echarts.min.js" type="text/javascript"></script>
</head>
<body>
    <ul class="nav nav-tabs">
        <li class="active"><a href="##">评卷进度</a></li>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-group')}">
        	<li><a href="${ctx}/admin/exam/group?subjectCode=${query.code}">分组管理</a></li>
        </c:if>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-marker')}">
        	<li><a href="${ctx}/admin/exam/marker?subjectCode=${query.code}">评卷员管理</a></li>
        </c:if>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-trial')}">
        	<li><a href="${ctx}/admin/exam/trial?subjectCode=${query.code}">试评管理</a></li>
        </c:if>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-library')}">
        	<li><a href="${ctx}/admin/exam/library?subjectCode=${query.code}">任务管理</a></li>
        </c:if>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-arbitrate')}">
        	<li><a href="${ctx}/admin/exam/arbitrate?subjectCode=${query.code}">仲裁管理</a></li>
        </c:if>
        <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-quality')}">
        	<li><a href="${ctx}/admin/exam/quality?subjectCode=${query.code}">质量监控</a></li>
        </c:if>
    </ul>
     <c:if test="${web_user.schoolAdmin==true}">
    	<div id="main" style="width: 1000px;height:400px;"></div>
   	</c:if>
	<form id="searchForm" action="${ctx}/admin/exam/mark" method="post" class="breadcrumb form-search">
		<input type="hidden" id="pageNumber" name="pageNumber" value="${query.pageNumber }"/>
		<input type="hidden" id="pageSize" name="pageSize" value="${query.pageSize }"/>
		<div>
			<label>科目</label>
			<select class="input-large" name="code">
				<option value="">请选择</option>
				<c:forEach items="${subjectList}" var="subject">
				<option value="${subject.code}" <c:if test="${subject.code==query.code}">selected</c:if>>${subject.code}-${subject.name}</option>
				</c:forEach>
			</select>
			<c:if test="${web_user.schoolAdmin==true }">
			<label>完成进度</label>
			<select class="input-small" name="finished">
				<option value="" <c:if test="${null==query.finished}">selected</c:if>>请选择</option>
				<option value="1" <c:if test="${query.finished!=null &&query.finished}">selected</c:if>>已完成</option>
				<option value="0" <c:if test="${query.finished!=null &&!query.finished}">selected</c:if>>未完成</option>
			</select>
			</c:if>
			&nbsp;
			<input id="btnSubmit" class="btn btn-primary" type="button" value="查询" onclick="goSearch()"/>
			&nbsp;
            <input id="btnFinish" class="btn" type="button" value="关闭" onclick="goFinish()"/>
			&nbsp;
			<div class="btn-group">
				<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
					导出<span class="caret"></span>
				</a>
				<ul class="dropdown-menu">
					<li><a href="##" onclick="goExportProgress()">整体评卷进度</a></li>
					<li><a href="##" onclick="goExportMarker()">评卷员工作量</a></li>
				</ul>
			</div>
		</div>
	</form>
	<tags:message content="${message}"/>
	<form id="checkForm" action="${ctx}/admin/exam/mark/finish" method="post" class="breadcrumb form-search">
	<table id="contentTable" class="table table-striped table-bordered table-condensed">
		<thead>
			<tr>
				<th><input type="checkbox" id="codes">科目</th>
				<th>上传人数</th>
				<th>主观总分</th>
				<th>分组总数</th>
				<th>完成进度</th>
				<th>待复核量</th>
			</tr>
		</thead>
		<tbody>
		<c:forEach items="${resultList}" var="result">
			<tr>
				<td><input type="checkbox" class="codes" name="codes" value="${result.subject.code}">
				${result.subject.code}-${result.subject.name}&nbsp;${result.subject.remark}
				<c:if test="${!result.groupFinish}"><img class="icon-info-sign" title="主观分未完成分组" src="${ctxStatic }/images/sgin-icon@2x.png"></img></c:if>
				</td>
				<td>${result.subject.uploadCount}</td>
				<td>
				    <fmt:formatNumber type="number" value="${result.subject.subjectiveScore}" pattern="###.###"/>
				</td>
				<td>
				<c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-group')}">
				<a href="${ctx}/admin/exam/group?subjectCode=${result.subject.code}">
					${result.groupCount}</a>
					</c:if>
					<c:if test="${!fnx:hasPrivilegeCode(role_privilege_codes, 'exam_mark-group')}">
					${result.groupCount}
					</c:if>
				</td>
				<td>${result.percent}</td>
				<td>${result.markedCount}</td>
			</tr>
		</c:forEach>
		</tbody>
	</table>
	</form>
	<div class="pagination">${query}</div>
<script type="text/javascript">
function page(n,s){
	$("#pageNumber").val(n);
	$("#pageSize").val(s);
	$("#searchForm").attr('action', '${ctx}/admin/exam/mark');
	$("#searchForm").submit();
	return false;
}
function goSearch(){
	$("#pageNumber").val(1);
	$("#pageSize").val('${query.pageSize}');
	$("#searchForm").attr('action', '${ctx}/admin/exam/mark');
	$("#searchForm").submit();
	return false;
}
function goExportProgress(){
	$("#searchForm").attr('action', '${ctx}/admin/exam/mark/export-progress');
	$("#searchForm").submit();
	return false;
}
function goExportMarker(){
	$("#searchForm").attr('action', '${ctx}/admin/exam/mark/export-marker');
	$("#searchForm").submit();
	return false;
}
if(document.getElementById('main')!=undefined){
var markedCount =${markedCount};
var unMarkedCount =${unMarkedCount};
var finishCount =${finishCount};
var unFinishCount =${unFinishCount};
var myChart = echarts.init(document.getElementById('main'));
var unMarkedCountTitle="任务待完成"+unMarkedCount;
var markedCountTitle="任务已完成"+markedCount;
var unFinishCountTitle="科目待完成"+unFinishCount;
var finishCountTitle="科目已完成"+finishCount;
myChart.setOption({
	title: [{
        text: '阅卷总进度'
    }, {
        text: '科目阅卷进度',
        left: '50%',
     
    }],
    tooltip: [{
        trigger: "item",
        formatter: "占比:{d}%",
    }],
	legend: [{
	    orient: "vertical",
	    left: "left",
	    top: "50px",
	    data: [unMarkedCountTitle, markedCountTitle]
	  },
	  {
		orient: "vertical",
	    left: "50%",
	    top: "50px",
	    data: [unFinishCountTitle, finishCountTitle]
	}],
    series : [
        {
        type: 'pie',
        radius: '55%',
        center: ['25%', '50%'],
        data:[
              {value:unMarkedCount, name:unMarkedCountTitle},
  			  {value:markedCount, name:markedCountTitle}
           ],
        animation: false,
        label: {
            position: 'outer',
            alignTo: 'none',
            bleedMargin: 5
        },
        color:["#7CB5EC",'#FE8463']
    }, {
        type: 'pie',
        radius: '55%',
        center: ['75%', '50%'],
        data:[
            {value:unFinishCount, name:unFinishCountTitle},
			{value:finishCount, name:finishCountTitle}
         ],
        animation: false,
        label: {
            position: 'outer',
            alignTo: 'none',
            bleedMargin: 5
        },
        color:["#7CB5EC",'#FE8463']
    }]
})
}

	$("#codes").change(function () {
        if ($("#codes").is(':checked')) {
            $(".codes").attr("checked", true);
        } else {
        	$(".codes").attr("checked", false);
        }
    });
    
    $(".codes").change(function () {
    	var all = true;
    	$("input[name='codes']").each(function(){
    		if(!$(this).is(':checked')){
    			all = false;
    		}
    	})
		 $("#codes").attr("checked", all);
    });
    function goFinish() {
    	var check_list = []
    	$("input[name='codes']:checked").each(function(){
    		check_list.push($(this).val())
    	})
        if(check_list.length==0) {
            alert('请选择');
            return false;
        }
        $("#checkForm").submit();
        return false;
    }
</script>	
</body>
</html>