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