From c3ed9a07b0765834136afb6400d350d895584b51 Mon Sep 17 00:00:00 2001 From: KKSU <15274802129@163.com> Date: Mon, 01 Jul 2024 14:03:23 +0800 Subject: [PATCH] 后台 --- src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html | 310 +++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 249 insertions(+), 61 deletions(-) diff --git a/src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html b/src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html index bfd4d27..9afc187 100644 --- a/src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html +++ b/src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html @@ -32,14 +32,19 @@ </div> </div> </div> - <div class="layui-row layui-col-space10 layui-form-item"> + <div class="layui-form-item"> <div class="layui-col-lg6"> <label class="layui-form-label febs-form-item-require">商品分类:</label> <div class="layui-input-block"> -<!-- <select name="categoryId" class="categary-addPeoduct">--> -<!-- <option value="">请选择</option>--> -<!-- </select>--> <div id="goods-category"></div> + </div> + </div> + + <div class="layui-col-lg6"> + <label class="layui-form-label">是否主推:</label> + <div class="layui-input-block"> + <input type="radio" name="isHot" value="1" title="是" /> + <input type="radio" name="isHot" value="2" title="否" checked /> </div> </div> </div> @@ -71,6 +76,23 @@ </div> <div class="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="text" name="sortCnt" lay-verify="required|integer" placeholder="" autocomplete="off" class="layui-input"> + <div class="layui-form-mid layui-word-aux">设置商品排序位置,想排列在前,设置的数字越小</div> + </div> + </div> + <div class="layui-col-lg6"> + <label class="layui-form-label febs-form-item-require">抵扣现金(%):</label> + <div class="layui-input-block"> + <input type="text" name="scorePercent" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> + <div class="layui-word-aux">设置50,即商品价格1000,积分可抵扣的最大金额为1000*50%=500,填写整数,如【50】</div> + </div> + </div> + </div> + + <div class="layui-form-item"> <label class="layui-form-label">商品介绍:</label> <div class="layui-input-block"> <label> @@ -80,7 +102,7 @@ </div> </div> - <blockquote class="layui-elem-quote blue-border">商品类型</blockquote> + <blockquote class="layui-elem-quote blue-border">商品类型:</blockquote> <div class="layui-form-item"> <label class="layui-form-label febs-form-item-require">商品类型</label> <div class="layui-input-block"> @@ -93,23 +115,30 @@ </div> <div class="layui-form-item febs-hide tc-set"> - <label class="layui-form-label">静态倍数</label> + <label class="layui-form-label">贡献值:</label> <div class="layui-input-block"> - <input type="text" name="staticMulti" placeholder="请输入静态倍数" - autoComplete="off" class="layui-input"> - <div class="layui-form-mid layui-word-aux">支付后,赠送(购买金额*静态倍数)的赠送积分 - </div> + <input type="text" name="star" lay-verify="required" placeholder="请输入贡献值" autocomplete="off" class="layui-input"> + <div class="layui-form-mid layui-word-aux">支付后,用户获取对应的贡献值</div> </div> </div> +<!-- <div class="layui-form-item febs-hide tc-set">--> +<!-- <label class="layui-form-label">静态倍数</label>--> +<!-- <div class="layui-input-block">--> +<!-- <input type="text" name="staticMulti" placeholder="请输入静态倍数"--> +<!-- autoComplete="off" class="layui-input">--> +<!-- <div class="layui-form-mid layui-word-aux">支付后,赠送(购买金额*静态倍数)的赠送积分--> +<!-- </div>--> +<!-- </div>--> +<!-- </div>--> - <div class="layui-form-item febs-hide tc-set"> - <label class="layui-form-label">静态占比(%)</label> - <div class="layui-input-block"> - <input type="text" name="staticProp" placeholder="请输入静态占比" - autoComplete="off" class="layui-input"> - <div class="layui-form-mid layui-word-aux">所有套餐静态占比相加应等于100%</div> - </div> - </div> +<!-- <div class="layui-form-item febs-hide tc-set">--> +<!-- <label class="layui-form-label">静态占比(%)</label>--> +<!-- <div class="layui-input-block">--> +<!-- <input type="text" name="staticProp" placeholder="请输入静态占比"--> +<!-- autoComplete="off" class="layui-input">--> +<!-- <div class="layui-form-mid layui-word-aux">所有套餐静态占比相加应等于100%</div>--> +<!-- </div>--> +<!-- </div>--> </div> <div class="layui-tab-item"> @@ -125,6 +154,7 @@ style="margin-top: 10px;"> <div class="layui-upload-list" id="demo2"></div> </blockquote> + <div class="layui-word-aux">双击图片删除</div> </div> </div> </div> @@ -149,6 +179,7 @@ style="margin-top: 10px;"> <div class="layui-upload-list" id="thumbsBanners"></div> </blockquote> + <div class="layui-word-aux">双击图片删除</div> </div> </div> </div> @@ -162,12 +193,32 @@ </div> <div class="layui-form-item"> + <label class="layui-form-label">商品参数:</label> + <div class="layui-input-block"> + <label> + <textarea name="goodsParameter" rows="5" autoComplete="off" + class="layui-textarea"></textarea> + </label> + </div> + </div> + +<!-- <div class="layui-form-item">--> +<!-- <label class="layui-form-label febs-form-item-require">商品详情:</label>--> +<!-- <div class="layui-input-block">--> +<!--<!– <textarea id="lay_edit" lay-verify="goodsDetails" name="goodsDetails" class="layui-textarea"></textarea>–>--> +<!-- <div style="border: 1px solid #ccc;">--> +<!-- <div id="toolbar-container" style="border-bottom: 1px solid #ccc;"></div>--> +<!-- <div id="editor-container" style="height: 300px;"></div>--> +<!-- </div>--> +<!-- </div>--> +<!-- </div>--> + <div class="layui-form-item"> <label class="layui-form-label febs-form-item-require">商品详情:</label> <div class="layui-input-block"> -<!-- <textarea id="lay_edit" lay-verify="goodsDetails" name="goodsDetails" class="layui-textarea"></textarea>--> + <!-- <textarea id="goodsDetailEditAdd" lay-verify="content" name = "goodsDetails" class="layui-textarea"></textarea>--> <div style="border: 1px solid #ccc;"> - <div id="toolbar-container" style="border-bottom: 1px solid #ccc;"></div> - <div id="editor-container" style="height: 300px;"></div> + <div id="toolbar-container" class="toolbar"></div> + <div id="text-container" class="text" style="height: 450px;"></div> </div> </div> </div> @@ -196,6 +247,21 @@ <div class="layui-input-block"> <input type="text" name="costPrice" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> + </div> + </div> + + <div class="layui-form-item"> + <label class="layui-form-label">设置运费:</label> + <div class="layui-input-block"> + <input type="radio" name="hasCarriage" value="1" title="开启" lay-filter="hasCarriage" /> + <input type="radio" name="hasCarriage" value="2" title="关闭" lay-filter="hasCarriage" checked /> + </div> + </div> + + <div class="layui-form-item carriage-input febs-hide"> + <label class="layui-form-label">运费:</label> + <div class="layui-input-block"> + <input type="text" name="carriage" placeholder="" autocomplete="off" class="layui-input"> </div> </div> @@ -262,6 +328,13 @@ .layui-table-cell { height: auto; } + + .layui-upload-list { + margin: 0 !important; + } + .multi-images { + margin: 0 5px !important; + } </style> <script type="text/html" id="toolbar"> <div class="layui-btn-container"> @@ -305,15 +378,48 @@ formSelects.render(); - var E = window.wangEditor; - const editorConfig = { MENU_CONF: {} }; - editorConfig.MENU_CONF['uploadImage'] = { - server: '/admin/goods/uploadFileBase64', - fieldName : "file", - customInsert(res, insertFn) { - insertFn(res.data.src, res.data.title, '') - }, - } + form.verify({ + integer: [ + /^[1-9]\d*$/ + , '只能输入正整数' + ] + }); + + // var E = window.wangEditor; + // const editorConfig = { MENU_CONF: {} }; + // editorConfig.MENU_CONF['uploadImage'] = { + // server: '/admin/goods/uploadFileBase64', + // fieldName : "file", + // customInsert(res, insertFn) { + // insertFn(res.data.src, res.data.title, '') + // }, + // } + const E = window.wangEditor; + const editor = new E('#toolbar-container', '#text-container'); // 传入两个元素 + editor.config.showLinkImg = false; + editor.config.uploadFileName = 'file'; + editor.config.customUploadImg = function (files, insertImgFn) { + // files 是 input 中选中的文件列表 + // insertImgFn 是获取图片 url 后,插入到编辑器的方法 + // 上传图片,返回结果,将图片插入到编辑器中 + for (let i = 0; i < files.length; i++){ + var form = new FormData(); + form.append("file", files[0]); + $.ajax({ + url:'/admin/goods/uploadFileBase64', + type: "post", + processData: false, + contentType: false, + data: form, + dataType: 'json', + success(res) { + // 上传代码返回结果之后,将图片插入到编辑器中 + insertImgFn(res.data.src, res.data.title, '') + } + }) + } + }; + editor.create(); var category = xmSelect.render({ el: '#goods-category', @@ -321,6 +427,9 @@ prop : { value : 'id', children : 'child' + }, + iconfont: { + parent: 'hidden', }, radio: true, clickClose: true, @@ -410,6 +519,14 @@ } }); + form.on('radio(hasCarriage)', function(data){ + if (data.value == 2) { + $('.carriage-input').hide(); + } else { + $('.carriage-input').show(); + } + }); + function addTableDate(data) { var hasData = table.cache['multiSku']; @@ -496,39 +613,90 @@ //多图片上传 upload.render({ elem: '#thumbsBanner' - , url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口 - , multiple: true - , before: function (obj) { + ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口 + ,multiple: true + ,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">') + obj.preview(function(index, file, result){ + $('#thumbsBanners').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img multi-images" style="width: 130px">') }); } - , done: function (res) { + ,done: function(res){ var thumbs = $("#thumbs").val(); - if (thumbs == '') { + if(thumbs == ''){ $("#thumbs").val(res.data.src); - } else { + }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) { + ,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" style="width: 100px">') + 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) { + ,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(); + }); + }) + } function initValue() { var images = goodsInfo.images; @@ -540,6 +708,8 @@ "unit": goodsInfo.unit, "stock": goodsInfo.stock, "volume": goodsInfo.volume, + "isHot": goodsInfo.isHot, + "goodsParameter": goodsInfo.goodsParameter, "goodsIntrodution": goodsInfo.goodsIntrodution, "isNormal": goodsInfo.isNormal, "staticMulti": goodsInfo.staticMulti, @@ -548,17 +718,26 @@ "presentPrice": goodsInfo.presentPrice, "costPrice": goodsInfo.costPrice, "isSku": goodsInfo.isSku, + "hasCarriage": goodsInfo.hasCarriage, + "carriage": goodsInfo.carriage, "thumb": goodsInfo.thumb, + "star": goodsInfo.star, + "sortCnt": goodsInfo.sortCnt, + "scorePercent": goodsInfo.scorePercent, + "goodsDetails": goodsInfo.goodsDetails, "thumbs": thumbs }); - console.log(goodsInfo.categoryId); var arr = []; arr.push(goodsInfo.categoryId) category.setValue(arr); if (goodsInfo.isNormal == 2) { $(".tc-set").show(); + } + + if (goodsInfo.hasCarriage == 1) { + $(".carriage-input").show(); } if (goodsInfo.isSku == 1) { @@ -571,25 +750,33 @@ } 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">') - window.editor = E.createEditor({ - html: goodsInfo.goodsDetails, - selector: '#editor-container', - config : editorConfig, - mode: 'default' - }); - window.toolbar = E.createToolbar({ - editor, - selector: '#toolbar-container', - mode: 'default' - }); - tableSkuData = skus; - reloadTable(skus); + imgSingleBind(); + imgMultiBind(); + + // window.editor = E.createEditor({ + // html: goodsInfo.goodsDetails, + // selector: '#editor-container', + // config : editorConfig, + // mode: 'default' + // }); + // + // window.toolbar = E.createToolbar({ + // editor, + // selector: '#toolbar-container', + // mode: 'default' + // }); + + if (skus) { + tableSkuData = skus; + reloadTable(skus); + } + editor.txt.html(goodsInfo.goodsDetails); } form.on('submit(goods-update-form-submit)', function (data) { @@ -597,7 +784,8 @@ data.field.mailGoodsSkuDto = tableSkuData; data.field.delSkuId=delSku; data.field.categoryId = category.getValue('valueStr'); - data.field.goodsDetails = editor.getHtml(); + // data.field.goodsDetails = editor.getHtml(); + data.field.goodsDetails = editor.txt.html(); $.ajax({ 'url': ctx + 'admin/goods/updateMallGoods', 'type': 'post', -- Gitblit v1.9.1