RuoYi/zt-admin/src/main/resources/templates/active/info/first.html

116 lines
7.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('修改活动信息')" />
<th:block th:include="include :: ztree-css" />
<th:block th:include="include :: datetimepicker-css" />
<th:block th:include="include :: bootstrap-fileinput-css" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<form class="form-horizontal m" id="form-role-edit" th:object="${active}" enctype="multipart/form-data">
<input id="roleId" name="id" type="hidden" th:field="*{id}"/>
<input id="fpFilesName" name="fpFilesName" type="hidden" th:field="*{fpFilesName}"/>
<input id="listFpNames" name="listFpNames" type="hidden" th:field="*{listFpNames}"/>
<div class="form-group">
<label class="col-sm-3 control-label is-required">活动标题:</label>
<div class="col-sm-8">
<input class="form-control" type="text" name="activeTitle" id="activeTitle" th:field="*{activeTitle}" disabled required>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label is-required">首页活动图片上传推荐宽高比490:872</label>
<div class="col-sm-8">
<div class="file-loading">
<input id="singleFile" name="file" type="file">
</div>
</div>
</div>
</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<script th:src="@{/js/jquery-ui-1.10.4.min.js}"></script>
<th:block th:include="include :: datetimepicker-js" />
<th:block th:include="include :: bootstrap-fileinput-js" />
<script th:src="@{/ajax/libs/beautifyhtml/beautifyhtml.js}"></script>
<script type="text/javascript">
$(document).ready(function(){setup_draggable();$("#n-columns").on("change",function(){var v=$(this).val();if(v==="1"){var $col=$(".form-body .col-md-12").toggle(true);$(".form-body .col-md-6 .draggable").each(function(i,el){$(this).remove().appendTo($col)});$(".form-body .col-md-6").toggle(false)}else{var $col=$(".form-body .col-md-6").toggle(true);$(".form-body .col-md-12 .draggable").each(function(i,el){$(this).remove().appendTo(i%2?$col[1]:$col[0])});$(".form-body .col-md-12").toggle(false)}});$("#copy-to-clipboard").on("click",function(){var $copy=$(".form-body").clone().appendTo(document.body);$copy.find(".tools, :hidden").remove();$.each(["draggable","droppable","sortable","dropped","ui-sortable","ui-draggable","ui-droppable","form-body"],function(i,c){$copy.find("."+c).removeClass(c).removeAttr("style")});var html=html_beautify($copy.html());$copy.remove();$modal=get_modal(html).modal("show");$modal.find(".btn").remove();$modal.find(".modal-title").html("复制HTML代码");$modal.find(":input:first").select().focus();return false})});var setup_draggable=function(){$(".draggable").draggable({appendTo:"body",helper:"clone"});$(".droppable").droppable({accept:".draggable",helper:"clone",hoverClass:"droppable-active",drop:function(event,ui){$(".empty-form").remove();var $orig=$(ui.draggable);if(!$(ui.draggable).hasClass("dropped")){var $el=$orig.clone().addClass("dropped").css({"position":"static","left":null,"right":null}).appendTo(this);if($el.find("label").hasClass("radio-box")){$el=$el.html('<label class="col-sm-3 control-label">单选框:</label>'+'<div class="col-sm-9">'+'<label class="radio-box"><input type="radio" checked="" value="option1" id="optionsRadios1" name="optionsRadios">选项1</label>'+'<label class="radio-box"><input type="radio" value="option2" id="optionsRadios2" name="optionsRadios">选项2</label>'+"</div>")}else{if($el.find("label").hasClass("check-box")){$el=$el.html('<label class="col-sm-3 control-label">复选框:</label>'+'<div class="col-sm-9">'+'<label class="check-box">'+'<input type="checkbox" value="option1" id="inlineCheckbox1">选项1</label>'+'<label class="check-box">'+'<input type="checkbox" value="option2" id="inlineCheckbox2">选项2</label>'+'<label class="check-box">'+'<input type="checkbox" value="option3" id="inlineCheckbox3">选项3</label>'+"</div>")}}var id=$orig.find(":input").attr("id");if(id){id=id.split("-").slice(0,-1).join("-")+"-"+(parseInt(id.split("-").slice(-1)[0])+1);$orig.find(":input").attr("id",id);$orig.find("label").attr("for",id)}$('<p class="tools col-sm-12 col-sm-offset-3"> <a class="edit-link">编辑HTML<a> | <a class="remove-link">移除</a></p>').appendTo($el)}else{if($(this)[0]!=$orig.parent()[0]){var $el=$orig.clone().css({"position":"static","left":null,"right":null}).appendTo(this);$orig.remove()}}}}).sortable()};var get_modal=function(content){var modal=$('<div class="modal" style="overflow: auto;" tabindex="-1"> <div class="modal-dialog"><div class="modal-content"><div class="modal-header"><a type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</a><h4 class="modal-title">编辑HTML</h4></div><div class="modal-body ui-front"> <textarea class="form-control textarea-show-src" style="min-height: 200px; margin-bottom: 10px;font-family: Monaco, Fixed"></textarea><button class="btn btn-success">更新HTML</button></div></div></div></div>').appendTo(document.body);var doms=document.getElementsByClassName("textarea-show-src");for(var i=0;i<doms.length;i++){doms.item(i).innerHTML=content}return modal};$(document).on("click",".edit-link",function(ev){var $el=$(this).parent().parent();var $el_copy=$el.clone();var $edit_btn=$el_copy.find(".edit-link").parent().remove();var $modal=get_modal(html_beautify($el_copy.html())).modal("show");$modal.find(":input:first").focus();$modal.find(".btn-success").click(function(ev2){var html=$modal.find("textarea").val();if(!html){$el.remove()}else{$el.html(html);$edit_btn.appendTo($el)}$modal.modal("hide");return false})});$(document).on("click",".remove-link",function(ev){$(this).parent().parent().remove()});$(".input-group.date").datetimepicker({format:"yyyy-mm-dd",minView:"month",autoclose:true});
</script>
<script type="text/javascript">
function submitHandler() {
add();
}
function add() {
var formData = new FormData($("#form-role-edit")[0])
$.ajax({
cache: false,
contentType: false,
processData: false,
type : "POST",
url : ctx + "active/info/firstSave",
data : formData,
async : false,
error : function(request) {
$.modal.alertError("系统错误");
},
success : function(data) {
$.operate.successCallback(data);
}
});
}
$(document).ready(function () {
});
function fpFilesName(){
var a = $("input[name='listFpNames']").val();
var b= [];
if (a.endsWith('null')){
b= []
}else{
b= [a]
}
console.log('a', a);
// 单图上传
$("#singleFile").fileinput({
uploadUrl: ctx + 'common/uploadsFp',
maxFileCount: 1,
initialPreviewAsData: true,
initialPreview: b,
layoutTemplates: {
footer: '',//隐藏全部小图标
},
showRemove: true, //不显示底部清空按钮
autoReplace: true
}).on('fileuploaded', function (event, data, previewId, index) {
var rsp = data.response;
$("#fpFilesName").val(rsp.newFileName);
log.info("return url" + rsp.url)
log.info("reutrn fileName" + rsp.fileName)
log.info("reutrn newFileName" + rsp.newFileName)
log.info("return originalFilename" + rsp.originalFilename)
}).on('fileremoved', function (event, id, index) {
$("input[name='" + event.currentTarget.id + "']").val('')
}).on('filebeforedelete', function (event, key) {
$.modal.msgSuccess("移除成功-2");
})
}
</script>
</body>
</html>