<%@ 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" %>
    <%@include file="/WEB-INF/views/include/dialog.jsp" %>
    <link rel="stylesheet" type="text/css" href="${ctxStatic}/jBox/Source/jBox.css">
    <script type="text/javascript" src="${ctxStatic}/jBox/Source/jBox.min.js"></script>
    <script type="text/javascript" src="${ctxStatic}/echarts/echarts.min.js"></script>
    <style type="text/css">.sort {
        color: #0663A2;
        cursor: pointer;
    }</style>
</head>
<body>
<ul class="nav nav-tabs">
				<c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-total')}">
		<li><a href="${ctx}/admin/exam/reportSubject" data-i18n-text="report.subject">总量统计</a></li>
		</c:if>
		<c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-range')}">
		<li><a href="${ctx}/admin/exam/reportSubjectRange">分段统计</a></li>
		</c:if>
		<c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-college')}">
    <li  class="active"><a href="${ctx}/admin/exam/reportSubjectCollege?subjectCode=${query.subjectCode}" data-i18n-text="report.college">学院分析</a></li>
    </c:if>
    <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-teacher')}">
    <li><a href="${ctx}/admin/exam/reportSubjectTeacher?subjectCode=${query.subjectCode}" data-i18n-text="report.teacher">任课老师分析</a></li>
    </c:if>
    <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-class')}">
    <li><a href="${ctx}/admin/exam/reportSubjectClass?subjectCode=${query.subjectCode}" data-i18n-text="report.class">班级分析</a></li>
    </c:if>
    <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-objective_question')}">
    <li><a href="${ctx}/admin/exam/reportSubjectQuestion?subjectCode=${query.subjectCode}&objective=true" data-i18n-text="report.question.objective">客观题分析</a>
    </li>
    </c:if>
    <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-subjective_question')}">
    <li><a href="${ctx}/admin/exam/reportSubjectQuestion?subjectCode=${query.subjectCode}&objective=false" data-i18n-text="report.question.subjective">主观题分析</a>
    </li>
    </c:if>
    <c:if test="${fnx:hasPrivilegeCode(role_privilege_codes, 'exam_report_subject-group')}">
    <li><a href="${ctx}/admin/exam/reportSubjectGroup?subjectCode=${query.subjectCode}" data-i18n-text="report.group">分组统计分析</a></li>
	</c:if>
	</ul>
<form id="searchForm" action="${ctx}/admin/exam/reportSubjectCollege" 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 data-i18n-text="report.college.subject">科目：</label>
        <select class="input-large" id="subjectCode" name="subjectCode" >
            <c:forEach items="${subjectList }" var="subject">
                <option value="${subject.code }"
                        <c:if test="${query.subjectCode eq subject.code }">selected</c:if>>${subject.code}-${subject.name}</option>
            </c:forEach>
        </select>
        &nbsp;
        <label data-i18n-text="report.college.name">学院：</label>
        <input type="text" name="collegeName" value="${query.collegeName}" maxlength="10" class="input-small"/>
        &nbsp;
        <input id="btnSubmit" class="btn btn-primary" type="button" value="查询" onclick="goSearch()" data-i18n-value="report.college.search"/>
         &nbsp;
		<!-- <input id="export-button" class="btn" type="button" value="导出" data-i18n-value="report.college.export"/>
		 &nbsp; -->
        <input class="btn btn-primary" type="button" value="查看统计图" onclick="viewCollegeEcharts()" data-i18n-value="report.college.chart"/>
    </div>
</form>
	<form id="exportForm" action="${ctx}/admin/exam/reportSubjectCollege/export" method="post" class="breadcrumb form-search hide">
        <input type="text" name="subjectCode" value="${query.subjectCode}"  class="input-small"/>
        <input type="text" name="collegeName" value="${query.collegeName}"  class="input-small"/>
	</form>
<tags:message content="${message}"/>
<table id="contentTable" class="table table-striped table-bordered table-condensed">
    <thead>
    <tr>
        <th data-i18n-text="report.college.name">学生院系</th>
		<th data-i18n-text="report.subject.totalCount">报考人数</th>
		<th data-i18n-text="report.subject.realityCount">有效人数</th>
        <th data-i18n-text="report.college.avgScore">平均分</th>
        <th data-i18n-text="report.college.maxScore">最高分</th>
        <th data-i18n-text="report.college.minScore">最低分</th>
        <th data-i18n-text="report.college.passCount">及格数</th>
        <th data-i18n-text="report.college.passRate">及格率</th>
        <th data-i18n-text="report.college.excellentCount">优秀数</th>
        <th data-i18n-text="report.college.excellentRate">优秀率</th>
    </tr>
    </thead>
    <tbody>
    <c:forEach items="${list}" var="reportSubjectCollege">
        <tr>
            <td>${reportSubjectCollege.collegeName}</td>
            <td>${reportSubjectCollege.totalCount}</td>
			<td>${reportSubjectCollege.realityCount}</td>
            <td><fmt:formatNumber type="number" value="${reportSubjectCollege.avgScore}" pattern="0.00" maxFractionDigits="2"/></td>
            <td>${reportSubjectCollege.maxScore}</td>
            <td>${reportSubjectCollege.minScore}</td>
            <td>${reportSubjectCollege.passCount}</td>
            <td><fmt:formatNumber type="number" value="${reportSubjectCollege.passRate}" pattern="0.00" maxFractionDigits="2"/></td>
            <td>${reportSubjectCollege.excellentCount}</td>
            <td><fmt:formatNumber type="number" value="${reportSubjectCollege.excellentRate}" pattern="0.00" maxFractionDigits="2"/></td>
        </tr>
    </c:forEach>
    </tbody>
</table>
<script type="text/javascript">
$("#export-button").click(function(){
	if ($("#subjectCode").val() == null || $("#subjectCode").val() == '') {
        alert('请选择科目');
        return;
    }
	$("#exportForm").attr("action","${ctx}/admin/exam/reportSubjectCollege/export");
	$("#exportForm").submit();
});

    function viewCollegeEcharts() {
        var colleges = new Array();
        var avgScores = new Array();
        var maxScores = new Array();
        var minScores = new Array();
        var passRates = new Array();
        var excellentRates = new Array();

        $('tbody tr').each(function (i) {
            $(this).children('td').each(function (j) {
                if(j == 0){
                    colleges.push($(this).text());
                } else if(j == 3){
                    avgScores.push($(this).text());
                } else if(j == 4){
                    maxScores.push($(this).text());
                } else if(j == 5){
                    minScores.push($(this).text());
                } else if(j == 7){
                    passRates.push($(this).text()*100);
                } else if(j == 9){
                    excellentRates.push($(this).text()*100);
                }
            });
            var width = 800;
            if(i>40){
            	width = 18*i;
            }
            if(i = $('tbody tr').length-1){
            	$("#echart-content").width(width+"px") ;
            }
        });

        var title = '';

        var imageModal = new jBox('Modal');
        imageModal.setWidth($(window).width() * 0.9);
        imageModal.setHeight($(window).height() * 0.85);
        imageModal.setTitle(getMessage("report.college"));
        imageModal.setContent($('#echart-view-content'));
        imageModal.open();

        var myChart = echarts.init(document.getElementById('echart-content'));

        // 指定图表的配置项和数据
        var option = {
            title: {
                text: getMessage("report.college")
                // textAlign:'center'
            },
            tooltip: {},
            legend: {
                data: [getMessage("report.college.avgScore"),
                       getMessage("report.college.maxScore"),
                       getMessage("report.college.minScore"),
                       getMessage("report.college.excellentRate"),
                       getMessage("report.college.passRate")]
            },
            toolbox: {
                feature : {
                    saveAsImage : {show: true}
                }
            },
       /*      dataZoom: [{
                type: 'slider',
                show: true,
                xAxisIndex: [0],
                left: '9%',
                bottom: -5,
                start: 10,
                end: 90 //初始化滚动条
            }], */
            xAxis: {
                axisLabel: {
                    interval:0,
                    rotate:60
                },
                data: colleges
            },
            yAxis: [
                {
                    type: 'value'
                }
            ],
            series: [{
                name: getMessage("report.college.avgScore"),
                type: 'bar',
                data: avgScores
            },{
                name: getMessage("report.college.maxScore"),
                type: 'bar',
                data: maxScores
            },{
                name: getMessage("report.college.minScore"),
                type: 'bar',
                data: minScores
            },{
                name: getMessage("report.college.excellentRate"),
                type: 'line',
                data: excellentRates
            },{
                name: getMessage("report.college.passRate"),
                type: 'line',
                data: passRates
            }]
        };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    }

    function page(n, s) {
        $("#pageNumber").val(n);
        $("#pageSize").val(s);
        $("#searchForm").attr("action","${ctx}/admin/exam/reportSubjectCollege");
        $("#searchForm").submit();
        return false;
    }

    function goSearch() {
        $("#pageNumber").val(1);
        $("#pageSize").val('${query.pageSize}');
        if ($("#subjectCode").val() == null || $("#subjectCode").val() == '') {
            alert('请选择科目');
            return;
        }
        $("#searchForm").attr("action","${ctx}/admin/exam/reportSubjectCollege");
        $("#searchForm").submit();
        return false;
    }

    $(document).keydown(function (event) {
        if (event.keyCode == 13 || event.keyCode == 108) {
            goSearch();
            return false;
        }
    });
    
</script>

<div id="echart-view-content" class="container-fluid" style="display:none" align="center">
    <div id="echart-content" style="width: 100%;height:700px;"/>
</div>
</body>
</html>