From 07810b68ec49533f35698108d03ec9c1254807e9 Mon Sep 17 00:00:00 2001
From: Helius <wangdoubleone@gmail.com>
Date: Tue, 31 May 2022 18:02:03 +0800
Subject: [PATCH] fix goods img del

---
 src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html |   86 +++++++++++++++++++++++++++++-------------
 1 files changed, 59 insertions(+), 27 deletions(-)

diff --git a/src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html b/src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html
index 7924ed4..0f38712 100644
--- a/src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html
+++ b/src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html
@@ -109,6 +109,7 @@
                                                     <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>
@@ -128,6 +129,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>
@@ -241,6 +243,12 @@
     }
     .layui-table-cell {
         height:auto;
+    }
+    .layui-upload-list {
+        margin: 0 !important;
+    }
+    .multi-images {
+        margin: 0 5px !important;
     }
 </style>
 <script type="text/html" id="toolbar">
@@ -491,7 +499,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){
@@ -501,8 +509,38 @@
                 }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({
@@ -512,40 +550,34 @@
             ,before: function(obj){
                 //预读本地文件示例,不支持ie8
                 obj.preview(function(index, file, result){
-                    $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="width: 100px">')
+                    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();
             }
         });
 
-        // layedit.set({	//设置图片接口
-        //     uploadImage: {
-        //         url: 'admin/goods/uploadFileBase64', //接口url
-        //         type: 'post',
-        //     }
-        // });
-        // //创建一个编辑器
-        // var index = layedit.build('goodsDetailEdit', { height: '300px', });
-        // //提交时把值同步到文本域中
-        // form.verify({
-        //     //content富文本域中的lay-verify值
-        //     goodsDetails: function(value) {
-        //         return layedit.sync(index);
-        //     }
-        // });
+        function imgSingleBind() {
+            $(".single-image").each(function(index, element) {
+                $(this).on("dblclick", function() {
+                    var imgThumb = $(".single-image")[index];
+                    $(imgThumb).remove();
+                    $("#thumb").val("");
 
-
-        // upload.render({
-        //     elem: '#skuImg'+index
-        //     ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口
-        //     ,done: function(res){
-        //         febs.alert.success(res.data.src);
-        //         $('#imageUrls' + index).attr('src', res.data.src);
-        //         $('#skuImage'+ index).val(res.data.src);
-        //     }
-        // });
+                    imgUnBind(".single-image");
+                    imgSingleBind();
+                });
+            })
+        }
 
         form.on('submit(goods-add-form-submit)', function (data) {
             data.field.goodsType = 1;

--
Gitblit v1.9.1