登录页面新增资源图

login-base/src/main/java/ink/wgink/login/base/pojo/dtos/login/LoginFormDTO.java

@@ -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\":\"")

login-base/src/main/java/ink/wgink/login/base/pojo/vos/login/LoginFormVO.java

@@ -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\":\"")

login-base/src/main/resources/mybatis/mapper/login/login-form-mapper.xml

@@ -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,

login-base/src/main/resources/templates/login/form/save.html

@@ -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();

login-base/src/main/resources/templates/login/form/update.html

@@ -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);