<!DOCTYPE html>
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
<head>
|
<th:block th:include="include :: header('新增题目列表-intelligence')"/>
|
<th:block th:include="include :: summernote-css"/>
|
<th:block th:include="include :: select2-css"/>
|
<th:block th:include="include :: bootstrap-select-css"/>
|
</head>
|
<body class="white-bg">
|
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
|
|
<form class="form-horizontal m" id="form-question-add" th:object="${tExamLevel}">
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{menu.exam.level.view}]]：</label>
|
<div class="col-sm-8">
|
<input name="levelName" class="form-control" th:value="*{levelName}" type="text" readonly>
|
<input name="levelId" class="form-control" th:value="*{id}" type="hidden" readonly>
|
</div>
|
</div>
|
<div class="form-group input-focus">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.questionStem}]]：</label>
|
<div class="col-sm-8">
|
<input name="title" onclick="$.modal.richtext(this)" class="form-control" type="text" required>
|
</div>
|
</div>
|
<div class="form-group permanent" hidden="true">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.question.questionNumberPermanent}]]：</label>
|
<div class="col-sm-8">
|
<input name="permanentId" class="form-control" type="text" required>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.demographyParam.languagetype}]]：</label>
|
<div class="col-sm-8">
|
<select name="langType" id="langType" class="form-control m-b"
|
th:with="type=${@dict.getType('lang_type')}">
|
<option th:each="dict : ${type}" th:text="${dict.dictLabel}"
|
th:value="${dict.dictValue}"></option>
|
</select>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.level.questionType}]]：</label>
|
<div class="col-sm-8 template-option">
|
<input type="radio" name="template" value= "intelligence_title" checked="true">
|
<label>[[#{jsp.exam.product.questionsAndAnswers}]]</label>
|
<input type="radio" name="template" value= "intelligence">
|
<label>[[#{jsp.exam.product.questionsAndAnswers.title}]]</label>
|
</div>
|
</div>
|
<div class="form-group option-group option-intelligence" hidden="true">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.question.item}]]：</label>
|
<div class="col-sm-8 layui-layer-border input-focus item-must" style="padding-top: 2%" id="optionEdit">
|
<div class="form-group form-inline">
|
<label class="col-sm-1">1</label>
|
<input name="choiceInput" class="form-control valid option-input" type="text"
|
style="width: 10%; margin-right: 2%;" value="1">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid option-input" type="text" style="width: 60%;"
|
value="">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash delet-trash"></button>
|
</div>
|
<div class="form-group form-inline">
|
<label class="col-sm-1">2</label>
|
<input name="choiceInput" class="form-control valid" type="text"
|
style="width: 10%; margin-right: 2%;" value="2">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid" type="text" style="width: 60%;" value="">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash"></button>
|
</div>
|
<div class="form-group form-inline">
|
<label class="col-sm-1">3</label>
|
<input name="choiceInput" class="form-control valid" type="text"
|
style="width: 10%; margin-right: 2%;" value="3">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid" type="text" style="width: 60%;" value="">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash"></button>
|
</div>
|
<div class="form-group form-inline">
|
<label class="col-sm-1">4</label>
|
<input name="choiceInput" class="form-control valid" type="text"
|
style="width: 10%; margin-right: 2%;" value="4">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid" type="text" style="width: 60%;" value="">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash"></button>
|
</div>
|
<div class="form-group form-inline">
|
<label class="col-sm-1">5</label>
|
<input name="choiceInput" class="form-control valid" type="text"
|
style="width: 10%; margin-right: 2%;" value="5">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid" type="text" style="width: 60%;" value="">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash"></button>
|
</div>
|
</div>
|
</div>
|
|
<div class="form-group message-item-must form-group" hidden="true">
|
<label class="col-sm-3 control-label" style="color: red">*select</label>
|
</div>
|
|
<div class="form-group">
|
<label class="col-sm-3 control-label"></label>
|
<div class="col-sm-8">
|
<button type="button" class="btn btn-w-m btn-success" id="optionAdd" style="display: none">
|
[[#{jsp.exam.question.addOption}]]
|
</button>
|
<button type="button" class="btn btn-w-m btn-primary" id="optionView" style="display: none">[[#{jsp.exam.question.preview}]]
|
</button>
|
</div>
|
</div>
|
</form>
|
|
<div class="form-group form-inline" id="optionTemplte" hidden="true">
|
<label class="col-sm-1">E</label>
|
<input name="choiceInput" class="form-control valid" type="text"
|
style="width: 10%; margin-right: 2%;">
|
<input name="selectInput" onclick="$.modal.richtext(this)" class="form-control valid" type="text" style="width: 60%;">
|
<button type="button" class="btn btn-danger glyphicon glyphicon-trash" value="trashButton"></button>
|
</div>
|
|
<div class="col-sm-offset-5 col-sm-10">
|
<button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>save
|
</button>
|
<button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>close
|
</button>
|
</div>
|
|
<!--模态窗口-->
|
<!--<div class="modal inmodal" id="modalWindow" tabindex="-1" role="dialog" aria-hidden="true">
|
<div class="modal-dialog modal-lg">
|
<div class="modal-content">
|
<div class="ibox-title">
|
<h5>input</h5>
|
</div>
|
<div class="modal-body" id="eg">
|
<div class="click2edit wrapper">
|
<p>[[#{jsp.exam.product.pleaseEnterQuestions}]]...</p>
|
</div>
|
</div>
|
<div class="modal-footer">
|
<button id="save" class="btn btn-primary btn-xs" onclick="save()" type="button">save</button>
|
<button id="edit" class="btn btn-danger btn-xs m-l-sm" onclick="cancel()" type="button">cancel
|
</button>
|
</div>
|
</div>
|
</div>
|
</div>-->
|
</div>
|
<th:block th:include="include :: footer"/>
|
<th:block th:include="include :: summernote-js"/>
|
<th:block th:include="include :: select2-js"/>
|
<th:block th:include="include :: bootstrap-select-js"/>
|
<script type="text/javascript">
|
|
|
var prefix = ctx + "exam/question";
|
var option = [];
|
var clicknum = 2;
|
// 多语言的uuid
|
var uuid = $("input[name='uuid']").val();
|
|
function submitHandler() {
|
if ($.validate.form()) {
|
var inputflag = false;
|
$('.item-must').find('input').each(function (i) {
|
if ($(this).val().trim() == "") {
|
inputflag = true;
|
return;
|
}
|
});
|
// 区分题目还是维度
|
if ($('input:radio[name="template"]:checked').val() == "intelligence_title") {
|
$('[name="permanentId"]').remove();
|
$('.option-intelligence').remove();
|
}
|
$.operate.saveTab(prefix + "/add", $('#form-question-add').serialize());
|
}
|
};
|
|
var cancel = function () {
|
$('.input-focus').find('[edit="true"]').removeAttrs("edit");
|
$('#modalWindow').modal('hide');
|
};
|
|
//大写字母数组
|
var createletter = function () {
|
for (var i = 97; i < 123; i++) {
|
option.push(String.fromCharCode(i));
|
}
|
};
|
|
// 多语言的默认选项
|
var defualItem = function () {
|
var $selectInput = $('#optionEdit').find('[name="selectInput"]');
|
|
if ($('[name="langType"]').val() == "Chinese") {
|
}
|
|
if ($('[name="langType"]').val() == "English") {
|
}
|
|
if ($('[name="langType"]').val() == "Thai") {
|
}
|
};
|
|
$(function () {
|
createletter();
|
//打开富文本编辑器
|
|
|
// add questionItems
|
$('#optionAdd').click(function () {
|
if (clicknum < 0 || clicknum > 26) {
|
return;
|
}
|
|
//添加答案项
|
var $content = $('#optionTemplte').clone();
|
$content.removeAttrs('id');
|
$content.removeAttrs('hidden');
|
$content.removeAttrs('style');
|
var $contenChildren = $content.children();
|
$contenChildren.eq(0).html(option[clicknum]);
|
$contenChildren.eq(1).val(option[clicknum]);
|
clicknum++;
|
$('#optionEdit').append($content);
|
});
|
|
$('.option-group').on("click", ".glyphicon", function () {
|
var optiontext = $(this).parent().children().eq(0).html();
|
$('.radio-inline').find('[value=' + optiontext + ']').parent().remove();
|
$(this).parent().remove();
|
});
|
|
$('.layui-layer-border').on("focus", "input", function () {
|
$('.question-item-must').attr('hidden', 'true');
|
});
|
|
|
$('#optionView').click(function () {
|
$modal = $('#modalWindow').clone();
|
$modal.attr('id', 'modalView');
|
$modal.find('.modal-footer').html('');
|
$modal.find('H5').html("view");
|
$('#modalhidden').append($modal);
|
$modal.modal('show');
|
$modal.find('.modal-body').html('<div class="click2edit wrapper"></div>');
|
$qution = $modal.find('.click2edit');
|
$qution.html("<p style='font-size:15px;font-weight: bold'>" + $('[name="title"]').val() + "</p>" + "<ul><li>");
|
$('#optionEdit').children('div').each(
|
function () {
|
$qution.append($(this).children('input').eq(0).val() + ". " + $(this).children('input').eq(1).val() +" ");
|
}
|
);
|
$qution.append("</li></ul>");
|
});
|
|
$('#modalhidden').on('click', 'button', function () {
|
$(this).parents('.modal').modal('hide');
|
$('#modalhidden').html("");
|
});
|
|
$('.input-focus').on('blur', '[name="choiceInput"]', function () {
|
var $choiceInputs = $('.input-focus').find('[name="choiceInput"]');
|
$(this).prev().html($(this).val());
|
$('#answer').find('input').each(function (i) {
|
$(this).val($choiceInputs.eq(i).val());
|
var $input = $(this).clone();
|
var $parent = $(this).parent();
|
$parent.empty();
|
$parent.append($input);
|
$parent.append($choiceInputs.eq(i).val());
|
});
|
});
|
|
// 给个语言对应的默认值
|
defualItem();
|
$('[name="langType"]').change(function () {
|
var $selectInput = $('#optionEdit').find('[name="selectInput"]');
|
|
if ($(this).val() == "Chinese") {
|
}
|
|
if ($(this).val() == "English") {
|
}
|
|
if ($(this).val() == "Thai") {
|
}
|
});
|
|
$(':radio').click(function () {
|
var checkValue = $('input:radio[name="template"]:checked').val();
|
if (checkValue == "intelligence") {
|
$('.option-intelligence').removeAttrs("hidden");
|
$('#optionView').removeAttrs("style");
|
$('#optionAdd').removeAttrs("style");
|
$('.permanent').removeAttrs("hidden");
|
$('#permanentId').attr("required","true");
|
} else {
|
$('.option-intelligence').attr("hidden", "true");
|
$('#optionView').css("display","none");
|
$('#optionAdd').css("display","none");
|
$('.permanent').attr("hidden","true");
|
$('#permanentId').removeAttrs("required");
|
}
|
});
|
|
});
|
|
|
</script>
|
</body>
|
</html>
|
