<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../common/init.jsp"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="../common/top.jsp"%>
<link rel="stylesheet" href="${ctx}/resources/css/main.css" type="text/css" />
<link rel='stylesheet' href='${ctx}/resources/css/easyui.css' type='text/css' media='screen' />
<link rel='stylesheet' href='${ctx}/resources/css/easyui/icon.css' type='text/css' media='screen' />
<link rel='stylesheet' href='${ctx}/resources/css/user-center-style.css' type='text/css' media='screen' />
<link rel="stylesheet" href="${ctx}/resources/css/app/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="${ctx}/resources/css/style.css" type="text/css" />
<link rel="stylesheet" href="${ctx}/resources/css/alertify.core.css" type="text/css" media='screen' />
<link rel="stylesheet" href="${ctx}/resources/css/alertify.default.css" type="text/css" media='screen' />

<script type="text/javascript" src="${ctx}/resources/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/lib/bootstrap.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/alertify.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/bootstrap-waitingfor.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" src="${ctx}/resources/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/third-party/kityformula-plugin/addKityFormulaDialog.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/third-party/kityformula-plugin/getKfContent.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/third-party/kityformula-plugin/defaultFilterFix.js"></script>
<script type="text/javascript" src="${ctx}/resources/ueditor/third-party/base64image/base64imageDialog.js"></script> --%>
<script type="text/javascript" src="${ctx}/resources/js/question/quesForZujuan.js"></script>

<style>
.table{width: 100%}
.table-bordered{border-collapse:collapse;border:none;}
.table-bordered th{border:solid #c9c9c9 1px;padding:2px 2px 2px 2px;}
.table-bordered td{border:solid #c9c9c9 1px;padding:2px 2px 2px 2px;}

.searchTbl th{height: 30px;vertical-align: middle;}
.searchTbl td{height: 30px;vertical-align: middle;}
select {
	margin: 0px;
}
input[type="text"] {
	margin: 0px;
}
i {font-style:italic;}
em {font-style:italic;}
</style>
<script type="text/javascript">
var restQuesDetailsMap = {};
var diffMap = {};
var abilityMap = {};
<c:forEach items="${codes }" var="code">
<c:if test="${ code.itemType=='QUESTION_DIFFICULTY'}">
diffMap['${code.itemCode}'] = '${code.itemValue}';
</c:if>
<c:if test="${ code.itemType=='ABILITY'}">
abilityMap['${code.itemCode}'] = '${code.itemValue}';
</c:if>
</c:forEach>

var saveType = null;
var ue = null;

$(document).ready(function(){
	//$(document).mask('正在加载数据，请稍等...');
	setTimeout(function(){
		${param.fun}(${param.paramStr});
		$("#answer-tr").css("visibility","visible");
		//$(document).unmask();
	},500);
	
	$("#restQuesDetails").change(function(){
		changeCondition();
	});
	
	ue = UE.getEditor('editor1', {
        // 工具栏
        toolbars: [[
            'fullscreen', 'source', '|',
            'undo', 'redo', '|',
            'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
            'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', '|',
            'kityformula', 'base64image'
        ]],
        // 关闭字数统计
        wordCount:false,
        // 关闭元素路径
        elementPathEnabled:false
    });

    ue.ready(function(){
        //阻止工具栏的点击向上冒泡
        $(this.container).click(function(e){
            e.stopPropagation()
        })
    });

    $('.content').click(function(e){
        var $target = $(this);
        var content = $target.html();
        var currentParent = ue.container.parentNode.parentNode;
        var currentContent = ue.getContent();
        $target.html('');
        $target.append(ue.container.parentNode);
        console.log(ue.container.parentNode);
        console.log(ue.container.parentNode.parentNode);
        ue.reset();
        setTimeout(function(){
            ue.setContent(content);
        },200)
        $(currentParent).html(currentContent);
    });
});

function clearue(){
	var currentParent = ue.container.parentNode.parentNode;
    var currentContent = ue.getContent();
    $(currentParent).html(currentContent);
    $("#editorsource").html('');
    $("#editorsource").append(ue.container.parentNode);
}
function doSave(obj){
	clearue();
	goSave(obj);
}

function getNewQuestionNoByCourseId(){
	$.post('${ctx}/question/getNewQuestionNoByCourseId/' + $("#courseId").val(),{},function(res){
		$("#questionNo").val(res.questionNo);
	});
}

function initAddQuesParam(param){
	restQuesDetailsMap = {};
	saveType = "ADD";
	$("#blankQuesNum").val(param.blankQuesNum);
	$("#paperId").val(param.paperId);
	$("#blankQuesNumFowShow").text(param.blankQuesNum);
	$("#pqtId").val(param.pqtId);
	$("#quesTypeId").val(param.quesTypeId);
	$("#quesTypeName").val(param.quesTypeName);
	$("#quesTypeNameForShow").text(param.quesTypeName);
	$("#score").val(param.score);
	$("#scoreForShow").text(param.score);
	$("#courseId").val(param.courseId);
	$("#bookId").val(param.bookId);
	$("#chapterSize").val(param.chapterSize);
	//$(document).mask('正在加载数据，请稍等...');
	$.post('${ctx}/question/calcRestQuesDetails',{"paperId":param.paperId,"quesTypeId":param.quesTypeId,"score":param.score},function(res){
		//$(document).unmask();
		if(res.flag=='failed'){
           alertify.error(res.msg);
           return false;
		}else{
			$("#restQuesDetails").empty();
			for(var i=0;i<res.restQuesDetails.length;i++){
				var qd = res.restQuesDetails[i];
				if(qd.quesNum > 0){
					var value = qd.chapterNo + "_" + qd.estimateDifficultyCode + "_" + qd.abilityCode;
					var text = "第" + qd.chapterNo + "章，认知层次：" + qd.abilityText + "，预计难度：" + qd.estimateDifficultyText + "，空题数量：" + qd.quesNum;
					restQuesDetailsMap[value] = qd;
					$("<option value='" + value + "'>" + text + "</option>").appendTo($("#restQuesDetails"));
				}
			}
			changeCondition();
			getNewQuestionNoByCourseId();
		}
	});
	questionChange();
}

function autoReduce(){
	var value = $("#restQuesDetails").val();
	var selectedIndex = $("#restQuesDetails").get(0).selectedIndex; 
	var qd = restQuesDetailsMap[value];
	qd.quesNum = qd.quesNum - 1;
	if(qd.quesNum <= 0){
		$("#restQuesDetails").find("option").eq(selectedIndex).remove();
		var maxIndex = $("#restQuesDetails").find("option").length - 1;
		if(selectedIndex > maxIndex){
			selectedIndex = maxIndex;
		}
		$("#restQuesDetails").get(0).selectedIndex = selectedIndex;
	}else{
		var text = "第" + qd.chapterNo + "章，认知层次：" + qd.abilityText + "，预计难度：" + qd.estimateDifficultyText + "，空题数量：" + qd.quesNum;
		$("#restQuesDetails").find("option").eq(selectedIndex).text(text);
	}
	changeCondition();
}

function changeCondition(){
	var value = $("#restQuesDetails").val();
	if(value){
		var qd = restQuesDetailsMap[value];
		$("#estimateDifficultyCode" + qd.estimateDifficultyCode).attr("checked",true);
		$("#abilityCode" + qd.abilityCode).attr("checked",true);
		$("#chapter").val(qd.chapterNo);
	}
}

function initEditQuesParam(param){
	restQuesDetailsMap = {};
	saveType = "EDIT";
	$("#tipDiv").hide();
	$("#paperId").val(param.paperId);
	$("#detailId").val(param.detailId);
	$("#quesId").val(param.questionId);
	$("#chapterSize").val(param.chapterSize);
	//$(document).mask('正在加载试题，请稍等...');
	$.post('${ctx}/question/quesDetail/' + param.questionId,{},function(res){
		//$(document).unmask();
		if(res.flag=='failed'){
           alertify.error(res.msg);
           return false;
		}else{
			var quesTypeName = res.questionType.name;
			$("#quesTypeId").val(res.questionType.id);
			$("#quesTypeName").val(quesTypeName);
			$("#quesTypeNameForShow").text(res.questionType.name);
			$("#questionNo").val(res.question.questionNo);
			$("#score").val(res.question.score);
			$("#scoreForShow").text(res.question.score - 0);
			$("#courseId").val(res.question.courseId);
			$("#bookId").val(res.question.bookId);
			var assessmentDemand = !res.question.assessmentDemand ? 'A' : res.question.assessmentDemand;
			$('input[name="assessmentDemand"][value="' + assessmentDemand + '"]').attr("checked",true);
			var estimateDifficultyCode = !res.question.estimateDifficultyCode ? '10' : res.question.estimateDifficultyCode;
			$('input[name="estimateDifficultyCode"][value="' + estimateDifficultyCode + '"]').attr("checked",true);
			var abilityCode = !res.question.abilityCode ? 'A' : res.question.abilityCode;
			$('input[name="abilityCode"][value="' + abilityCode + '"]').attr("checked",true);
			$("#chapter").val(res.question.chapter);
			$("#section").val(res.question.section);
			$("#item").val(res.question.item);
			$("#page").val(res.question.page);
			$("#body-content").html(res.question.bodyHtml);
			questionChange();
			if(isOneChoice(quesTypeName)){
				for(var i=0;i<4;i++){
					var opt = null;
					if(res.options && res.options.length > i){
						opt = res.options[i];
					}else{
						opt = {isCorrectOption:'0',content:''};
					}
					if(opt.isCorrectOption == '1'){
						$("input[name=optionsRadios]").eq(i).attr("checked",true);
					}
					var str=(String.fromCharCode(i+65));
					$("#"+str+"_radio_input").html(opt.contentHtml);
				}
			}else if(isMultChoice(quesTypeName)){
				for(var i=0;i<5;i++){
					var opt = null;
					if(res.options && res.options.length > i){
						opt = res.options[i];
					}else{
						opt = {isCorrectOption:'0',content:''};
					}
					$("input[name=optionsCKs]").eq(i).attr("checked",opt.isCorrectOption == '1');
					var str=(String.fromCharCode(i+65));
					$("#"+str+"_checkbox_input").html(opt.contentHtml);
				}
			}else{
				$("#answer-content").html(res.question.answerHtml);
			}
			//$(document).mask('正在加载数据，请稍等...');
			$.post('${ctx}/question/calcRestQuesDetails',{"paperId":$("#paperId").val(),"quesTypeId":$("#quesTypeId").val(),"score":$("#score").val()},function(res){
				//$(document).unmask();
				if(res.flag=='failed'){
		           alertify.error(res.msg);
		           return false;
				}else{
					$("#restQuesDetails").empty();
					{
						var qd = {
								"chapterNo" : $("#chapter").val(),
								"estimateDifficultyCode":$('input[name="estimateDifficultyCode"]:checked').val(),
								"estimateDifficultyText":diffMap[$('input[name="estimateDifficultyCode"]:checked').val()],
								"abilityCode":$('input[name="abilityCode"]:checked').val(),
								"abilityText":abilityMap[$('input[name="abilityCode"]:checked').val()]
								};
						var value = qd.chapterNo + "_" + qd.estimateDifficultyCode + "_" + qd.abilityCode + "_self";
						var text = "当前：第" + qd.chapterNo + "章，认知层次：" + qd.abilityText + "，预计难度：" + qd.estimateDifficultyText;
						restQuesDetailsMap[value] = qd;
						$("<option value='" + value + "'>" + text + "</option>").appendTo($("#restQuesDetails"));
					}
					for(var i=0;i<res.restQuesDetails.length;i++){
						var qd = res.restQuesDetails[i];
						if(qd.quesNum > 0){
							var value = qd.chapterNo + "_" + qd.estimateDifficultyCode + "_" + qd.abilityCode;
							var text = "第" + qd.chapterNo + "章，认知层次：" + qd.abilityText + "，预计难度：" + qd.estimateDifficultyText + "，空题数量：" + qd.quesNum;
							restQuesDetailsMap[value] = qd;
							$("<option value='" + value + "'>" + text + "</option>").appendTo($("#restQuesDetails"));
						}
					}
				}
			});
			if(res.question.enableTime){
				$("select").attr("disabled",true);
				$("input[type='radio']").attr("disabled",true);
				$("input[type='text']").attr("readonly",true);
				$("[contenteditable='true']").attr("contenteditable",false);
				$("#saveBtn").hide();
				$("#infoDiv").show();
			}
		}
	});
}

</script>
</head>
<body style="overflow: auto;">
<form id="questionUpdateFrm" action="${ctx}/question/insert" method="post">
<input type="hidden" id="paperId" />
<input type="hidden" id="detailId" />
<input type="hidden" id="quesId" value="0"/>
<input type="hidden" id="blankQuesNum" />
<input type="hidden" id="pqtId"/>
<input type="hidden" id="quesTypeId"/>
<input type="hidden" id="quesTypeName"/>
<input type="hidden" id="score"/>
<input type="hidden" id="courseId"/>
<input type="hidden" id="bookId"/>
<input type="hidden" id="chapterSize"/>
<div class="page-bodyList">
<div style="display: none;" id="editorsource"><script id="editor1" type="text/plain" style="width:100%; height:100px;"></script></div>

				<div style="margin: 10px;color: #ad5a00;font-size: 18px;font-weight: bold;">
					<span id="tipDiv">需要填充的试题数量：<span id="blankQuesNumFowShow" style="font-weight: bold;margin-right: 30px;"></span></span>试题属性：<select id="restQuesDetails" style="width: 450px;"></select>
					<span style="padding-left:30px;">题号：</span><span><input type="text" id="questionNo" name="questionNo" style="width:100px;" readonly="readonly"/></span>
				</div>
			    <table class="table table-bordered searchTbl">
					<tr>
						<th nowrap="nowrap" style="width: 65px;">题型<span style="color:red">*</span></th>
						<td><span id="quesTypeNameForShow"></span></td>
						<th>认知层次</th>
						<td>
							<c:forEach items="${codes}" var="code">
								<c:if test="${code.itemType=='ABILITY'}">
									<span style="margin-right: 10px;"><input type="radio" name="abilityCode" id="abilityCode${code.itemCode}" value="${code.itemCode}" disabled="disabled"/><label for="abilityCode${code.itemCode}">${code.itemValue}</label></span>
								</c:if>
							</c:forEach>
						</td>
						<th>考核要求</th>
						<td>
							<c:forEach items="${codes}" var="code">
								<c:if test="${code.itemType=='ASSESSMENT_DEMAND'}">
									<span style="margin-right: 10px;"><input type="radio" name="assessmentDemand" value="${code.itemCode}" id="assessmentDemand${code.itemCode}"/><label for="assessmentDemand${code.itemCode}">${code.itemValue}</label></span>
								</c:if>
							</c:forEach>
						</td>
					</tr>
					<tr>
						 <th nowrap="nowrap">满分值<span style="color:red">*</span></th>
	                     <td><span id="scoreForShow"></span></td>
	                     <th>知识点</th>
	                     <td>
	                            <input type="text" id="chapter" name="chapter" style="width:20px;" maxlength="2" readonly="readonly"/>&nbsp;章<span style="color:red">*</span>
                                <input type="text" id="section" name="section" style="width:20px;" maxlength="3"/>&nbsp;节
                                <input type="text" id="item" name="item" style="width:20px;" maxlength="4"/>&nbsp;目
                                <input type="text" id="page" name="page" style="width:20px;margin: 0px;" maxlength="5"/>&nbsp;页
                        </td>
						<th>预计难度</th>
						<td>
							<c:forEach items="${codes}" var="code">
								<c:if test="${code.itemType=='QUESTION_DIFFICULTY'}">
									<span style="margin-right: 10px;"><input type="radio" name="estimateDifficultyCode" id="estimateDifficultyCode${code.itemCode}" value="${code.itemCode}" disabled="disabled"/><label for="estimateDifficultyCode${code.itemCode}">${code.itemValue}</label></span>
								</c:if>
							</c:forEach>
						</td>
					</tr>
                    <tr>
							<th>题干1<span style="color:red">*</span></th>
							<td colspan="5" id="body-content" class="content" style="height:150px;width:95%;max-width: 95%;">								
								<!-- <div id="body-content" class="box-content" field="body" name="题干" title="点击输入内容" contenteditable="true" style="height:150px;width:95%;max-width: 95%;"></div> -->
							</td>
				   </tr>
				   <tr id="answer-tr" style="visibility: hidden;">
							<th id="answer_td">选项及答案</th>
							<td colspan="5" style="margin: 0px;padding: 0px;" field="answer" title="点击输入内容" id="answer-content" class="content" style="height:200px;width:95%;max-width: 95%;"></td>
							<td colspan="5" style="margin: 0px;padding: 0px;">	
								<!-- <div id="answer-content" class="" field="answer" name="选项及答案" title="点击输入内容" contenteditable="true" style="height:150px;width:95%;max-width: 95%;"></div> -->
								<div class="container" id="container" style="width:95%;margin: 0px;padding: 0px;">
									<div id="Choose">
										<div>
											 <div class="RadioContent">
												<table style="width:100%">
													<tr>
														<td style="width:30px;"><input  type="radio" name="optionsRadios" value="A" class="validate[required] radio"/>A.</td>
														<td class="content" id="A_radio_input">
														<!-- <div class="col-lg-5 col-sm-5 content" index="0" id="A_radio_input" contenteditable="true" style="height:25px;width:100%">
														</div> --></td>
													</tr>
													<tr>
														<td style="width:30px;"><input	type="radio" name="optionsRadios" value="B" class="validate[required] radio"/>B.</td>
														<td class="content" id="B_radio_input">
														<!-- <div class="col-lg-5 col-sm-5 content" index="1" id="B_radio_input" contenteditable="true" style="height:25px;width:100%">
														</div> --></td>
													</tr>
													<tr>
														<td style="width:30px;"><input	type="radio" name="optionsRadios" value="C" class="validate[required] radio"/>C.</td>
														<td class="content" id="C_radio_input">
														<!-- <div class="col-lg-5 col-sm-5 content" index="2" id="C_radio_input" contenteditable="true" style="height:25px;width:100%">
														</div> --></td>
													</tr>
													<tr>
														<td style="width:30px;"><input	type="radio" name="optionsRadios" value="D" class="validate[required] radio"/>D.</td>
														<td class="content" id="D_radio_input">
														<!-- <div class="col-lg-5 col-sm-5 content" index="3" id="D_radio_input" contenteditable="true" style="height:25px;width:100%">
														</div> --></td>
													</tr>														
												</table>
											</div>
										</div>
										<div class="CheckboxContent">
											<table style="width:100%">
												<tr>
													<td style="width:30px;"><input type="checkbox" name="optionsCKs" value="A" class="validate[required] checkbox "/>A.</td>
													<td class="content" id="A_checkbox_input">
													<!-- <div class="col-lg-5 col-sm-5 checkcontent" id="A_checkbox_input" contenteditable="true" style="height:25px;width:100%"></div> -->
													</td>
												</tr>
												<tr>
													<td style="width:30px;"><input type="checkbox" name="optionsCKs" value="B" class="validate[required] checkbox "/>B.</td>
													<td class="content" id="B_checkbox_input">
													<!-- <div class="col-lg-5 col-sm-5 checkcontent" id="B_checkbox_input" contenteditable="true" style="height:25px;width:100%"></div> -->
													</td>
												</tr>
												<tr>
													<td style="width:30px;"><input type="checkbox" name="optionsCKs" value="C" class="validate[required] checkbox "/>C.</td>
													<td class="content" id="C_checkbox_input">
													<!-- <div class="col-lg-5 col-sm-5 checkcontent" id="C_checkbox_input" contenteditable="true" style="height:25px;width:100%"></div> -->
													</td>
												</tr>
												<tr>
													<td style="width:30px;"><input type="checkbox" name="optionsCKs" value="D" class="validate[required] checkbox "/>D.</td>
													<td class="content" id="D_checkbox_input">
													<!-- <div class="col-lg-5 col-sm-5 checkcontent" id="D_checkbox_input" contenteditable="true" style="height:25px;width:100%"></div> -->
													</td>
												</tr>
												<tr>
													<td style="width:30px;"><input type="checkbox" name="optionsCKs" value="E" class="validate[required] checkbox "/>E.</td>
													<td class="content" id="E_checkbox_input">
													<!-- <div class="col-lg-5 col-sm-5 checkcontent" id="E_checkbox_input" contenteditable="true" style="height:25px;width:100%"></div> -->
													</td>
												</tr>
											</table>											
										</div>
									</div>
								</div>
							</td>
						</tr>
			    </table>
			    <div id="infoDiv" style="display: none;color: red">*当前试题为题卡，不能修改</div>
			    <div style="text-align:center;">
				    <input type="button" id="saveBtn" style="margin-top: 10px;width: 60px;height: 25px;" onclick="doSave('${ctx }')" value="保存" />
				    <input type="button" style="margin-top: 10px;margin-left: 20px;width: 60px;height: 25px;" onclick="parent.closeEditQuestionDiv();" value="关闭" />
			    </div>
</div>
</form>
<div style="display:none" id="mathjaxdiv"></div>
</body>
</html>
