11 changed files with 745 additions and 117 deletions
@ -1,51 +1,195 @@ |
|||||
<!DOCTYPE html> |
<!DOCTYPE html> |
||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" > |
<html lang="zh" xmlns:th="http://www.thymeleaf.org"> |
||||
<head> |
<head> |
||||
<th:block th:include="zdxtInclude :: header('新增场景题目')" /> |
<th:block th:include="zdxtInclude :: header('新增场景题目')"/> |
||||
|
<th:block th:include="zdxtInclude :: bootstrap-fileinput-css"/> |
||||
</head> |
</head> |
||||
<body class="white-bg"> |
<body class="white-bg"> |
||||
<div class="wrapper wrapper-content animated fadeInRight ibox-content"> |
<div class="wrapper wrapper-content animated fadeInRight ibox-content"> |
||||
<form class="form-horizontal m" id="form-question-add"> |
<form class="form-horizontal m" enctype="multipart/form-data" id="form-question-add" type="text/template"> |
||||
<input name="parentId" type="text" hidden> |
<input name="parentId" type="text" hidden> |
||||
<div class="form-group"> |
<div class="form-group" id="textTitle" hidden> |
||||
<label class="col-sm-3 control-label">题目名称:</label> |
<label class="col-sm-3 control-label">题目:</label> |
||||
<div class="col-sm-8"> |
<div class="col-sm-8"> |
||||
<input name="name" class="form-control" type="text"> |
<input name="name" class="form-control" type="text"> |
||||
</div> |
|
||||
</div> |
</div> |
||||
<div class="form-group"> |
</div> |
||||
<label class="col-sm-3 control-label">状态:</label> |
<div class="form-group" id="fileTitle" hidden> |
||||
<div class="col-sm-8"> |
<label class="col-sm-3 control-label">题目:</label> |
||||
<select name="status" class="form-control"> |
<div id="fileIn" class="col-sm-8"> |
||||
<option value="0">有效</option> |
<div class="file-loading"> |
||||
<option value="1">无效</option> |
<input id="fileInput" name="file" type="file" multiple> |
||||
</select> |
|
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
<div class="form-group" shiro:hasPermission="system:user:isAllow"> |
</div> |
||||
<label class="col-sm-3 control-label">角色:</label> |
<div class="form-group"> |
||||
<div class="col-sm-8"> |
<label class="col-sm-3 control-label">状态:</label> |
||||
<label th:each="role:${roles}" class="check-box"> |
<div class="col-sm-8"> |
||||
<input name="roleId" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}" th:checked="${role.flag}" th:disabled="${role.status == '1'}"> |
<select name="status" class="form-control"> |
||||
</label> |
<option value="0">有效</option> |
||||
</div> |
<option value="1">无效</option> |
||||
|
</select> |
||||
</div> |
</div> |
||||
</form> |
</div> |
||||
</div> |
<div class="form-group" shiro:hasPermission="system:user:isAllow"> |
||||
<th:block th:include="zdxtInclude :: footer" /> |
<label class="col-sm-3 control-label">角色:</label> |
||||
<script type="text/javascript"> |
<div class="col-sm-8"> |
||||
var prefix = ctx + "project/question" |
<label th:each="role:${roles}" class="check-box"> |
||||
$("#form-question-add").validate({ |
<input name="roleId" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}" |
||||
focusCleanup: true |
th:checked="${role.flag}" th:disabled="${role.status == '1'}"> |
||||
}); |
</label> |
||||
|
</div> |
||||
|
</div> |
||||
|
</form> |
||||
|
</div> |
||||
|
<th:block th:include="zdxtInclude :: footer"/> |
||||
|
<th:block th:include="zdxtInclude :: bootstrap-fileinput-js"/> |
||||
|
<script type="text/javascript" th:inline="javascript"> |
||||
|
var type = [[${type}]]; |
||||
|
var parentId = [[${parentId}]]; |
||||
|
var prefix = ctx + "project/question" |
||||
|
|
||||
function submitHandler() { |
$("#form-question-add").validate({ |
||||
if ($.validate.form()) { |
focusCleanup: true |
||||
var parentId = [[${parentId}]]; |
}); |
||||
$("[name='parentId']").val(parentId); |
|
||||
$.operate.save(prefix + "/add", $('#form-question-add').serialize()); |
$(function() { |
||||
|
// 渲染文件要素信息 |
||||
|
renderVersionAtt(); |
||||
|
}) |
||||
|
|
||||
|
if (type === 0) { |
||||
|
$("#textTitle").show(); |
||||
|
} else { |
||||
|
$("#fileTitle").show(); |
||||
|
} |
||||
|
|
||||
|
function submitHandler() { |
||||
|
if ($.validate.form()) { |
||||
|
$('#fileInput').fileinput('upload'); |
||||
|
// var parentId = [[${parentId}]]; |
||||
|
// $("[name='parentId']").val(parentId); |
||||
|
// $.operate.save(prefix + "/add", $('#form-question-add').serialize()); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/** 附件相关 */ |
||||
|
|
||||
|
/** 渲染附件信息 */ |
||||
|
function renderVersionAtt() { |
||||
|
$("#fileIn").show(); |
||||
|
$("#fileOut").hide(); |
||||
|
uploadFiles(); |
||||
|
$("#fileInput").fileinput('clear') |
||||
|
} |
||||
|
|
||||
|
/** 上传附件 */ |
||||
|
function uploadFiles() { |
||||
|
var filePreview = { fileList: null, previewRespDTOS: null } |
||||
|
initFile("fileInput", prefix + "/add", filePreview); |
||||
|
} |
||||
|
|
||||
|
/** 初始化文件 */ |
||||
|
function initFile(elementId, url, filePreview) { |
||||
|
var preview = filePreview.previewRespDTOS; |
||||
|
|
||||
|
if (preview != null) { |
||||
|
for (var i = 0; i < preview.length; i++) { |
||||
|
// 图片删除的地址 |
||||
|
preview[i].url = prefix + "/removeFile" |
||||
} |
} |
||||
} |
} |
||||
</script> |
|
||||
|
$("#" + elementId).fileinput({ |
||||
|
'theme': 'explorer', |
||||
|
initialPreviewAsData: true, |
||||
|
dropZoneEnabled: true, |
||||
|
dropZoneTitle: "上传图片或视频", |
||||
|
uploadUrl: url, |
||||
|
uploadAsync: false,//异步上传 |
||||
|
enctype: 'multipart/form-data', |
||||
|
showClose: false, |
||||
|
showPreview: true, |
||||
|
showUpload: false, |
||||
|
uploadExtraData: function () { |
||||
|
var formData = $("#form-question-add").serialize(); |
||||
|
formData = decodeURIComponent(formData, true); |
||||
|
var arr = formData.split("&"); |
||||
|
var data = {}; |
||||
|
for (var i=0; i<arr.length; i++) { |
||||
|
var item = arr[i].split('='); |
||||
|
var value = item[1].replace("+", " "); |
||||
|
data[item[0]] = value; |
||||
|
} |
||||
|
var parentId = [[${parentId}]]; |
||||
|
data.parentId = parentId; |
||||
|
return data; |
||||
|
}, |
||||
|
// showBrowse: false, |
||||
|
previewFileIcon: '<i class="fas fa-file"></i>', |
||||
|
preferIconicPreview: true, |
||||
|
previewFileIconSettings: { // configure your icon file extensions |
||||
|
'doc': '<i class="fa fa-file-word-o text-primary"></i>', |
||||
|
'xls': '<i class="fa fa-file-excel-o text-success"></i>', |
||||
|
'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>', |
||||
|
'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>', |
||||
|
'txt': '<i class="fa fa-file-text-o text-info"></i>', |
||||
|
'zip': '<i class="fa fa-file-archive-o text-muted"></i>', |
||||
|
'htm': '<i class="fa fa-file-code-o text-info"></i>', |
||||
|
'mov': '<i class="fa fa-file-movie-o text-warning"></i>', |
||||
|
'mp3': '<i class="fa fa-file-audio-o text-warning"></i>' |
||||
|
}, |
||||
|
previewFileExtSettings: { |
||||
|
'doc': function (ext) { |
||||
|
return ext.match(/(doc|docx)$/i); |
||||
|
}, |
||||
|
'xls': function (ext) { |
||||
|
return ext.match(/(xls|xlsx)$/i); |
||||
|
}, |
||||
|
'ppt': function (ext) { |
||||
|
return ext.match(/(ppt|pptx)$/i); |
||||
|
}, |
||||
|
'zip': function (ext) { |
||||
|
return ext.match(/(zip|rar|tar|gzip|gz|7z)$/i); |
||||
|
}, |
||||
|
'htm': function (ext) { |
||||
|
return ext.match(/(htm|html)$/i); |
||||
|
}, |
||||
|
'mov': function (ext) { |
||||
|
return ext.match(/(avi|mpg|mkv|mov|mp4|3gp|webm|wmv)$/i); |
||||
|
}, |
||||
|
'mp3': function (ext) { |
||||
|
return ext.match(/(mp3|wav)$/i); |
||||
|
}, |
||||
|
'txt': function (ext) { |
||||
|
return ext.match(/(txt|ini|csv|java|php|js|css)$/i); |
||||
|
} |
||||
|
}, |
||||
|
layoutTemplates: { |
||||
|
// actionDelete: ''//去掉删除按钮 |
||||
|
actionUpload: '' // 去掉上传按钮 |
||||
|
}, |
||||
|
initialPreview: filePreview.fileList == null ? [] : filePreview.fileList, |
||||
|
initialPreviewConfig: preview == null ? [] : preview |
||||
|
}); |
||||
|
|
||||
|
// 同步上传成功回调 |
||||
|
$("#fileInput").on("filebatchuploadsuccess", function (event, data, previewId, index) { |
||||
|
fileUploadCallBack(data.response); |
||||
|
}) |
||||
|
}; |
||||
|
|
||||
|
/** 文件上传回调 */ |
||||
|
function fileUploadCallBack(result) { |
||||
|
var parent = window.parent; |
||||
|
if (result.success) { |
||||
|
parent.$.modal.msgSuccess(result.message); |
||||
|
} else { |
||||
|
$.modal.alertError(result.message); |
||||
|
} |
||||
|
$.modal.close(); |
||||
|
parent.$.table.refresh(); |
||||
|
} |
||||
|
</script> |
||||
</body> |
</body> |
||||
</html> |
</html> |
||||
@ -1,52 +1,240 @@ |
|||||
<!DOCTYPE html> |
<!DOCTYPE html> |
||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" > |
<html lang="zh" xmlns:th="http://www.thymeleaf.org"> |
||||
<head> |
<head> |
||||
<th:block th:include="zdxtInclude :: header('场景题目详情')" /> |
<th:block th:include="zdxtInclude :: header('场景题目详情')"/> |
||||
|
<th:block th:include="zdxtInclude :: bootstrap-fileinput-css"/> |
||||
|
<style> |
||||
|
.file-caption-main { |
||||
|
display: none; |
||||
|
} |
||||
|
</style> |
||||
</head> |
</head> |
||||
<body class="white-bg"> |
<body class="white-bg"> |
||||
<div class="wrapper wrapper-content animated fadeInRight ibox-content"> |
<div class="wrapper wrapper-content animated fadeInRight ibox-content"> |
||||
<form class="form-horizontal m" id="form-question-detail" th:object="${sceneQuestion}"> |
<form class="form-horizontal m" id="form-question-detail" th:object="${sceneQuestion}"> |
||||
<input name="id" th:field="*{id}" type="hidden"> |
<input name="id" th:field="*{id}" type="hidden"> |
||||
<div class="form-group"> |
<div class="form-group" id="textTitle" hidden> |
||||
<label class="col-sm-3 control-label">题目名称:</label> |
<label class="col-sm-3 control-label">题目:</label> |
||||
<div class="col-sm-8"> |
<div class="col-sm-8"> |
||||
<input name="name" th:field="*{name}" class="form-control" type="text" readonly> |
<input name="name" th:field="*{name}" class="form-control" type="text" readonly> |
||||
</div> |
|
||||
</div> |
</div> |
||||
<div class="form-group"> |
</div> |
||||
<label class="col-sm-3 control-label">状态:</label> |
<div class="form-group" id="fileTitle" hidden> |
||||
<div class="col-sm-8"> |
<label class="col-sm-3 control-label">题目:</label> |
||||
<select name="status" class="form-control" th:field="*{status}" readonly> |
<div id="fileIn" class="col-sm-8" readonly> |
||||
<option value="0">有效</option> |
<div class="file-loading"> |
||||
<option value="1">无效</option> |
<input id="fileInput" name="file" type="file" multiple> |
||||
</select> |
|
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
<div class="form-group"> |
<div id="fileOut" class="col-sm-8" style="display: none" readonly> |
||||
<label class="col-sm-3 control-label">创建人:</label> |
<div class="file-loading"> |
||||
<div class="col-sm-8"> |
<input id="fileOutput" name="file" type="file" multiple> |
||||
<input name="creator" th:field="*{creator}" class="form-control" type="text" readonly> |
|
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
<div class="form-group"> |
</div> |
||||
<label class="col-sm-3 control-label">创建时间:</label> |
<div class="form-group"> |
||||
<div class="col-sm-8"> |
<label class="col-sm-3 control-label">状态:</label> |
||||
<input name="createTime" th:field="*{createTime}" class="form-control" type="text" readonly> |
<div class="col-sm-8"> |
||||
</div> |
<select name="status" class="form-control" th:field="*{status}" readonly> |
||||
|
<option value="0">有效</option> |
||||
|
<option value="1">无效</option> |
||||
|
</select> |
||||
</div> |
</div> |
||||
<div class="form-group"> |
</div> |
||||
<label class="col-sm-3 control-label">角色:</label> |
<div class="form-group"> |
||||
<div class="col-sm-8"> |
<label class="col-sm-3 control-label">创建人:</label> |
||||
<label th:each="role:${roles}" class="check-box"> |
<div class="col-sm-8"> |
||||
<input name="roleId" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}" th:checked="${sceneQuestion.roleId.contains(role.roleId.toString())}" th:disabled="${role.status == '1'}"> |
<input name="creator" th:field="*{creator}" class="form-control" type="text" readonly> |
||||
</label> |
</div> |
||||
</div> |
</div> |
||||
|
<div class="form-group"> |
||||
|
<label class="col-sm-3 control-label">创建时间:</label> |
||||
|
<div class="col-sm-8"> |
||||
|
<input name="createTime" th:field="*{createTime}" class="form-control" type="text" readonly> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="form-group"> |
||||
|
<label class="col-sm-3 control-label">角色:</label> |
||||
|
<div class="col-sm-8"> |
||||
|
<label th:each="role:${roles}" class="check-box"> |
||||
|
<input name="roleId" type="checkbox" th:value="${role.roleId}" th:text="${role.roleName}" |
||||
|
th:checked="${sceneQuestion.roleId.contains(role.roleId.toString())}" |
||||
|
th:disabled="${role.status == '1'}"> |
||||
|
</label> |
||||
</div> |
</div> |
||||
</form> |
</div> |
||||
</div> |
</form> |
||||
<th:block th:include="zdxtInclude :: footer" /> |
</div> |
||||
<script type="text/javascript"> |
<th:block th:include="zdxtInclude :: footer"/> |
||||
|
<th:block th:include="zdxtInclude :: bootstrap-fileinput-js"/> |
||||
|
<script type="text/javascript" th:inline="javascript"> |
||||
|
var prefix = ctx + "project/question"; |
||||
|
var sceneObj = [[${sceneQuestion}]]; |
||||
|
|
||||
|
if (sceneObj.name == null || sceneObj.name === "") { |
||||
|
$("#fileTitle").show(); |
||||
|
} else { |
||||
|
$("#textTitle").show(); |
||||
|
} |
||||
|
|
||||
|
$(function () { |
||||
|
// 渲染文件要素信息 |
||||
|
renderVersionAtt(); |
||||
|
}) |
||||
|
|
||||
|
|
||||
|
/** 附件相关 */ |
||||
|
|
||||
|
/** 渲染附件信息 */ |
||||
|
function renderVersionAtt() { |
||||
|
var key = $("[name='id']").val(); |
||||
|
|
||||
|
$.getJSON(prefix + "/queryFiles/" + key, function (result) { |
||||
|
if (result.data != null) { |
||||
|
$("#fileIn").hide(); |
||||
|
$("#fileOut").show(); |
||||
|
// 重置文件预览框 |
||||
|
$("#fileOut").html("<div class=\"file-loading\"><input id=\"fileOutput\" name=\"file\" type=\"file\" multiple></div>"); |
||||
|
queryFiles(key); |
||||
|
isFlieIn = false; |
||||
|
} else { |
||||
|
$("#fileIn").show(); |
||||
|
$("#fileOut").hide(); |
||||
|
uploadFiles(); |
||||
|
isFlieIn = true; |
||||
|
$("#fileInput").fileinput('clear') |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
/** 预览附件 */ |
||||
|
function queryFiles(key) { |
||||
|
$.ajax({ |
||||
|
type: "POST", |
||||
|
url: prefix + "/queryFilesPost", |
||||
|
data: {"key": key}, |
||||
|
dataType: 'json', |
||||
|
success: function (result) { |
||||
|
if (result.success == true) { |
||||
|
initFile("fileOutput", prefix + "/edit", result.data.filePreview); |
||||
|
} |
||||
|
}, |
||||
|
error: function (error) { |
||||
|
$.modal.alertWarning("附件预览失败!"); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
/** 上传附件 */ |
||||
|
function uploadFiles() { |
||||
|
var filePreview = {fileList: null, previewRespDTOS: null} |
||||
|
initFile("fileInput", prefix + "/edit", filePreview); |
||||
|
} |
||||
|
|
||||
|
/** 初始化文件 */ |
||||
|
function initFile(elementId, url, filePreview) { |
||||
|
var preview = filePreview.previewRespDTOS; |
||||
|
|
||||
|
if (preview != null) { |
||||
|
for (var i = 0; i < preview.length; i++) { |
||||
|
// 图片删除的地址 |
||||
|
preview[i].url = prefix + "/removeFile" |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
$("#" + elementId).fileinput({ |
||||
|
'theme': 'explorer', |
||||
|
initialPreviewAsData: true, |
||||
|
dropZoneEnabled: true, |
||||
|
dropZoneTitle: "上传图片或视频", |
||||
|
uploadUrl: url, |
||||
|
uploadAsync: false,//异步上传 |
||||
|
enctype: 'multipart/form-data', |
||||
|
showClose: false, |
||||
|
showPreview: true, |
||||
|
showUpload: false, |
||||
|
uploadExtraData: function () { |
||||
|
var formData = $("#form-question-edit").serialize(); |
||||
|
formData = decodeURIComponent(formData, true); |
||||
|
var arr = formData.split("&"); |
||||
|
var data = {}; |
||||
|
for (var i = 0; i < arr.length; i++) { |
||||
|
var item = arr[i].split('='); |
||||
|
var value = item[1].replace("+", " "); |
||||
|
data[item[0]] = value; |
||||
|
} |
||||
|
return data; |
||||
|
}, |
||||
|
// showBrowse: false, |
||||
|
previewFileIcon: '<i class="fas fa-file"></i>', |
||||
|
preferIconicPreview: true, |
||||
|
previewFileIconSettings: { // configure your icon file extensions |
||||
|
'doc': '<i class="fa fa-file-word-o text-primary"></i>', |
||||
|
'xls': '<i class="fa fa-file-excel-o text-success"></i>', |
||||
|
'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>', |
||||
|
'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>', |
||||
|
'txt': '<i class="fa fa-file-text-o text-info"></i>', |
||||
|
'zip': '<i class="fa fa-file-archive-o text-muted"></i>', |
||||
|
'htm': '<i class="fa fa-file-code-o text-info"></i>', |
||||
|
'mov': '<i class="fa fa-file-movie-o text-warning"></i>', |
||||
|
'mp3': '<i class="fa fa-file-audio-o text-warning"></i>' |
||||
|
}, |
||||
|
previewFileExtSettings: { |
||||
|
'doc': function (ext) { |
||||
|
return ext.match(/(doc|docx)$/i); |
||||
|
}, |
||||
|
'xls': function (ext) { |
||||
|
return ext.match(/(xls|xlsx)$/i); |
||||
|
}, |
||||
|
'ppt': function (ext) { |
||||
|
return ext.match(/(ppt|pptx)$/i); |
||||
|
}, |
||||
|
'zip': function (ext) { |
||||
|
return ext.match(/(zip|rar|tar|gzip|gz|7z)$/i); |
||||
|
}, |
||||
|
'htm': function (ext) { |
||||
|
return ext.match(/(htm|html)$/i); |
||||
|
}, |
||||
|
'mov': function (ext) { |
||||
|
return ext.match(/(avi|mpg|mkv|mov|mp4|3gp|webm|wmv)$/i); |
||||
|
}, |
||||
|
'mp3': function (ext) { |
||||
|
return ext.match(/(mp3|wav)$/i); |
||||
|
}, |
||||
|
'txt': function (ext) { |
||||
|
return ext.match(/(txt|ini|csv|java|php|js|css)$/i); |
||||
|
} |
||||
|
}, |
||||
|
layoutTemplates: { |
||||
|
actionDelete: '',//去掉删除按钮 |
||||
|
actionUpload: '' // 去掉上传按钮 |
||||
|
}, |
||||
|
initialPreview: filePreview.fileList == null ? [] : filePreview.fileList, |
||||
|
initialPreviewConfig: preview == null ? [] : preview |
||||
|
}); |
||||
|
|
||||
|
// 同步上传成功回调 |
||||
|
$("#fileInput").on("filebatchuploadsuccess", function (event, data, previewId, index) { |
||||
|
fileUploadCallBack(data.response); |
||||
|
}) |
||||
|
// 同步上传成功回调 |
||||
|
$("#fileOutput").on("filebatchuploadsuccess", function (event, data, previewId, index) { |
||||
|
fileUploadCallBack(data.response); |
||||
|
}) |
||||
|
}; |
||||
|
|
||||
</script> |
function fileUploadCallBack(result) { |
||||
|
var parent = window.parent; |
||||
|
if (result.success) { |
||||
|
parent.$.modal.msgSuccess(result.message); |
||||
|
} else { |
||||
|
$.modal.alertError(result.message); |
||||
|
} |
||||
|
$.modal.close(); |
||||
|
parent.$.table.refresh(); |
||||
|
// $.modal.closeLoading(); |
||||
|
// $.modal.msgReload(result.message, modal_status.SUCCESS); |
||||
|
} |
||||
|
</script> |
||||
</body> |
</body> |
||||
</html> |
</html> |
||||
Loading…
Reference in new issue