升级bootstrap-fileinput到最新版本5.2.3

ruoyi-admin/src/main/java/com/ruoyi/web/controller/common/CommonController.java

@@ -1,6 +1,5 @@
 package com.ruoyi.web.controller.common;
 
-import java.util.LinkedList;
 import java.util.List;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
@@ -17,7 +16,6 @@ import com.ruoyi.common.config.RuoYiConfig;
 import com.ruoyi.common.config.ServerConfig;
 import com.ruoyi.common.constant.Constants;
 import com.ruoyi.common.core.domain.AjaxResult;
-import com.ruoyi.common.core.domain.FileInfo;
 import com.ruoyi.common.utils.StringUtils;
 import com.ruoyi.common.utils.file.FileUploadUtils;
 import com.ruoyi.common.utils.file.FileUtils;
@@ -35,6 +33,8 @@ public class CommonController
     @Autowired
     private ServerConfig serverConfig;
 
+    private static final String FILE_DELIMETER = ",";
+
     /**
      * 通用下载请求
      * 
@@ -101,17 +101,22 @@ public class CommonController
     {
         try
         {
-            // 上传文件路径
+         // 上传文件路径
             String filePath = RuoYiConfig.getUploadPath();
-            List<FileInfo> fileInfos = new LinkedList<FileInfo>();
+            String fileNames = "";
+            String urls = "";
             for (MultipartFile file : files)
             {
                 // 上传并返回新文件名称
                 String fileName = FileUploadUtils.upload(filePath, file);
                 String url = serverConfig.getUrl() + fileName;
-                fileInfos.add(new FileInfo(fileName, url));
+                fileNames += fileName + FILE_DELIMETER;
+                urls += url + FILE_DELIMETER;
             }
-            return AjaxResult.success(fileInfos);
+            AjaxResult ajax = AjaxResult.success();
+            ajax.put("fileNames", StringUtils.lastStringDel(fileNames, FILE_DELIMETER));
+            ajax.put("urls", StringUtils.lastStringDel(urls, FILE_DELIMETER));
+            return ajax;
         }
         catch (Exception e)
         {

ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-fileinput/fileinput.css

@@ -1,16 +1,18 @@
 /*!
- * bootstrap-fileinput v5.1.3
+ * bootstrap-fileinput v5.2.3
  * http://plugins.krajee.com/file-input
  *
  * Krajee default styling for bootstrap-fileinput.
  *
  * Author: Kartik Visweswaran
- * Copyright: 2014 - 2020, Kartik Visweswaran, Krajee.com
+ * Copyright: 2014 - 2021, Kartik Visweswaran, Krajee.com
  *
  * Licensed under the BSD-3-Clause
  * https://github.com/kartik-v/bootstrap-fileinput/blob/master/LICENSE.md
  */
-.file-loading input[type=file], input[type=file].file-loading {
+
+.file-loading input[type=file],
+input[type=file].file-loading {
     width: 0;
     height: 0;
 }
@@ -29,11 +31,31 @@
     box-shadow: none;
 }
 
-.kv-hidden, .file-caption-icon, .file-zoom-dialog .modal-header:before, .file-zoom-dialog .modal-header:after, .file-input-new .file-preview, .file-input-new .close, .file-input-new .glyphicon-file, .file-input-new .fileinput-remove-button, .file-input-new .fileinput-upload-button, .file-input-new .no-browse .input-group-btn, .file-input-ajax-new .fileinput-remove-button, .file-input-ajax-new .fileinput-upload-button, .file-input-ajax-new .no-browse .input-group-btn, .hide-content .kv-file-content, .is-locked .fileinput-upload-button, .is-locked .fileinput-remove-button {
+.kv-hidden,
+.file-caption-icon,
+.file-zoom-dialog .modal-header:before,
+.file-zoom-dialog .modal-header:after,
+.file-input-new .file-preview,
+.file-input-new .close,
+.file-input-new .glyphicon-file,
+.file-input-new .fileinput-remove-button,
+.file-input-new .fileinput-upload-button,
+.file-input-new .no-browse .input-group-btn,
+.file-input-ajax-new .fileinput-remove-button,
+.file-input-ajax-new .fileinput-upload-button,
+.file-input-ajax-new .no-browse .input-group-btn,
+.hide-content .kv-file-content,
+.is-locked .fileinput-upload-button,
+.is-locked .fileinput-remove-button {
     display: none;
 }
 
-.btn-file input[type=file], .file-caption-icon, .file-preview .fileinput-remove, .krajee-default .file-thumb-progress, .file-zoom-dialog .btn-navigate, .file-zoom-dialog .floating-buttons {
+.btn-file input[type=file],
+.file-caption-icon,
+.file-preview .fileinput-remove,
+.krajee-default .file-thumb-progress,
+.file-zoom-dialog .btn-navigate,
+.file-zoom-dialog .floating-buttons {
     position: absolute;
 }
 
@@ -41,35 +63,50 @@
     line-height: inherit;
 }
 
-.file-input, .file-loading:before, .btn-file, .file-caption, .file-preview, .krajee-default.file-preview-frame, .krajee-default .file-thumbnail-footer, .file-zoom-dialog .modal-dialog {
+.file-input,
+.file-loading:before,
+.btn-file,
+.file-caption,
+.file-preview,
+.krajee-default.file-preview-frame,
+.krajee-default .file-thumbnail-footer,
+.file-zoom-dialog .modal-dialog {
     position: relative;
 }
 
-.file-error-message pre, .file-error-message ul, .krajee-default .file-actions, .krajee-default .file-other-error {
+.file-error-message pre,
+.file-error-message ul,
+.krajee-default .file-actions,
+.krajee-default .file-other-error {
     text-align: left;
 }
 
-.file-error-message pre, .file-error-message ul {
+.file-error-message pre,
+.file-error-message ul {
     margin: 0;
 }
 
-.krajee-default .file-drag-handle, .krajee-default .file-upload-indicator {
+.krajee-default .file-drag-handle,
+.krajee-default .file-upload-indicator {
     float: left;
     margin-top: 10px;
     width: 16px;
     height: 16px;
 }
 
-.file-thumb-progress .progress, .file-thumb-progress .progress-bar {
+.file-thumb-progress .progress,
+.file-thumb-progress .progress-bar {
     font-family: Verdana, Helvetica, sans-serif;
     font-size: 0.7rem;
 }
 
-.krajee-default .file-thumb-progress .progress, .kv-upload-progress .progress {
+.krajee-default .file-thumb-progress .progress,
+.kv-upload-progress .progress {
     background-color: #ccc;
 }
 
-.krajee-default .file-caption-info, .krajee-default .file-size-info {
+.krajee-default .file-caption-info,
+.krajee-default .file-size-info {
     display: block;
     white-space: nowrap;
     overflow: hidden;
@@ -79,17 +116,23 @@
     margin: auto;
 }
 
-.file-zoom-content > .file-object.type-video, .file-zoom-content > .file-object.type-flash, .file-zoom-content > .file-object.type-image {
+.file-zoom-content > .file-object.type-video,
+.file-zoom-content > .file-object.type-flash,
+.file-zoom-content > .file-object.type-image {
     max-width: 100%;
     max-height: 100%;
     width: auto;
 }
 
-.file-zoom-content > .file-object.type-video, .file-zoom-content > .file-object.type-flash {
+.file-zoom-content > .file-object.type-video,
+.file-zoom-content > .file-object.type-flash {
     height: 100%;
 }
 
-.file-zoom-content > .file-object.type-pdf, .file-zoom-content > .file-object.type-html, .file-zoom-content > .file-object.type-text, .file-zoom-content > .file-object.type-default {
+.file-zoom-content > .file-object.type-pdf,
+.file-zoom-content > .file-object.type-html,
+.file-zoom-content > .file-object.type-text,
+.file-zoom-content > .file-object.type-default {
     width: 100%;
 }
 
@@ -131,26 +174,44 @@
     height: 100%;
 }
 
-.file-caption .file-caption-name {
-    width: 100%;
-    margin: 0;
-    padding: 0;
-    box-shadow: none;
-    border: none;
-    background: none;
-    outline: none;
-}
-
 .file-caption.icon-visible .file-caption-icon {
     display: inline-block;
 }
 
 .file-caption.icon-visible .file-caption-name {
-    padding-left: 15px;
+    padding-left: 1.875rem;
+}
+
+.file-caption.icon-visible > .input-group-lg .file-caption-name {
+    padding-left: 2.1rem;
+}
+
+.file-caption.icon-visible > .input-group-sm .file-caption-name {
+    padding-left: 1.5rem;
+}
+
+.file-caption-name:not(.file-caption-disabled) {
+    background-color: transparent;
+}
+
+.file-caption-name.file-processing {
+    font-style: italic;
+    border-color: #bbb;
+    opacity: 0.5;
 }
 
 .file-caption-icon {
-    left: 8px;
+    padding: 0.5rem;
+    left: 4px;
+}
+
+.input-group-lg .file-caption-icon {
+    font-size: 1.25rem;
+}
+
+.input-group-sm .file-caption-icon {
+    font-size: 0.875rem;
+    padding: 0.25rem;
 }
 
 .file-error-message {
@@ -200,10 +261,10 @@
 .file-preview-image {
     font: 40px Impact, Charcoal, sans-serif;
     color: #008000;
-    width:auto;
+    width: auto;
-    height:auto;
+    height: auto;
-    max-width:100%;
+    max-width: 100%;
-    max-height:100%;
+    max-height: 100%;
 }
 
 .krajee-default.file-preview-frame {
@@ -319,7 +380,9 @@
     font-family: Verdana, Helvetica, sans-serif;
 }
 
+
 /*noinspection CssOverwrittenProperties*/
+
 .file-zoom-dialog .file-other-icon {
     font-size: 22em;
     font-size: 50vmin;
@@ -336,21 +399,18 @@
 }
 
 .file-zoom-dialog .btn-navigate {
+    margin: 0 0.1rem;
     padding: 0;
-    margin: -60px 0 0;
+    font-size: 1.2rem;
-    font-size: 60px;
+    width: 2.4rem;
-    background: transparent;
+    height: 2.4rem;
-    text-decoration: none;
-    outline: none;
-    opacity: 0.7;
     top: 50%;
-    color: #1c94c4;
+    border-radius: 50%;
+    text-align:center;
 }
 
-.file-zoom-dialog .btn-navigate:not([disabled]):hover {
+.btn-navigate * {
-    outline: none;
+    width: auto;
-    box-shadow: none;
-    opacity: 0.6;
 }
 
 .file-zoom-dialog .floating-buttons {
@@ -358,27 +418,59 @@
     right: 10px;
 }
 
-.file-zoom-dialog .btn-navigate[disabled] {
+.file-zoom-dialog .btn-kv-prev {
-    opacity: 0.3;
+    left: 0;
 }
 
-.file-zoom-dialog .btn-prev {
+.file-zoom-dialog .btn-kv-next {
-    left: 1px;
+    right: 0;
 }
 
-.file-zoom-dialog .btn-next {
+.file-zoom-dialog .kv-zoom-caption {
-    right: 1px;
-}
-
-.file-zoom-dialog .kv-zoom-title {
-    font-weight: 300;
-    color: #999;
     max-width: 50%;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
 }
 
+.file-zoom-dialog .kv-zoom-header {
+    padding: 0.5rem;
+}
+
+.file-zoom-dialog .kv-zoom-body {
+    padding: 0.25rem 0.5rem 0.25rem 0;
+}
+
+.file-zoom-dialog .kv-zoom-description {
+    position: absolute;
+    opacity: 0.8;
+    font-size: 0.8rem;
+    background-color: #1a1a1a;
+    padding: 1rem;
+    text-align: center;
+    border-radius: 0.5rem;
+    color: #fff;
+    left: 15%;
+    right: 15%;
+    bottom: 15%;
+}
+
+.file-zoom-dialog .kv-desc-hide {
+    float: right;
+    color: #fff;
+    padding: 0 0.1rem;
+    background: none;
+    border: none;
+}
+
+.file-zoom-dialog .kv-desc-hide:hover {
+    opacity: 0.7;
+}
+
+.file-zoom-dialog .kv-desc-hide:focus {
+    opacity: 0.9;
+}
+
 .file-input-new .no-browse .form-control {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px;
@@ -389,8 +481,9 @@
     border-bottom-right-radius: 4px;
 }
 
-.file-caption-main {
+.file-caption {
     width: 100%;
+    position: relative;
 }
 
 .file-thumb-loading {
@@ -422,7 +515,7 @@
 .file-drop-zone-title {
     color: #aaa;
     font-size: 1.6em;
-    text-align:center;
+    text-align: center;
     padding: 85px 10px;
     cursor: default;
 }
@@ -448,7 +541,7 @@
     min-height: 100vh;
 }
 
-.file-zoom-fullscreen .modal-body {
+.file-zoom-fullscreen .kv-zoom-body {
     overflow-y: auto;
 }
 
@@ -467,9 +560,23 @@
 
 .file-zoom-content {
     text-align: center;
+    white-space: nowrap;
     min-height: 300px;
 }
 
+.file-zoom-content:hover {
+    background: transparent;
+}
+
+.file-zoom-content > * {
+    display: inline-block;
+    vertical-align: middle;
+}
+
+.file-zoom-content .kv-spacer {
+    height: 100%;
+}
+
 .file-zoom-content .file-preview-image {
     max-height: 100%;
 }
@@ -544,7 +651,8 @@
     opacity: 1;
 }
 
-.file-grabbing, .file-grabbing * {
+.file-grabbing,
+.file-grabbing * {
     cursor: not-allowed !important;
 }
 

ruoyi-admin/src/main/resources/templates/demo/form/upload.html

@@ -60,11 +60,8 @@
             uploadAsync: false
         }).on('filebatchuploadsuccess', function (event, data, previewId, index) {
         	var rsp = data.response;
-        	var fileJson = rsp.data;
+        	log.info("return urls：" + rsp.urls)
-        	for (var i in fileJson) {
+            log.info("reutrn fileNames：" + rsp.fileNames)
-        	    log.info("return data.url：" + fileJson[i].url) 
-        	    log.info("reutrn data.name：" + fileJson[i].name)
-        	}
         }).on('fileremoved', function (event, id, index) {
             $("input[name='" + event.currentTarget.id + "']").val('')
         })

ruoyi-admin/src/main/resources/templates/include.html

@@ -108,10 +108,10 @@
 
 <!-- fileinput文件上传插件 -->
 <div th:fragment="bootstrap-fileinput-css">
-    <link th:href="@{/ajax/libs/bootstrap-fileinput/fileinput.min.css?v=20201202}" rel="stylesheet"/>
+    <link th:href="@{/ajax/libs/bootstrap-fileinput/fileinput.min.css?v=202108081}" rel="stylesheet"/>
 </div>
 <div th:fragment="bootstrap-fileinput-js">
-    <script th:src="@{/ajax/libs/bootstrap-fileinput/fileinput.min.js?v=20201202}"></script>
+    <script th:src="@{/ajax/libs/bootstrap-fileinput/fileinput.min.js?v=202108081}"></script>
 </div>
 
 <!-- duallistbox双列表框插件 -->

ruoyi-common/src/main/java/com/ruoyi/common/core/domain/FileInfo.java

@@ -1,61 +0,0 @@
-package com.ruoyi.common.core.domain;
-
-import org.apache.commons.lang3.builder.ToStringBuilder;
-import org.apache.commons.lang3.builder.ToStringStyle;
-
-/**
- * 文件信息
- * 
- * @author ruoyi
- */
-public class FileInfo
-{
-    /**
-     * 文件名称
-     */
-     private String name;
-
-     /**
-     * 文件地址
-     */
-    private String url;
-
-    public FileInfo()
-    {
-
-    }
-
-    public FileInfo(String name, String url)
-    {
-        this.name = name;
-        this.url = url;
-    }
-
-    public String getName()
-     {
-         return name;
-     }
-
-     public void setName(String name)
-     {
-         this.name = name;
-     }
-
-     public String getUrl()
-     {
-         return url;
-     }
-
-     public void setUrl(String url)
-     {
-         this.url = url;
-     }
-
-     @Override
-     public String toString() {
-         return new ToStringBuilder(this,ToStringStyle.MULTI_LINE_STYLE)
-             .append("name", getName())
-             .append("url", getUrl())
-             .toString();
-     }
- }

ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java

@@ -418,6 +418,22 @@ public class StringUtils extends org.apache.commons.lang3.StringUtils
         return false;
     }
 
+    /**
+     * 删除最后一个字符串
+     *
+     * @param str 输入字符串
+     * @param spit 以什么类型结尾的
+     * @return 截取后的字符串
+     */
+    public static String lastStringDel(String str, String spit)
+    {
+        if (!StringUtils.isEmpty(str) && str.endsWith(spit))
+        {
+            return str.subSequence(0, str.length() - 1).toString();
+        }
+        return str;
+    }
+
     /**
      * 将下划线大写方式命名的字符串转换为驼峰式。如果转换前的下划线大写方式命名的字符串为空，则返回空字符串。 例如：HELLO_WORLD->HelloWorld
      *