From f16f74cacb9ef0ae4be89ed15353b6a449479d8c Mon Sep 17 00:00:00 2001
From: Administrator <15274802129@163.com>
Date: Wed, 28 May 2025 13:38:09 +0800
Subject: [PATCH] feat(mall): 添加轮播图背景图片功能

---
 src/main/java/cc/mrbird/febs/mall/entity/PlatformBanner.java                     |    4 ++
 src/main/java/cc/mrbird/febs/mall/service/impl/AdminBannerServiceImpl.java       |    1 
 src/main/resources/mapper/modules/PlatformBannerMapper.xml                       |    2 
 src/main/resources/templates/febs/views/modules/banner/platformBannerDetail.html |   43 +++++++++++++++++++++
 src/main/resources/templates/febs/views/modules/banner/platformBanner.html       |   13 ++++++
 src/main/resources/templates/febs/views/modules/banner/platformBannerAdd.html    |   39 +++++++++++++++++++
 6 files changed, 101 insertions(+), 1 deletions(-)

diff --git a/src/main/java/cc/mrbird/febs/mall/entity/PlatformBanner.java b/src/main/java/cc/mrbird/febs/mall/entity/PlatformBanner.java
index e53c4d4..1f8ffb6 100644
--- a/src/main/java/cc/mrbird/febs/mall/entity/PlatformBanner.java
+++ b/src/main/java/cc/mrbird/febs/mall/entity/PlatformBanner.java
@@ -23,6 +23,10 @@
      */
     private String imageUrl;
     /**
+     * 背景图片链接
+     */
+    private String imageBackUrl;
+    /**
      * 是否可跳转 1-是2-否
      */
     private String isJump;
diff --git a/src/main/java/cc/mrbird/febs/mall/service/impl/AdminBannerServiceImpl.java b/src/main/java/cc/mrbird/febs/mall/service/impl/AdminBannerServiceImpl.java
index 4bc711d..34f6edd 100644
--- a/src/main/java/cc/mrbird/febs/mall/service/impl/AdminBannerServiceImpl.java
+++ b/src/main/java/cc/mrbird/febs/mall/service/impl/AdminBannerServiceImpl.java
@@ -61,6 +61,7 @@
     public void platformBannerAdd(@Valid PlatformBanner platformBannerEntity) {
         PlatformBanner platformBannerEntityAdd = new PlatformBanner();
         platformBannerEntityAdd.setImageUrl(platformBannerEntity.getImageUrl());
+        platformBannerEntityAdd.setImageBackUrl(platformBannerEntity.getImageBackUrl());
         platformBannerEntityAdd.setIsInside(platformBannerEntity.getIsInside());
         platformBannerEntityAdd.setIsJump(platformBannerEntity.getIsJump());
         platformBannerEntityAdd.setIsTop(platformBannerEntity.getIsTop());
diff --git a/src/main/resources/mapper/modules/PlatformBannerMapper.xml b/src/main/resources/mapper/modules/PlatformBannerMapper.xml
index 94dd598..4079ccf 100644
--- a/src/main/resources/mapper/modules/PlatformBannerMapper.xml
+++ b/src/main/resources/mapper/modules/PlatformBannerMapper.xml
@@ -14,7 +14,7 @@
 				</if>
 			</if>
 		</where>
-		order by sort desc
+		order by type asc,sort asc
 	</select>
 
 </mapper>
\ No newline at end of file
diff --git a/src/main/resources/templates/febs/views/modules/banner/platformBanner.html b/src/main/resources/templates/febs/views/modules/banner/platformBanner.html
index 902013a..ed817b8 100644
--- a/src/main/resources/templates/febs/views/modules/banner/platformBanner.html
+++ b/src/main/resources/templates/febs/views/modules/banner/platformBanner.html
@@ -36,6 +36,18 @@
     </div>
 </div>
 
+<script type="text/html" id="typeName">
+    {{#
+    var type = {
+    4: {title: '社区首页', color: 'red' },
+    3: {title: '商城首页', color: 'gray' },
+    2: {title: '开屏页', color: 'green' },
+    1: {title: '小程序首页' , color: 'blue'},
+    }[d.type];
+    }}
+    <span class="layui-badge febs-bg-{{type.color}}">{{ type.title }}</span>
+</script>
+
 <script type="text/html" id="isJump">
     {{#
     var isJump = {
@@ -218,6 +230,7 @@
                 cols: [[
                 	{field: 'id', title: '', minWidth: 10,align:'left'},
                     {title: '操作', toolbar: '#user-option', minWidth: 140, fixed : 'right'},
+                    {title: '分类', templet: '#typeName', minWidth: 60,align:'center'},
                 	{field: 'name', title: '标题', minWidth: 120,align:'center'},
                     {field: 'imageUrl',title: '图片',
                         templet: function (d) {
diff --git a/src/main/resources/templates/febs/views/modules/banner/platformBannerAdd.html b/src/main/resources/templates/febs/views/modules/banner/platformBannerAdd.html
index 72275d5..a78bb2a 100644
--- a/src/main/resources/templates/febs/views/modules/banner/platformBannerAdd.html
+++ b/src/main/resources/templates/febs/views/modules/banner/platformBannerAdd.html
@@ -62,6 +62,28 @@
 
                                 <div class="layui-row layui-col-space10 layui-form-item">
                                     <div class="layui-col-lg6">
+                                        <label class="layui-form-label">背景图片:</label>
+                                        <div class="layui-input-block">
+                                            <div class="layui-upload">
+                                                <button type="button" class="layui-btn layui-btn-normal layui-btn" id="bannerImgUploadButtonBack">上传</button>
+                                                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
+                                                    <div class="layui-upload-list" id="bannerImgUploadBack"></div>
+                                                </blockquote>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="layui-row layui-col-space10 layui-form-item febs-hide">
+                                    <div class="layui-col-lg6">
+                                        <label class="layui-form-label">背景图片链接:</label>
+                                        <div class="layui-input-block">
+                                            <input type="text" id="imageBackUrl" name="imageBackUrl" autocomplete="off" class="layui-input" readonly>
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div class="layui-row layui-col-space10 layui-form-item">
+                                    <div class="layui-col-lg6">
                                         <label class="layui-form-label febs-form-item-require">是否置顶:</label>
                                         <div class="layui-input-block">
                                             <input type="radio" name="isTop" value="1" title="是" checked="">
@@ -171,6 +193,23 @@
                 $("#imageUrl").val(res.data.src);
             }
         });
+
+        //图片上传
+        upload.render({
+            elem: '#bannerImgUploadButtonBack'
+            ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
+            ,accept: 'file' //普通文件
+            ,size: 10240 //限制文件大小,单位 KB
+            ,before: function(obj){
+                //预读本地文件示例,不支持ie8
+                obj.preview(function(index, file, result){
+                    $('#bannerImgUploadBack').html('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img single-image" style="width: 130px">')
+                });
+            }
+            ,done: function(res){
+                $("#imageBackUrl").val(res.data.src);
+            }
+        });
         formSelects.render();
         form.on('submit(banner-add-form-submit)', function (data) {
             febs.post(ctx + 'admin/banner/platformBannerAdds', data.field, function () {
diff --git a/src/main/resources/templates/febs/views/modules/banner/platformBannerDetail.html b/src/main/resources/templates/febs/views/modules/banner/platformBannerDetail.html
index 58a1504..10156a1 100644
--- a/src/main/resources/templates/febs/views/modules/banner/platformBannerDetail.html
+++ b/src/main/resources/templates/febs/views/modules/banner/platformBannerDetail.html
@@ -64,6 +64,28 @@
 
                                 <div class="layui-row layui-col-space10 layui-form-item">
                                     <div class="layui-col-lg6">
+                                        <label class="layui-form-label">背景图片:</label>
+                                        <div class="layui-input-block">
+                                            <div class="layui-upload">
+                                                <button type="button" class="layui-btn layui-btn-normal layui-btn" id="bannerImgUploadButtonBack">上传</button>
+                                                <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
+                                                    <div class="layui-upload-list" id="bannerImgUploadBack"></div>
+                                                </blockquote>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="layui-row layui-col-space10 layui-form-item febs-hide">
+                                    <div class="layui-col-lg6">
+                                        <label class="layui-form-label">背景图片链接:</label>
+                                        <div class="layui-input-block">
+                                            <input type="text" id="imageBackUrl" name="imageBackUrl" autocomplete="off" class="layui-input" readonly>
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div class="layui-row layui-col-space10 layui-form-item">
+                                    <div class="layui-col-lg6">
                                         <label class="layui-form-label febs-form-item-require">是否置顶:</label>
                                         <div class="layui-input-block">
                                             <input type="radio" name="isTop" value="1" title="是" checked="">
@@ -159,6 +181,23 @@
             }
         });
 
+        //图片上传
+        upload.render({
+            elem: '#bannerImgUploadButtonBack'
+            ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
+            ,accept: 'file' //普通文件
+            ,size: 10240 //限制文件大小,单位 KB
+            ,before: function(obj){
+                //预读本地文件示例,不支持ie8
+                obj.preview(function(index, file, result){
+                    $('#bannerImgUploadBack').html('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img single-image" style="width: 130px">')
+                });
+            }
+            ,done: function(res){
+                $("#imageBackUrl").val(res.data.src);
+            }
+        });
+
         form.render();
         //(下拉框)
         $.get(ctx + 'admin/banner/typeAll', function (res) {
@@ -183,6 +222,7 @@
                 "id": banner.id,
                 "name": banner.name,
                 "imageUrl": banner.imageUrl,
+                "imageBackUrl": banner.imageBackUrl,
                 "isInside": banner.isInside,
                 "jumpUrl": banner.jumpUrl,
                 "isTop": banner.isTop,
@@ -193,6 +233,9 @@
 
             $('#bannerImgUpload').append('<img src="' + banner.imageUrl + '" alt="" class="layui-upload-img single-image" style="width: 130px">');
             $("#imageUrl").val(banner.imageUrl);
+
+            $('#bannerImgUploadBack').append('<img src="' + banner.imageBackUrl + '" alt="" class="layui-upload-img single-image" style="width: 130px">');
+            $("#imageBackUrl").val(banner.imageBackUrl);
         }
 
         form.on('submit(banner-info-form-submit)', function (data) {

--
Gitblit v1.9.1