<!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 body-div">
|
<form class="form-horizontal m" id="form-product-add">
|
<input name="multilingual" id="multilingual" type="hidden" value="">
|
<input name="intelligence" id="intelligence" type="hidden" value="intelligence">
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.productPackageName}]]：</label>
|
<div class="col-sm-8">
|
<input name="name" class="form-control" type="text" required>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.questionnaireType}]]：</label>
|
<div class="col-sm-8">
|
<input class="form-control" name="levelId" id="levelId" th:value="${tExamLevel.id}" type="hidden">
|
<input class="form-control" name="levelName" id="levelName" th:value="${tExamLevel.levelName}"
|
readonly="true">
|
</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 value="ALL">ALL</option>
|
<option th:each="dict : ${type}" th:text="${dict.dictLabel}"
|
th:value="${dict.dictValue}"></option>
|
</select>
|
</div>
|
</div>
|
<div class="form-group input-focus" th:align="center">
|
<label th:align="center" style="color: #b6151a;">( 注意：产品包指导语,内容不要直接从word复制，请务必从txt文件中复制内容 )</label>
|
</div>
|
<div class="form-group input-focus">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.productPackageInstructions}]]：</label>
|
<div class="col-sm-8">
|
<textarea name="guide" class="form-control" rows="5" cols="60"></textarea>
|
</div>
|
</div>
|
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.productReportTemplate}]]：</label>
|
<div class="col-sm-8">
|
<select id="reportTemplateId" name="reportTemplateId" class="form-control noselect2 selectpicker" multiple>
|
<option th:each="dict : ${templateList}" th:text="${dict['reportType']}"
|
th:value="${dict['id']}" ></option>
|
</select>
|
</div>
|
</div>
|
|
<div id="headline">
|
<div class="form-group clone segmentation">
|
<div class="form-group" hidden="true">
|
<label class="col-sm-3 control-label headline-index headline-index-seq">[[#{jsp.exam.product.paragraph1Heading}]]
|
- </label>
|
<div class="col-sm-9 form-inline">
|
<input name="segmentationName" class="form-control must-focus" type="text"
|
style="width: 70%; margin-right: 2%;" value="segmentationName">
|
<div class="segment-must" style="color: red" hidden="true">*[[#{basis.required}]]</div>
|
</div>
|
</div>
|
<div class="form-group" hidden="true">
|
<label class="col-sm-3 control-label permanent-seq">[[#{jsp.exam.product.permanentNumber}]]：</label>
|
<div class="col-sm-9 form-inline">
|
<input name="permanentId" class="form-control must-focus" type="text"
|
style="width: 70%; margin-right: 2%;" value="">
|
<div class="segment-must" style="color: red" hidden="true">*[[#{basis.required}]]</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label segment-discription-seq" hidden="true">第1段题目描述 - </label>
|
<div class="form-group">
|
</div>
|
<div class="col-sm-9 form-inline input-focus">
|
<textarea name="description" class="form-control" rows="5" cols="60"
|
style="margin-top: 2%; display: none" text="description"></textarea>
|
</div>
|
</div>
|
<div class="form-group segmentation-group">
|
<div>
|
<label class="col-sm-3 control-label"></label>
|
<div class="col-sm-8">
|
<!--question content-->
|
<div class="ibox float-e-margins">
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label"></label>
|
<button type="button" class="btn btn-warning btn-rounded add-part" id="add-part"
|
onclick="$.table.addPartToIntelligenceQuestion()">[[#{jsp.exam.product.addpart}]]
|
</button>
|
<button type="button" id="add-question-nopart" class="btn btn-info btn-rounded add-question" style="display: none;">
|
[[#{jsp.exam.product.topicSetting}]]
|
</button>
|
<button type="button" id="add-title-nopart" class="btn btn-info btn-rounded add-title" style="display: none">
|
[[#{jsp.exam.product.topicSetting}]]
|
</button>
|
<button type="button" class="btn btn-w-m btn-warning" id="importQuestionsInBatches" style="display: none">
|
[[#{jsp.exam.product.importQuestionsInBatches}]]
|
</button>
|
</div>
|
</div>
|
</div>
|
|
<div id="addHeadline-must" style="color: red" hidden="true">*[[#{jsp.exam.product.pleaseSetATitle}]]</div>
|
|
<div hidden="true">
|
<input name="questions" class="form-control" type="text">
|
</div>
|
|
</form>
|
|
<div class="ibox-content clone" id="questionSelect" hidden="true">
|
<div name="question-seq">[[#{jsp.exam.product.titleTemplate}]]</div>
|
<p>permenetId</p>
|
<p>[[#{jsp.exam.level.titleTemplate}]]：</p>
|
<ul class="list-inline">
|
</ul>
|
<input type="text" hidden="true" name="contentId">
|
<input type="text" hidden="true" name="questionId">
|
<input type="text" hidden="true" name="template">
|
<input type="text" hidden="true" name="parentQuestionId">
|
</div>
|
|
<div id="part-value" class="part-value clone" style="margin-top: 3%" th:hidden="true">
|
<div class="form-group">
|
<label class="col-sm-3 control-label part-num">[[#{jsp.exam.product.thePart}]] </label>
|
</div>
|
<div class="form-group">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.partTimeout}]]（minute）：</label>
|
<div class="col-sm-8">
|
<input name="timeOut" class="form-control" type="number" required>
|
</div>
|
</div>
|
</div>
|
|
<div class="form-group clone" id = "addSignalButton" hidden="true">
|
<label class="col-sm-3 control-label"></label>
|
<button type="button" class="btn btn-info add-part"
|
onclick="$.table.addSignal(this)">[[#{jsp.exam.product.addsinal}]]
|
</button>
|
<button type="button" class="btn btn-danger add-part"
|
onclick="$.table.deleteSignal(this)">[[#{jsp.exam.product.deleteSinal}]]
|
</button>
|
</div>
|
|
<div class="signal clone" id="signal" hidden="true">
|
<div class="form-group signal">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.signal}]]：</label>
|
<div class="col-sm-2">
|
<input name="signal" class="form-control" required>
|
</div>
|
</div>
|
<div class="form-group signalDescription">
|
<label class="col-sm-3 control-label">[[#{jsp.exam.product.signalDiscript}]]：</label>
|
<div class="col-sm- form-inline input-focus">
|
<textarea name="signalDescription" class="form-control" rows="3" cols="56"
|
style="margin-top: 2%" text="description"></textarea>
|
</div>
|
</div>
|
</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="modal-title">
|
<h5>[[#{jsp.exam.product.pleaseEnterALanguage}]]</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">[[#{basis.save}]]
|
</button>
|
<button id="edit" class="btn btn-danger btn-xs m-l-sm" onclick="cancel()" type="button">
|
[[#{jsp.cancel.btn}]]
|
</button>
|
</div>
|
</div>
|
</div>
|
</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>
|
|
<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/product";
|
var num = 1;
|
var partNum = 0;
|
var $parent = $.operate.parentHtml();
|
$('#subjectId').val($parent.$('#subjectId').val());
|
$('#subjectName').val($parent.$('#subjectId option:selected').text());
|
|
$("#form-product-add").validate({
|
focusCleanup: true
|
});
|
|
function dealHasPartValueQuestion($headlind, question) {
|
$($headlind.find('.part-value')).each(function (i) {
|
var item = new Object();
|
item.timeOut = $(this).find('[name="timeOut"]').val();
|
item.lowestScore = $(this).find('[name="lowestScore"]').val();
|
item.partOrder = i + 1;
|
item.signals = new Array();
|
signals = $(this).find('[name="signal"]');
|
signalDescriptions = $(this).find('[name="signalDescription"]');
|
signals.each(function (i) {
|
var signalObject = new Object();
|
signalObject.signal = signals.eq(i).val();
|
signalObject.signalDescription = signalDescriptions.eq(i).val();
|
item.signals.push(signalObject);
|
});
|
question.parts.push(item);
|
var questionIdNodes = $(this).next();
|
while (true) {
|
if (questionIdNodes.hasClass("ibox-content")) {
|
var item = new Object();
|
item.id = questionIdNodes.find('[name="questionId"]').val();
|
item.questionId = questionIdNodes.find('[name="questionId"]').val();
|
item.itemOrder = 0;
|
item.permanentId = "0";
|
item.partOrder = i + 1;
|
item.template = questionIdNodes.find('[name="template"]').eq(0).val();
|
item.parentQuestionId = questionIdNodes.find('[name="parentQuestionId"]').eq(0).val();
|
question.questionItems.push(item);
|
questionIdNodes = questionIdNodes.next();
|
} else {
|
break;
|
}
|
}
|
}
|
);
|
}
|
|
function dealWithNoPartValueQuetion($headlind, question) {
|
$($headlind.find('[name="questionId"]')).each(function (i) {
|
var item = new Object();
|
item.id = $(this).val();
|
item.itemOrder = 0;
|
item.permanentId = "0";
|
question.questionItems.push(item);
|
}
|
);
|
}
|
|
function submitHandler() {
|
var questionsJson = new Array();
|
var $name = $('#headline').find('.headline-index');
|
$($name).each(function (i) {
|
var question = new Object();
|
// var $headlind = $(this).parent().parent();
|
var $headlind = $(this).parents('.segmentation');
|
question.name = $headlind.find('[name="segmentationName"]').eq(0).val();
|
question.permanentId = $headlind.find('[name="permanentId"]').eq(0).val();
|
question.description = $headlind.find('[name="description"]').eq(0).val();
|
question.questionItems = new Array();
|
question.parts = new Array();
|
|
if ($headlind.find('.part-value') != undefined && $headlind.find('.part-value').length != 0) {
|
dealHasPartValueQuestion($headlind, question);
|
} else {
|
dealWithNoPartValueQuetion($headlind, question);
|
}
|
// 设置序号
|
$.each(question.questionItems, function (i) {
|
this.itemOrder = i + 1;
|
});
|
questionsJson.push(question);
|
});
|
|
$('[name="questions"]').val(JSON.stringify(questionsJson));
|
|
// if (!$.validate.must($('#headline'))) {
|
// return;
|
// }
|
if (!addQuestionMust()) {
|
return;
|
}
|
|
|
if ($.validate.form()) {
|
if ($('.float-e-margins').html().trim() === "") {
|
$("#addHeadline-must").removeAttrs('hidden');
|
return;
|
}
|
|
if ($('[name="reportTemplateId"]').val() == null || $('[name="reportTemplateId"]').val() == undefined) {
|
$.modal.alertWarning('[[#{jsp.exam.report.pleaseTemplate}]]');
|
$('[name="reportTemplateId"]').focus();
|
return;
|
}
|
// console.log(JSON.stringify(questionsJson));
|
$.operate.saveTab(prefix + "/add", $('#form-product-add').serialize());
|
}
|
};
|
|
var edit = function (htmlValue) {
|
$("#eg").addClass("no-padding");
|
$('.click2edit').summernote({
|
lang: 'zh-CN',
|
focus: true,
|
height: 120,//结合高度和disableResizeEditor的使用可以固定窗口
|
//disableResizeEditor: true
|
callbacks: {
|
onImageUpload: function (files) {
|
sendFile(files[0], this);
|
}
|
}
|
});
|
//给富文本编辑器赋值
|
$('.click2edit').summernote('code', htmlValue);
|
};
|
|
var addQuestionMust = function () {
|
var flag = true;
|
$('#headline').find('.float-e-margins').each(function () {
|
if ($(this).html().trim() === "") {
|
$("#addHeadline-must").removeAttrs('hidden');
|
flag = false;
|
}
|
});
|
return flag;
|
};
|
|
function sendFile(file, obj) {
|
var data = new FormData();
|
data.append("file", file);
|
$.ajax({
|
type: "POST",
|
url: ctx + "common/images",
|
data: data,
|
cache: false,
|
contentType: false,
|
processData: false,
|
dataType: 'json',
|
success: function (result) {
|
if (result.code == web_status.SUCCESS) {
|
$(obj).summernote('editor.insertImage', result.url, result.fileName);
|
} else {
|
$.modal.alertError(result.msg);
|
}
|
},
|
error: function (error) {
|
$.modal.alertWarning("图片上传失败。");
|
}
|
});
|
};
|
|
var save = function () {
|
$("#eg").removeClass("no-padding");
|
var aHTML = $('.click2edit').summernote('code');
|
$('#modalWindow').modal('hide');
|
var $focusInput = $('.input-focus').find('[edit="true"]');
|
$focusInput.val($.trim(aHTML));
|
$focusInput.removeAttrs("edit");
|
$('.click2edit').summernote('destroy');
|
};
|
|
var cancel = function () {
|
$('.input-focus').find('[edit="true"]').removeAttrs("edit");
|
$('#modalWindow').modal('hide');
|
};
|
|
// 添加题目
|
var addQuetionClick = function (obj) {
|
$.table.addQuetionClick(obj);
|
};
|
|
var addTitleClick = function (obj) {
|
$.table.addTitleClick(obj);
|
};
|
|
var deleteTitleAndTheQuestion = function (obj) {
|
$.table.deleteTitleAndTheQuestion(obj);
|
}
|
|
|
$(function () {
|
var options = {
|
removeUrl: prefix + "/remove",
|
exportUrl: prefix + "/export",
|
modalName: "题目列表",
|
importUrl: prefix + "/importMAQData/" + $('#langType').val(),
|
importTemplateUrl: prefix + "/importMAQTemplate",
|
modalName: "题目"
|
};
|
$.table.init(options);
|
|
$('[name="langType"]').on('change', function () {
|
options.importUrl = prefix + "/importMAQData/" + $('#langType').val();
|
$.table.init(options);
|
});
|
|
$('.body-div').on("click", "#addHeadline", function () {
|
if ($.validate.form()) {
|
$("#addHeadline-must").attr('hidden', 'true');
|
var $hiddenTitle = $('#hiddenTitle').clone();
|
$hiddenTitle.removeAttrs('hidden');
|
$hiddenTitle.removeAttrs('id');
|
$hiddenTitle.find('input').each(function () {
|
$(this).attr('needed', 'true');
|
});
|
//$hiddenTitle.find('textarea').attr('required', 'true');
|
// $hiddenTitle.find('label').eq(0).text([[#{jsp.exam.product.the}]] + num + "段标题 -");
|
// $hiddenTitle.find('.headline-index-seq').eq(0).text([[#{jsp.exam.product.the}]] + num + "段标题 -");
|
// $hiddenTitle.find('.segment-discription-seq').eq(0).text([[#{jsp.exam.product.the}]] + num + "段题目描述 -");
|
$('#headline').append($hiddenTitle);
|
var $title = $('#headline').find('.headline-index-seq');
|
var $description = $('#headline').find('.segment-discription-seq');
|
$title.each(function (i) {
|
$(this).text("[[#{jsp.exam.product.the}]]" + (i + 1) + "[[#{jsp.exam.product.sectionHeader}]]" + " -");
|
$description.eq(i).text("[[#{jsp.exam.product.the}]]" + (i + 1) + "[[#{jsp.exam.product.paragraphTitleDescription}]]" + " -");
|
});
|
num++;
|
}
|
});
|
|
$('.body-div').on("focus", ".must-focus", function () {
|
$(this).siblings('div[class*="must"]').attr('hidden', 'true');
|
});
|
|
// add-title
|
$('#headline').on("click", ".add-title", function () {
|
if ($.validate.must($(this).parents('.segmentation'))) {
|
$.table.addQuestionAttr.call(this);
|
$.modal.openTab("[[#{jsp.exam.product.pleaseSelectATopic}]]", prefix + "/addIntelligenceTitleQuestion/" + $('#levelId').val() + "/" + $('#langType').val());
|
$.table.addQuestionAttrrTail();
|
}
|
});
|
|
// add-question
|
$('#headline').on("click", ".add-question", function () {
|
if ($.validate.must($(this).parents('.segmentation'))) {
|
$.table.addQuestionAttr.call(this);
|
$.modal.openTab("[[#{jsp.exam.product.pleaseSelectATopic}]]", prefix + "/addIntelligenceQuestion/" + $('#levelId').val() + "/" + $('#langType').val());
|
$.table.addQuestionAttrrTail();
|
}
|
});
|
|
//delet title
|
$('#headline').on('click', '.remove-title', function () {
|
$(this).parent().parent().parent().remove();
|
$('.segment-guide-seq').each(function (i) {
|
$(this).text("[[#{jsp.exam.product.the}]]" + (i + 1) + "[[#{jsp.exam.product.paragraphInstruction}]]" + " -");
|
});
|
|
$('.headline-index-seq').each(function (i) {
|
$(this).text("[[#{jsp.exam.product.the}]]" + (i + 1) + "[[#{jsp.exam.product.sectionHeader}]]" + " -");
|
});
|
|
$('.segment-discription-seq').each(function (i) {
|
$(this).text("[[#{jsp.exam.product.the}]]" + (i + 1) + "[[#{jsp.exam.product.paragraphTitleDescription}]]" + " -");
|
num = i + 1
|
});
|
|
$('[name="question-seq"]').each(function (i) {
|
$(this).html((i + 1) + ')');
|
});
|
});
|
|
// open summernote
|
$('#form-product-add').on('focus', '[name="guide"],[name="signalDescription"]', function () {
|
$(this).attr('edit', 'true');
|
edit($(this).val());
|
$('#modalWindow').modal('show');
|
});
|
|
$('#modalWindow').on('shown.bs.modal', function () {
|
var $this = $(this);
|
var dialog = $this.find('.modal-dialog');
|
|
// 用这种方式保持富文本编辑器的窗口向下滚动
|
var scrollTop = $(document).scrollTop();
|
dialog.css({
|
marginTop: scrollTop - 15
|
});
|
});
|
|
// 批量导入题目
|
$('.body-div').on("click", "#importQuestionsInBatches", function () {
|
if ($.validate.form()) {
|
$.table.importPersonalityExcel();
|
}
|
});
|
});
|
</script>
|
<!-- 导入区域 -->
|
<script id="importTpl" type="text/template">
|
<form enctype="multipart/form-data" class="mt20 mb10" id="import-form">
|
<div class="col-xs-offset-1">
|
<div class="form-group">
|
<label class="col-sm-2 control-label">[[#{menu.exam.level.view}]]：</label>
|
<div class="col-sm-10">
|
<select class="form-control" name="level-import-name" id="level-import-id"
|
th:with="levels=${@examLevel.selectTExamLevelByquestionTemplateIdList('intelligence')}"
|
required>
|
<option value="">--select--</option>
|
<option th:each="level : ${levels}" th:text="${level.levelName}"
|
th:value="${level.id}"></option>
|
</select>
|
<div class="select-must" style="color: red" hidden="true">
|
*[[#{jsp.exam.question.pleaseSelectADimension}]]
|
</div>
|
</div>
|
</div>
|
<div class="form-group">
|
<input type="file" id="file" name="file"/>
|
<div class="mt10 pt5">
|
<!--<input type="checkbox" id="updateSupport" name="updateSupport" title="如果登录账户已经存在，更新这条数据。"> 是否更新已经存在的用户数据 -->
|
<a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i
|
class="fa fa-file-excel-o"></i> [[#{basis.template}]]</a>
|
</div>
|
<font color="red" class="pull-left mt10">
|
[[#{jsp.exam.product.bulkImportTips}]]
|
</font>
|
</div>
|
</div>
|
</form>
|
</script>
|
</body>
|
</html>
|
