登录页面新增资源图

This commit is contained in:
wanggeng 2021-08-02 10:48:05 +08:00
parent ecf0ad625c
commit dab9dc6bc5
5 changed files with 267 additions and 0 deletions

View File

@ -26,6 +26,8 @@ public class LoginFormDTO implements Serializable {
private Integer isActive;
@ApiModelProperty(name = "preview", value = "预览")
private String preview;
@ApiModelProperty(name = "resourceImgs", value = "资源图片")
private String resourceImgs;
@ApiModelProperty(name = "formHtml", value = "form代码")
private String formHtml;
@ApiModelProperty(name = "formCss", value = "form样式")
@ -43,46 +45,98 @@ public class LoginFormDTO implements Serializable {
return loginFormId == null ? "" : loginFormId.trim();
}
public void setLoginFormId(String loginFormId) {
this.loginFormId = loginFormId;
}
public String getName() {
return name == null ? "" : name.trim();
}
public void setName(String name) {
this.name = name;
}
public String getSummary() {
return summary == null ? "" : summary.trim();
}
public void setSummary(String summary) {
this.summary = summary;
}
public Integer getIsActive() {
return isActive == null ? 0 : isActive;
}
public void setIsActive(Integer isActive) {
this.isActive = isActive;
}
public String getPreview() {
return preview == null ? "" : preview.trim();
}
public void setPreview(String preview) {
this.preview = preview;
}
public String getResourceImgs() {
return resourceImgs == null ? "" : resourceImgs.trim();
}
public void setResourceImgs(String resourceImgs) {
this.resourceImgs = resourceImgs;
}
public String getFormHtml() {
return formHtml == null ? "" : formHtml.trim();
}
public void setFormHtml(String formHtml) {
this.formHtml = formHtml;
}
public String getFormCss() {
return formCss == null ? "" : formCss.trim();
}
public void setFormCss(String formCss) {
this.formCss = formCss;
}
public String getFormLeftCss() {
return formLeftCss == null ? "" : formLeftCss.trim();
}
public void setFormLeftCss(String formLeftCss) {
this.formLeftCss = formLeftCss;
}
public String getFormCenterCss() {
return formCenterCss == null ? "" : formCenterCss.trim();
}
public void setFormCenterCss(String formCenterCss) {
this.formCenterCss = formCenterCss;
}
public String getFormRightCss() {
return formRightCss == null ? "" : formRightCss.trim();
}
public void setFormRightCss(String formRightCss) {
this.formRightCss = formRightCss;
}
public String getGmtCreat() {
return gmtCreat == null ? "" : gmtCreat.trim();
}
public void setGmtCreat(String gmtCreat) {
this.gmtCreat = gmtCreat;
}
@Override
public String toString() {
final StringBuilder sb = new StringBuilder("{");
@ -96,6 +150,8 @@ public class LoginFormDTO implements Serializable {
.append(isActive);
sb.append(",\"preview\":\"")
.append(preview).append('\"');
sb.append(",\"resourceImgs\":\"")
.append(resourceImgs).append('\"');
sb.append(",\"formHtml\":\"")
.append(formHtml).append('\"');
sb.append(",\"formCss\":\"")

View File

@ -25,6 +25,8 @@ public class LoginFormVO {
private Integer isActive;
@ApiModelProperty(name = "preview", value = "预览")
private String preview;
@ApiModelProperty(name = "resourceImgs", value = "资源图片")
private String resourceImgs;
@ApiModelProperty(name = "formHtml", value = "form代码")
@CheckEmptyAnnotation(name = "form代码")
private String formHtml;
@ -69,6 +71,14 @@ public class LoginFormVO {
this.preview = preview;
}
public String getResourceImgs() {
return resourceImgs == null ? "" : resourceImgs.trim();
}
public void setResourceImgs(String resourceImgs) {
this.resourceImgs = resourceImgs;
}
public String getFormHtml() {
return formHtml == null ? "" : formHtml.trim();
}
@ -120,6 +130,8 @@ public class LoginFormVO {
.append(isActive);
sb.append(",\"preview\":\"")
.append(preview).append('\"');
sb.append(",\"resourceImgs\":\"")
.append(resourceImgs).append('\"');
sb.append(",\"formHtml\":\"")
.append(formHtml).append('\"');
sb.append(",\"formCss\":\"")

View File

@ -10,6 +10,7 @@
<result column="summary" property="summary"/>
<result column="is_active" property="isActive"/>
<result column="preview" property="preview"/>
<result column="resource_imgs" property="resourceImgs"/>
<result column="form_html" property="formHtml"/>
<result column="form_css" property="formCss"/>
<result column="form_left_css" property="formLeftCss"/>
@ -27,6 +28,7 @@
`summary` varchar(255) DEFAULT NULL COMMENT '说明',
`is_active` int(1) DEFAULT '1' COMMENT '是否激活',
`preview` char(36) DEFAULT NULL COMMENT '预览',
`resource_imgs` text COMMENT '资源图片',
`form_html` longtext COMMENT 'form代码',
`form_css` longtext COMMENT 'form样式',
`form_left_css` text COMMENT 'form左样式',
@ -49,6 +51,7 @@
summary,
is_active,
preview,
resource_imgs,
form_html,
form_css,
form_left_css,
@ -65,6 +68,7 @@
#{summary},
#{isActive},
#{preview},
#{resourceImgs},
#{formHtml},
#{formCss},
#{formLeftCss},
@ -110,6 +114,9 @@
<if test="preview != null and preview != ''">
preview = #{preview},
</if>
<if test="resourceImgs != null and resourceImgs != ''">
resource_imgs = #{resourceImgs},
</if>
<if test="formHtml != null and formHtml != ''">
form_html = #{formHtml},
</if>
@ -165,6 +172,7 @@
summary,
is_active,
preview,
resource_imgs,
form_html,
form_css,
form_left_css,

View File

@ -73,6 +73,48 @@
</script>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">资源图</label>
<div class="layui-input-block">
<input type="hidden" id="resourceImgs" name="resourceImgs">
<div class="layui-btn-container" id="resourceImgsFileBox" style="border: 1px solid #e6e6e6;"></div>
<script id="resourceImgsFileDownload" type="text/html">
{{# var fileName = 'resourceImgs'; }}
{{# if(d[fileName].length > 0) { }}
{{# var files = d[fileName];}}
<table class="layui-table" style="margin: 0;">
<colgroup>
<col width="100">
<col width="600">
<col>
</colgroup>
<tbody>
{{# for(var i = 0, item = files[i]; item = files[i++];) { }}
<tr>
<td>
<img src="route/file/download/false/{{item.fileId}}" align="加载失败">
</td>
<td>图片路径route/file/download/false/{{item.fileId}}</td>
<td>
<a class="layui-btn layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="resourceImgsRemoveFile">
<i class="fa fa-trash-o"></i> 删除
</a>
</td>
</tr>
{{# } }}
</tbody>
</table>
{{# } }}
{{# if(d[fileName].length < 20) { }}
<div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
<a href="javascript:void(0);" lay-form-button data-explain="资源图" data-name="resourceImgs" lay-filter="resourceImgsUploadFile">
<i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
</a>
</div>
{{# } }}
</script>
</div>
</div>
<blockquote class="layui-elem-quote">
<ul>
<li>1. form表单代码表单的HTML代码。</li>
@ -411,6 +453,58 @@
});
}
// 初始化预览图预览图上传
function initResourceImgsUploadFile() {
var files = $('#resourceImgs').val();
initFileList('resourceImgs', files, function(fileName) {
var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
viewerObj[fileName] = viewer;
});
form.on('button(resourceImgsUploadFile)', function(obj) {
var name = this.dataset.name;
var explain = this.dataset.explain;
top.dialog.file({
type: 'image',
title: '上传'+ explain,
width: '400px',
height: '420px',
maxFileCount: '1',
onClose: function() {
var uploadFileArray = top.dialog.dialogData.uploadFileArray;
if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
var files = $('#'+ name).val();
for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
if(files.length > 0) {
files += ',';
}
files += file.data;
}
initFileList(name, files, function(fileName) {
viewerObj[fileName].update();
});
}
}
});
});
form.on('button(resourceImgsRemoveFile)', function(obj) {
var name = this.dataset.name;
var id = this.dataset.id;
var files = $('#'+ name).val().replace(id, '');
files = files.replace(/\,+/g, ',');
if(files.charAt(0) == ',') {
files = files.substring(1);
}
if(files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
initFileList(name, files, function(fileName) {
viewerObj[fileName].update();
});
});
}
function initFormHtml() {
var editor = CodeMirror.fromTextArea(document.getElementById('formHtml'), {
lineNumbers: true,
@ -468,6 +562,7 @@
// 初始化
function initData() {
initPreviewUploadFile();
initResourceImgsUploadFile();
initFormHtml();
initFormCss();
initFormLeftCss();

View File

@ -73,6 +73,48 @@
</script>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">资源图</label>
<div class="layui-input-block">
<input type="hidden" id="resourceImgs" name="resourceImgs">
<div class="layui-btn-container" id="resourceImgsFileBox" style="border: 1px solid #e6e6e6;"></div>
<script id="resourceImgsFileDownload" type="text/html">
{{# var fileName = 'resourceImgs'; }}
{{# if(d[fileName].length > 0) { }}
{{# var files = d[fileName];}}
<table class="layui-table" style="margin: 0;">
<colgroup>
<col width="100">
<col width="600">
<col>
</colgroup>
<tbody>
{{# for(var i = 0, item = files[i]; item = files[i++];) { }}
<tr>
<td>
<img src="route/file/download/false/{{item.fileId}}" align="加载失败">
</td>
<td>图片路径route/file/download/false/{{item.fileId}}</td>
<td>
<a class="layui-btn layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="resourceImgsRemoveFile">
<i class="fa fa-trash-o"></i> 删除
</a>
</td>
</tr>
{{# } }}
</tbody>
</table>
{{# } }}
{{# if(d[fileName].length < 20) { }}
<div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
<a href="javascript:void(0);" lay-form-button data-explain="资源图" data-name="resourceImgs" lay-filter="resourceImgsUploadFile">
<i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
</a>
</div>
{{# } }}
</script>
</div>
</div>
<blockquote class="layui-elem-quote">
<ul>
<li>1. form表单代码表单的HTML代码。</li>
@ -413,6 +455,58 @@
});
}
// 初始化预览图预览图上传
function initResourceImgsUploadFile() {
var files = $('#resourceImgs').val();
initFileList('resourceImgs', files, function(fileName) {
var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
viewerObj[fileName] = viewer;
});
form.on('button(resourceImgsUploadFile)', function(obj) {
var name = this.dataset.name;
var explain = this.dataset.explain;
top.dialog.file({
type: 'image',
title: '上传'+ explain,
width: '400px',
height: '420px',
maxFileCount: '1',
onClose: function() {
var uploadFileArray = top.dialog.dialogData.uploadFileArray;
if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
var files = $('#'+ name).val();
for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
if(files.length > 0) {
files += ',';
}
files += file.data;
}
initFileList(name, files, function(fileName) {
viewerObj[fileName].update();
});
}
}
});
});
form.on('button(resourceImgsRemoveFile)', function(obj) {
var name = this.dataset.name;
var id = this.dataset.id;
var files = $('#'+ name).val().replace(id, '');
files = files.replace(/\,+/g, ',');
if(files.charAt(0) == ',') {
files = files.substring(1);
}
if(files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
initFileList(name, files, function(fileName) {
viewerObj[fileName].update();
});
});
}
function initFormHtml(value) {
var editor = CodeMirror.fromTextArea(document.getElementById('formHtml'), {
lineNumbers: true,
@ -481,6 +575,7 @@
summary: data.summary,
isActive: data.isActive,
preview: data.preview,
resourceImgs: data.resourceImgs,
formHtml: data.formHtml,
formCss: data.formCss,
formLeftCss: data.formLeftCss,
@ -490,6 +585,7 @@
form.render(null, 'dataForm');
initPreviewUploadFile();
initResourceImgsUploadFile();
initFormHtml(data.formHtml);
initFormCss(data.formCss);
initFormLeftCss(data.formLeftCss);