From 7ae30d4e17cc04f2d8a9fb71d9ffbe35ae452621 Mon Sep 17 00:00:00 2001
From: Hentua <wangdoubleone@gmail.com>
Date: Thu, 18 May 2023 22:50:49 +0800
Subject: [PATCH] fix

---
 src/main/resources/templates/febs/views/modules/score/goodsUpdate.html |  122 ++++++++++++++++++++++++++--------------
 1 files changed, 80 insertions(+), 42 deletions(-)

diff --git a/src/main/resources/templates/febs/views/modules/score/goodsUpdate.html b/src/main/resources/templates/febs/views/modules/score/goodsUpdate.html
index b4d3dae..2b97b4b 100644
--- a/src/main/resources/templates/febs/views/modules/score/goodsUpdate.html
+++ b/src/main/resources/templates/febs/views/modules/score/goodsUpdate.html
@@ -95,17 +95,19 @@
             <label class="layui-form-label febs-form-item-require">缩略图:</label>
             <div class="layui-input-block">
                 <div class="layui-upload">
-                    <button type="button" class="layui-btn" id="test2">上传</button>
+                    <button type="button" class="layui-btn layui-btn-normal layui-btn" id="test2">上传</button>
                     <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                         <div class="layui-upload-list" id="demo2"></div>
                     </blockquote>
+                    <div class="layui-word-aux">双击图片删除</div>
                 </div>
             </div>
         </div>
+
         <div class="layui-form-item febs-hide">
-            <label class="layui-form-label febs-form-item-require">缩略图链接:</label>
+            <label class="layui-form-label">缩略图链接:</label>
             <div class="layui-input-block">
-                <input type="text" id="thumb" name="thumb" autocomplete="off" class="layui-input" readonly>
+                <input type="text" id="thumb" lay-verify="required" name="thumb" autocomplete="off" class="layui-input" readonly>
             </div>
         </div>
 
@@ -117,6 +119,7 @@
                     <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                         <div class="layui-upload-list" id="thumbsBanners"></div>
                     </blockquote>
+                    <div class="layui-word-aux">双击图片删除</div>
                 </div>
             </div>
         </div>
@@ -175,44 +178,8 @@
             },
         }
 
-        //普通图片上传
-        upload.render({
-            elem: '#skuImg'
-            ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
-            ,before: function(obj){
-                //预读本地文件示例,不支持ie8
-                obj.preview(function(index, file, result){
-                    $('#skuImgs').attr('src', result); //图片链接(base64)
-                });
-            }
-            ,done: function(res){
-                febs.alert.success(res.data.src);
-                $("#skuImage").val(res.data.src);
-            }
-        });
 
         //多图片上传
-        upload.render({
-            elem: '#test2'
-            ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
-            ,multiple: true
-            ,before: function(obj){
-                //预读本地文件示例,不支持ie8
-                obj.preview(function(index, file, result){
-                    $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
-                });
-            }
-            ,done: function(res){
-                var thumbs = $("#thumb").val();
-                if(thumbs == ''){
-                    $("#thumb").val(res.data.src);
-                }else{
-                    $("#thumb").val(thumbs + ',' + res.data.src);
-                }
-                // alert($("#thumb").val());
-            }
-        });
-
         upload.render({
             elem: '#thumbsBanner'
             ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
@@ -220,7 +187,7 @@
             ,before: function(obj){
                 //预读本地文件示例,不支持ie8
                 obj.preview(function(index, file, result){
-                    $('#thumbsBanners').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="width: 100px">')
+                    $('#thumbsBanners').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img multi-images" style="width: 130px">')
                 });
             }
             ,done: function(res){
@@ -230,8 +197,75 @@
                 }else{
                     $("#thumbs").val(thumbs + ',' + res.data.src);
                 }
+
+                imgUnBind(".multi-images");
+                imgMultiBind();
             }
         });
+
+        function imgUnBind(className) {
+            $(className).each(function() {
+                $(this).unbind('dblclick');
+            })
+        }
+
+        function imgMultiBind() {
+            $(".multi-images").each(function(index, element) {
+                $(this).on("dblclick", function() {
+                    var imgThumb = $(".multi-images")[index];
+                    $(imgThumb).remove();
+
+                    var images = $("#thumbs").val();
+                    var imagesArr;
+                    if (images) {
+                        imagesArr = images.split(",");
+                        imagesArr.splice(index, 1);
+                        images = imagesArr.join(",");
+                    }
+                    $("#thumbs").val(images);
+
+                    imgUnBind(".multi-images");
+                    imgMultiBind();
+                });
+            })
+        }
+
+        //图片上传
+        upload.render({
+            elem: '#test2'
+            ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
+            ,multiple: true
+            ,before: function(obj){
+                //预读本地文件示例,不支持ie8
+                obj.preview(function(index, file, result){
+                    if ($("#thumb").val()) {
+                        $('#demo2').html('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img single-image" style="width: 130px">')
+                    } else {
+                        $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img single-image" style="width: 130px">')
+                    }
+
+                });
+            }
+            ,done: function(res){
+                $("#thumb").val(res.data.src);
+
+                imgUnBind(".single-image");
+                imgSingleBind();
+            }
+        });
+
+        function imgSingleBind() {
+            $(".single-image").each(function(index, element) {
+                $(this).on("dblclick", function() {
+                    var imgThumb = $(".single-image")[index];
+                    $(imgThumb).remove();
+                    $("#thumb").val("");
+
+                    imgUnBind(".single-image");
+                    imgSingleBind();
+                });
+            })
+        }
 
         layedit.set({	//设置图片接口
             uploadImage: {
@@ -270,10 +304,14 @@
             });
 
             for (let i = 0; i < images.length; i++) {
-                $('#thumbsBanners').append('<img src="' + images[i] + '" alt="" class="layui-upload-img" style="width: 100px">')
+                $('#thumbsBanners').append('<img src="' + images[i] + '" alt="" class="layui-upload-img multi-images" style="width: 130px">')
             }
 
-            $('#demo2').append('<img src="' + goodsInfo.thumb + '" alt="" class="layui-upload-img" style="width: 100px">')
+            $('#demo2').append('<img src="' + goodsInfo.thumb + '" alt="" class="layui-upload-img single-image" style="width: 130px">')
+
+
+            imgSingleBind();
+            imgMultiBind();
 
             window.editor = E.createEditor({
                 html: goodsInfo.goodsDetails,

--
Gitblit v1.9.1