src/main/java/cc/mrbird/febs/mall/controller/ViewMallGoodsController.java
@@ -3,6 +3,7 @@ import cc.mrbird.febs.common.controller.BaseController; import cc.mrbird.febs.common.entity.FebsConstant; import cc.mrbird.febs.common.utils.FebsUtil; import cc.mrbird.febs.mall.entity.MallGoods; import cc.mrbird.febs.mall.service.IAdminMallGoodsService; import cc.mrbird.febs.mall.service.IAdminMallMemberService; import cc.mrbird.febs.mall.vo.AdminMailGoodsDetailVo; @@ -76,8 +77,8 @@ @GetMapping("goodsUpdateNew/{id}") @RequiresPermissions("goodsUpdateNew:update") public String goodsUpdate(@PathVariable long id, Model model) { AdminMailGoodsUpdateVo data = mallGoodsService.getMallGoodsUpdateInfoById(id); model.addAttribute("mailGoodsUpdate", data); MallGoods data = mallGoodsService.selectGoodsById(id); model.addAttribute("goodsInfo", data); return FebsUtil.view("modules/goods/goodsUpdateNew"); } } src/main/java/cc/mrbird/febs/mall/dto/MailGoodsSkuDto.java
@@ -25,6 +25,8 @@ private BigDecimal presentPrice; private BigDecimal costPrice; private Long styleId; private Long goodsId; src/main/java/cc/mrbird/febs/mall/dto/MallGoodsUpdateDto.java
@@ -4,6 +4,7 @@ import io.swagger.annotations.ApiModel; import lombok.Data; import java.math.BigDecimal; import java.util.List; @Data @@ -37,4 +38,46 @@ private Long categoryId; private Integer isHot; /** * 库存 */ private Integer stock; /** * 销量 */ private Integer volume; /** * 成本价 */ private BigDecimal costPrice; /** * 静态倍数 */ private BigDecimal staticMulti; /** * 静态占比 */ private BigDecimal staticProp; /** * 是否多规则 1-是 2-否 */ private Integer isSku; /** * 是否普通商品 1-普通商品 2-套餐 */ private Integer isNormal; private BigDecimal score; private Integer goodsType; private List<Long> delSkuId; } src/main/java/cc/mrbird/febs/mall/entity/MallGoods.java
@@ -96,8 +96,12 @@ private List<MallGoodsStyle> styles; @TableField(exist = false) private List<MallGoodsSku> skus; @TableField(exist = false) private List<String> images; @TableField(exist = false) private String orderNo; } src/main/java/cc/mrbird/febs/mall/mapper/MallGoodsSkuMapper.java
@@ -14,5 +14,9 @@ List<AdminMailGoodsSkuDetailVo> selectByGoodId(@Param("id")Long id); List<MallGoodsSku> selectSkuByGoodsId(@Param("id") Long id); MallGoodsSku selectSkuInfoById(@Param("id") Long id); int delSkuByIds(@Param("list") List<Long> ids); } src/main/java/cc/mrbird/febs/mall/mapper/MallGoodsStyleMapper.java
@@ -4,9 +4,13 @@ import com.baomidou.mybatisplus.core.mapper.BaseMapper; import org.apache.ibatis.annotations.Param; import java.util.List; public interface MallGoodsStyleMapper extends BaseMapper<MallGoodsStyle> { void deleteByGoodsId(@Param("id")Long id); MallGoodsStyle selectByStyleName(@Param("name")String styleName, @Param("goodsId")Long id); List<MallGoodsStyle> selectByGoodsId(@Param("goodsId") Long goodsId); } src/main/java/cc/mrbird/febs/mall/service/IAdminMallGoodsService.java
@@ -32,6 +32,8 @@ AdminMailGoodsUpdateVo getMallGoodsUpdateInfoById(long id); MallGoods selectGoodsById(long id); FebsResponse updateMallGoods(MallGoodsUpdateDto mallGoodsUpdateDto); List<AdminMallGoodsTreeVo> getAllGoodsTree(); src/main/java/cc/mrbird/febs/mall/service/impl/AdminMallGoodsService.java
@@ -8,6 +8,7 @@ import cc.mrbird.febs.mall.mapper.*; import cc.mrbird.febs.mall.service.IAdminMallGoodsService; import cc.mrbird.febs.mall.vo.*; import cn.hutool.core.bean.BeanUtil; import cn.hutool.core.collection.CollUtil; import cn.hutool.core.util.ObjectUtil; import cn.hutool.core.util.StrUtil; @@ -146,7 +147,6 @@ } } if (CollUtil.isNotEmpty(addMallGoodsSkuDtos)) { for (AddMallGoodsSkuDto addMallGoodsSkuDto : addMallGoodsSkuDtos) { MallGoodsStyle mallGoodsStyleSku = mallGoodsStyleMapper.selectByStyleName(addMallGoodsSkuDto.getStyleName(), mallGoods.getId()); @@ -233,6 +233,17 @@ } @Override public MallGoods selectGoodsById(long id) { MallGoods mallGoods = mallGoodsMapper.selectById(id); List<MallGoodsSku> skus = mallGoodsSkuMapper.selectSkuByGoodsId(mallGoods.getId()); List<String> thumbs = mallGoodsImagesMapper.selectByGoodId(mallGoods.getId()); mallGoods.setImages(thumbs); mallGoods.setSkus(skus); return mallGoods; } @Override @Transactional public FebsResponse updateMallGoods(MallGoodsUpdateDto mallGoodsUpdateDto) { String goodsName = mallGoodsUpdateDto.getGoodsName(); @@ -288,21 +299,10 @@ } //新增商品 MallGoods mallGoods = mallGoodsMapper.selectById(mallGoodsUpdateDto.getId()); mallGoods.setGoodsNo(mallGoodsUpdateDto.getGoodsNo()); mallGoods.setGoodsName(mallGoodsUpdateDto.getGoodsName()); mallGoods.setGoodsIntrodution(mallGoodsUpdateDto.getGoodsIntrodution()); mallGoods.setUnit(mallGoodsUpdateDto.getUnit()); mallGoods.setThumb(mallGoodsUpdateDto.getThumb()); mallGoods.setGoodsDetails(mallGoodsUpdateDto.getGoodsDetails()); mallGoods.setOriginalPrice(mallGoodsUpdateDto.getOriginalPrice()); mallGoods.setCategoryId(mallGoodsUpdateDto.getCategoryId()); mallGoods.setPresentPrice(mallGoodsUpdateDto.getPresentPrice()); mallGoods.setIsHot(mallGoodsUpdateDto.getIsHot()); // mallGoods.setIsSale(MallGoods.ISSALE_STATUS_DISABLED); BeanUtil.copyProperties(mallGoodsUpdateDto, mallGoods); mallGoodsMapper.updateById(mallGoods); mallGoodsImagesMapper.deleteByGoodsId(mallGoodsUpdateDto.getId()); String thumbs = mallGoodsUpdateDto.getThumbs(); if (StrUtil.isNotEmpty(thumbs)) { List<String> imgs = StrUtil.splitTrim(thumbs, ","); @@ -319,15 +319,29 @@ } } // 删除已存在sku List<Long> delSkuIds = mallGoodsUpdateDto.getDelSkuId(); if (CollUtil.isNotEmpty(delSkuIds)) { mallGoodsSkuMapper.delSkuByIds(delSkuIds); // 如果该样式下sku全删除,则删除该样式 List<MallGoodsStyle> styles = mallGoodsStyleMapper.selectByGoodsId(mallGoods.getId()); for (MallGoodsStyle style : styles) { if (CollUtil.isEmpty(style.getSkus())) { mallGoodsStyleMapper.deleteById(style.getId()); } } } List<MailGoodsSkuDto> mailGoodsSkuDto = mallGoodsUpdateDto.getMailGoodsSkuDto(); Set<String> styles = new HashSet<>(); if (CollUtil.isNotEmpty(mailGoodsSkuDto)) { for (MailGoodsSkuDto addStyleDto : mailGoodsSkuDto) { if (ObjectUtil.isNotEmpty(addStyleDto.getDelLog())) { mallGoodsSkuMapper.deleteById(addStyleDto.getId()); // if (ObjectUtil.isNotEmpty(addStyleDto.getDelLog())) { // mallGoodsSkuMapper.deleteById(addStyleDto.getId()); // mallShoppingCartMapper.deleteByGoodsIdAndSkuId(addStyleDto.getId(), addStyleDto.getGoodsId()); // } mallShoppingCartMapper.deleteByGoodsIdAndSkuId(addStyleDto.getId(), addStyleDto.getGoodsId()); } if (ObjectUtil.isEmpty(addStyleDto.getStyleId())) { MallGoodsStyle mallGoodsStyleSku = mallGoodsStyleMapper.selectByStyleName(addStyleDto.getStyleName(), mallGoods.getId()); if (ObjectUtil.isEmpty(mallGoodsStyleSku)) { @@ -359,6 +373,7 @@ mallGoodsSku.setPresentPrice(addMallGoodsSkuDto.getPresentPrice()); mallGoodsSku.setStyleId(addMallGoodsSkuDto.getStyleId()); mallGoodsSku.setGoodsId(mallGoods.getId()); mallGoodsSku.setCostPrice(addMallGoodsSkuDto.getCostPrice()); mallGoodsSkuMapper.updateById(mallGoodsSku); } else { //新增商品规格 @@ -371,6 +386,7 @@ mallGoodsSku.setOriginalPrice(addMallGoodsSkuDto.getOriginalPrice()); mallGoodsSku.setPresentPrice(addMallGoodsSkuDto.getPresentPrice()); mallGoodsSku.setStyleId(mallGoodsStyleSku.getId()); mallGoodsSku.setCostPrice(addMallGoodsSkuDto.getCostPrice()); mallGoodsSku.setGoodsId(mallGoods.getId()); mallGoodsSkuMapper.insert(mallGoodsSku); } src/main/resources/mapper/modules/MallGoodsSkuMapper.xml
@@ -25,5 +25,17 @@ where a.goods_id = #{id} </select> <select id="selectSkuByGoodsId" resultType="cc.mrbird.febs.mall.entity.MallGoodsSku"> select a.*, b.name styleName from mall_goods_sku a inner join mall_goods_style b on a.style_id=b.id where a.goods_id=#{id} </select> <delete id="delSkuByIds"> delete from mall_goods_sku where id in <foreach collection="list" separator="," close=")" open="(" item="item"> #{item} </foreach> </delete> </mapper> src/main/resources/mapper/modules/MallGoodsStyleMapper.xml
@@ -2,6 +2,16 @@ <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="cc.mrbird.febs.mall.mapper.MallGoodsStyleMapper"> <resultMap id="styleMap" type="cc.mrbird.febs.mall.entity.MallGoodsStyle"> <id column="id" property="id" /> <result column="goods_id" property="goodsId" /> <result property="name" column="name" /> <collection property="skus" ofType="cc.mrbird.febs.mall.entity.MallGoodsSku"> <id property="id" column="sku_id" /> <result property="styleId" column="style_id" /> </collection> </resultMap> <delete id="deleteByGoodsId"> delete from mall_goods_style where goods_id = #{id} </delete> @@ -12,4 +22,9 @@ select * from mall_goods_style where goods_id = #{goodsId} and name = #{name} </select> <select id="selectByGoodsId" resultType="cc.mrbird.febs.mall.entity.MallGoodsStyle"> select a.*, b.id skuId, b.style_id from mall_goods_style a left join mall_goods_sku b on a.id=b.style_id where a.goods_id=#{goodsId} </select> </mapper> src/main/resources/templates/febs/views/modules/goods/goodsAddNew.html
@@ -246,7 +246,6 @@ form = layui.form, laydate = layui.laydate, eleTree = layui.eleTree, member = [[${member}]], $view = $('#goods-add'), layedit = layui.layedit, upload = layui.upload, src/main/resources/templates/febs/views/modules/goods/goodsList.html
@@ -101,8 +101,9 @@ if (layEvent === 'goodsUpdate') { febs.modal.open('编辑', 'modules/goods/goodsUpdateNew/' + data.id, { btn: ['提交', '取消'], area:['100%','100%'], yes: function (index, layero) { $('#goods-updatenew').find('#submit').trigger('click'); $('#febs-update').find('#submit').trigger('click'); }, btn2: function () { layer.closeAll(); src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew-bak.html
New file @@ -0,0 +1,521 @@ <style> #goods-updatenew { padding: 20px 25px 25px 0; } #goods-updatenew .layui-treeSelect .ztree li a, .ztree li span { margin: 0 0 2px 3px !important; } #goods-updatenew #data-permission-tree-block { border: 1px solid #eee; border-radius: 2px; padding: 3px 0; } #user-add .layui-treeSelect .ztree li span.button.switch { top: 1px; left: 3px; } </style> <div class="layui-fluid" id="goods-updatenew"> <form class="layui-form" action="" lay-filter="goods-updatenew-form"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id"> </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="text" name="goodsName" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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="goodsNo" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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"> <select name="categoryId" class="categary-goods-updatenew-category" id="goodsUpdateSelect" > <option value="">请选择</option> </select> </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="unit" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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="text" name="originalPrice" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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="presentPrice" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </div> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">商品介绍:</label> <div class="layui-input-block"> <input type="text" name="goodsIntrodution" autocomplete="off" class="layui-input" > </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="text" name="addMallGoodsSkuDtos" autocomplete="off" class="layui-input" id="attrName"> </div> </div> <div class="layui-col-lg6"> <button type="button" class="layui-btn layui-btn-normal layui-btn-xs" id="test3" >添加</button> </div> </div> <div id="attrWrap"></div> <div class="layui-form-item"> <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 layui-btn-normal layui-btn-xs" 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> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label">缩略图链接:</label> <div class="layui-input-block"> <input type="text" id="thumb" lay-verify="required" name="thumb" autocomplete="off" class="layui-input" readonly> </div> </div> <div class="layui-form-item"> <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 layui-btn-normal layui-btn-xs" id="thumbsBanner">上传</button> <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;"> <div class="layui-upload-list" id="thumbsBanners"></div> </blockquote> </div> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label">缩略图链接:</label> <div class="layui-input-block"> <input type="text" id="thumbs" lay-verify="required" name="thumbs" autocomplete="off" class="layui-input" readonly> </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">[[${mailGoodsUpdate.goodsDetails}]]</textarea> </div> </div> <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"> <input type="radio" name="isHot" value="1" title="是" > <input type="radio" name="isHot" value="2" title="否" checked=""> </div> </div> </div> <div class="layui-form-item febs-hide"> <button class="layui-btn" lay-submit="" lay-filter="goods-update-form-submit" id="submit"></button> </div> <!-- <div class="layui-form-item">--> <!-- <div class="layui-form-item" style="text-align:center">--> <!-- <button class="layui-btn" lay-submit="" lay-filter="goods-update-form-submit" id="submit">保存</button>--> <!-- </div>--> <!-- </div>--> </form> </div> <script data-th-inline="javascript"> layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','dropdown', 'laydate','layedit','upload'], function () { var $ = layui.jquery, febs = layui.febs, layer = layui.layer, formSelects = layui.formSelects, treeSelect = layui.treeSelect, form = layui.form, laydate = layui.laydate, eleTree = layui.eleTree, mailGoodsUpdate = [[${mailGoodsUpdate}]], $view = $('#goods-add'), layedit = layui.layedit, upload = layui.upload, validate = layui.validate; form.render(); //(下拉框) $.get(ctx + 'admin/goodsCategory/categorys/allTree', function (data) { for (var k in data) { $(".categary-goods-updatenew-category").append("<option value='" + data[k].parentId + "'>" + data[k].name + "</option>"); } layui.use('form', function () { var form = layui.form; $("#goodsUpdateSelect").val(mailGoodsUpdate.categoryId) form.render(); }); }); //多图片上传 upload.render({ elem: '#thumbsBanner' ,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">') }); } ,done: function(res){ var thumbs = $("#thumbs").val(); if(thumbs == ''){ $("#thumbs").val(res.data.src); }else{ $("#thumbs").val(thumbs + ',' + res.data.src); } // alert($("#thumb").val()); } }); //图片上传 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" style="width: 100px">') }); } ,done: function(res){ // var thumbs = $("#thumb").val(); // if(thumbs == ''){ $("#thumb").val(res.data.src); // }else{ // $("#thumb").val(thumbs + ',' + res.data.src); // } // alert($("#thumb").val()); } }); layedit.set({ //设置图片接口 uploadImage: { url: 'admin/goods/uploadFileBase64', //接口url type: 'post', } }); //创建一个编辑器 var index = layedit.build('lay_edit',{ height: 300 }); //提交时把值同步到文本域中 form.verify({ //content富文本域中的lay-verify值 goodsDetails: function(value) { return layedit.sync(index); } }); initUserValue(); function appendSku(sku,skuIndex){ var index = skuIndex; let attrNameVal = sku.skuName; let styleName = sku.styleName; let styleId = sku.styleId; let skuId = sku.id; let stockVal = sku.stock; let skuVolume = sku.skuVolume; let originalPrice = sku.originalPrice; let presentPrice = sku.presentPrice; let skuImage = sku.skuImage; $('#attrWrap').append(` <div class="layui-form-item item"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id` + index + `" value="` + skuId + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="delLog` + index + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">styleId:</label> <div class="layui-input-block"> <input type="text" id="styleId` + index +`" name="styleId` + index + `" value="` + styleId + `"> </div> </div> <div style="float:left" > <input type="text" name="styleName` + index + `" value="` + styleName + `" autocomplete="off" class="layui-input" readonly > </div> <div style="float:left" > <div> <input type="text" name="skuName` + index +`" value="` + attrNameVal + `" placeholder="规格名称" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <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-xs sku-img" id="skuImg` + index + `">上传</button> <img class="layui-upload-img" src="` + skuImage + `" id="imageUrls` + index + `" style="width: 100px" > </div> </div> </div> <div style="float:left" class="febs-hide"> <div> <input type="text" id="skuImage` + index +`" value="` + skuImage + `" name="skuImage` + index + `" autocomplete="off" class="layui-input"> </div> </div> <div style="float:left" > <div> <input type="number" name="stock` + index +`" value="` + stockVal + `" placeholder="库存" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="skuVolume` + index +`" value="` + skuVolume + `" placeholder="销售数量" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="originalPrice` + index +`" value="` + originalPrice + `" placeholder="原价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="presentPrice` + index + `" value="` + presentPrice + `" placeholder="现价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <button type="button" class="layui-btn del-attr-btn" data-index="` + index +`">删除</button> </div> </div> `) //普通图片上传 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); } }); } function initUserValue() { var skuIndex = 0; let skuLength = mailGoodsUpdate.mailGoodsSkuDetailVo.length; for(var skuIndex = 0; skuIndex < skuLength; skuIndex++){ appendSku(mailGoodsUpdate.mailGoodsSkuDetailVo[skuIndex],skuIndex); } //缩略图图片回显 if(mailGoodsUpdate.thumb != null || mailGoodsUpdate.thumb != ''){ $('#demo2').append('<img src="'+ mailGoodsUpdate.thumb +'" class="layui-upload-img" style="width: 100px">') $("#thumb").val(mailGoodsUpdate.thumb); } var imagesInitIndex = 0; let imagesInitIndexlength = mailGoodsUpdate.mailGoodsImagesVo.length; for(var imagesInitIndex = 0; imagesInitIndex < imagesInitIndexlength; imagesInitIndex++){ console.log(mailGoodsUpdate.mailGoodsImagesVo); $('#thumbsBanners').append('<img src="'+ mailGoodsUpdate.mailGoodsImagesVo[imagesInitIndex] +'" class="layui-upload-img" style="width: 100px">') $("#thumbs").val(mailGoodsUpdate.mailGoodsImagesVo[imagesInitIndex] + ','); } form.val("goods-updatenew-form", { "id": mailGoodsUpdate.id, "goodsNo": mailGoodsUpdate.goodsNo, "categoryId": mailGoodsUpdate.categoryId, "mailGoodsSkuDetailVo": mailGoodsUpdate.mailGoodsSkuDetailVo, "mailGoodsImagesVo": mailGoodsUpdate.mailGoodsImagesVo, "unit": mailGoodsUpdate.unit, "originalPrice": mailGoodsUpdate.originalPrice, "presentPrice": mailGoodsUpdate.presentPrice, "goodsIntrodution": mailGoodsUpdate.goodsIntrodution, "thumb": mailGoodsUpdate.thumb, "goodsDetails": mailGoodsUpdate.goodsDetails, "isHot": mailGoodsUpdate.isHot, "isHot": mailGoodsUpdate.isHot, "goodsName": mailGoodsUpdate.goodsName }); } $('#test3').on('click', function (){ var index = $("#attrWrap").children().length; let attrNameVal = $('#attrName').val(); if(attrNameVal==null || attrNameVal==""){ febs.alert.warn('样式名称不能为空'); return false; } $('#attrWrap').append(` <div class="layui-form-item item"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id` + index + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">styleId:</label> <div class="layui-input-block"> <input type="text" id="styleId` + index +`" name="styleId` + index + `"> </div> </div> <div style="float:left" > <input type="text" name="styleName` + index + `" value="` + $('#attrName').val() + `" autocomplete="off" class="layui-input" readonly > </div> <div style="float:left" > <div> <input type="text" name="skuName` + index +`" placeholder="规格名称" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <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-xs sku-img" id="skuImg` + index + `">上传</button> <img class="layui-upload-img" id="imageUrls` + index + `" style="width: 100px" > </div> </div> </div> <div style="float:left" class="febs-hide"> <div> <input type="text" id="skuImage` + index +`" name="skuImage` + index + `" autocomplete="off" class="layui-input"> </div> </div> <div style="float:left" > <div> <input type="number" name="stock` + index +`" placeholder="库存" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="skuVolume` + index +`" placeholder="销售数量" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="originalPrice` + index +`" placeholder="原价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="presentPrice` + index + `" placeholder="现价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <button type="button" class="layui-btn del-attr-btn" data-index="` + index +`">删除</button> </div> </div> `) //普通图片上传 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); } }); }); 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); } }); $("#attrWrap").on("click",".del-attr-btn",function(){ var index = $(this).attr('data-index') if($("input[name='styleId" + index + "']").val() ==null || $("input[name='styleId" + index + "']").val() ==''){ $($("#attrWrap").find(".item")[index].remove()); }else{ $("input[name='delLog" + index + "']").val("delLog"); $($("#attrWrap").find(".item")[index].style.display = "none"); } }); form.on('submit(goods-update-form-submit)', function (data) { let skuArrs = []; var skuArr = $("#attrWrap").find(".item"); for(var i = 0;i < skuArr.length;i++){ skuArrs.push({ id: $("input[name='id" + i + "']").val(), styleName: $("input[name='styleName" + i + "']").val(), styleId: $("input[name='styleId" + i + "']").val(), delLog: $("input[name='delLog" + i + "']").val(), skuName: $("input[name='skuName" + i + "']").val(), skuImage: $("input[name='skuImage" + i + "']").val(), stock: $("input[name='stock" + i + "']").val(), skuVolume: $("input[name='skuVolume" + i + "']").val(), originalPrice:$("input[name='originalPrice" + i + "']").val(), presentPrice: $("input[name='presentPrice" + i + "']").val() }) } // if(skuArr.length < 0){ // febs.alert.warn("请填写商品规格"); // return false; // } // console.log(skuArrs) data.field.mailGoodsSkuDto = skuArrs; console.log(data.field) $.ajax({ 'url':ctx + 'admin/goods/updateMallGoods', 'type':'post', 'dataType':'json', 'headers' : {'Content-Type' : 'application/json;charset=utf-8'}, //接口json格式 'traditional': true,//ajax传递数组必须添加属性 'data':JSON.stringify(data.field), 'success':function (data) { if(data.code==0){ layer.closeAll(); febs.alert.success('操作成功'); // var index = parent.layer.getFrameIndex(window.name); // parent.layer.close(index); // febs.alert.success('操作成功'); $('#febs-goods').find('#reset').click(); }else{ febs.alert.warn(data.message); } }, 'error':function () { febs.alert.warn('服务器繁忙'); } }) return false; }); }); </script> src/main/resources/templates/febs/views/modules/goods/goodsUpdateNew.html
@@ -1,108 +1,138 @@ <style> #goods-updatenew { padding: 20px 25px 25px 0; } #goods-updatenew .layui-treeSelect .ztree li a, .ztree li span { margin: 0 0 2px 3px !important; } #goods-updatenew #data-permission-tree-block { border: 1px solid #eee; border-radius: 2px; padding: 3px 0; } #user-add .layui-treeSelect .ztree li span.button.switch { top: 1px; left: 3px; } </style> <div class="layui-fluid" id="goods-updatenew"> <form class="layui-form" action="" lay-filter="goods-updatenew-form"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id"> </div> </div> <div class="layui-fluid layui-anim febs-anim" id="febs-update" lay-title="编辑商品"> <div class="layui-row febs-container"> <div class="layui-col-md12"> <div class="layui-card"> <div class="layui-card-body febs-table-full"> <div class="layui-fluid" id="goods-update"> <form class="layui-form" action="" lay-filter="goods-update-form"> <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief"> <ul class="layui-tab-title"> <li class="layui-this">基础信息</li> <li>详情设置</li> <li>价格设置</li> </ul> <input type="text" name="id" placeholder="" autoComplete="off" class="layui-input febs-hide"> <div class="layui-tab-content"> <div class="layui-tab-item layui-show"> <blockquote class="layui-elem-quote blue-border">基本信息设置</blockquote> <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="text" name="goodsName" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> <input type="text" name="goodsName" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </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="goodsNo" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> <input type="text" name="goodsNo" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </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> <label class="layui-form-label febs-form-item-require">商品分类:</label> <div class="layui-input-block"> <select name="categoryId" class="categary-goods-updatenew-category" id="goodsUpdateSelect" > <select name="categoryId" class="categary-addPeoduct"> <option value="">请选择</option> </select> </div> </div> </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="unit" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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="text" name="originalPrice" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> </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="presentPrice" lay-verify="required" placeholder="" autocomplete="off" class="layui-input"> <input type="text" name="unit" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </div> </div> </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="stock" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </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="volume" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </div> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">商品介绍:</label> <div class="layui-input-block"> <input type="text" name="goodsIntrodution" autocomplete="off" class="layui-input" > <label> <textarea name="goodsIntrodution" rows="5" autoComplete="off" class="layui-textarea"></textarea> </label> </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="text" name="addMallGoodsSkuDtos" autocomplete="off" class="layui-input" id="attrName"> </div> </div> <div class="layui-col-lg6"> <button type="button" class="layui-btn layui-btn-normal layui-btn-xs" id="test3" >添加</button> </div> </div> <div id="attrWrap"></div> <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"> <select name="isNormal" class="goods-type" lay-filter="goods-type-select"> <option value="1">普通商品区</option> <option value="2">套餐区</option> </select> </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> <div class="layui-tab-item"> <div class="layui-form-item"> <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 layui-btn-normal layui-btn-xs" id="test2">上传</button> <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;"> <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> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label">缩略图链接:</label> <div class="layui-input-block"> <input type="text" id="thumb" lay-verify="required" 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> @@ -110,72 +140,315 @@ <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 layui-btn-normal layui-btn-xs" id="thumbsBanner">上传</button> <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;"> <button type="button" class="layui-btn layui-btn-normal layui-btn" id="thumbsBanner">上传 </button> <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;"> <div class="layui-upload-list" id="thumbsBanners"></div> </blockquote> </div> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label">缩略图链接:</label> <div class="layui-input-block"> <input type="text" id="thumbs" lay-verify="required" name="thumbs" autocomplete="off" class="layui-input" readonly> <input type="text" id="thumbs" lay-verify="required" name="thumbs" autoComplete="off" class="layui-input" readOnly> </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">[[${mailGoodsUpdate.goodsDetails}]]</textarea> <textarea id="lay_edit" lay-verify="goodsDetails" name="goodsDetails" class="layui-textarea"></textarea> </div> </div> </div> <div class="layui-tab-item"> <blockquote class="layui-elem-quote blue-border">价格设置</blockquote> <div class="layui-row layui-col-space10 layui-form-item"> <div class="layui-col-lg6"> <label class="layui-form-label">是否热卖:</label> <label class="layui-form-label febs-form-item-require">原价:</label> <div class="layui-input-block"> <input type="radio" name="isHot" value="1" title="是" > <input type="radio" name="isHot" value="2" title="否" checked=""> <input type="text" name="originalPrice" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </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="presentPrice" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </div> </div> </div> <div class="layui-form-item febs-hide"> <button class="layui-btn" lay-submit="" lay-filter="goods-update-form-submit" id="submit"></button> <div class="layui-form-item"> <label class="layui-form-label febs-form-item-require">成本价:</label> <div class="layui-input-block"> <input type="text" name="costPrice" lay-verify="required" placeholder="" autoComplete="off" class="layui-input"> </div> <!-- <div class="layui-form-item">--> <!-- <div class="layui-form-item" style="text-align:center">--> <!-- <button class="layui-btn" lay-submit="" lay-filter="goods-update-form-submit" id="submit">保存</button>--> <!-- </div>--> <!-- </div>--> </div> <blockquote class="layui-elem-quote blue-border">多规格设置</blockquote> <div class="layui-col-lg6"> <label class="layui-form-label">开启多规格:</label> <div class="layui-input-block"> <input type="radio" name="isSku" value="1" title="是" lay-filter="isSku"/> <input type="radio" name="isSku" value="2" title="否" lay-filter="isSku" checked/> </div> </div> <div class="layui-form-item multi-sku-table febs-hide"> <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="text" name="addMallGoodsSkuDtos" autoComplete="off" class="layui-input" id="attrName"> </div> </div> <div class="layui-col-lg6"> <button type="button" class="layui-btn layui-btn-normal layui-btn" id="test3"> 添加 </button> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <table id="multiSku" lay-filter="multiSku"></table> </div> </div> </div> </div> </div> </div> <div class="layui-form-item febs-hide" style="text-align:center"> <button class="layui-btn" lay-submit="" lay-filter="goods-update-form-submit" id="submit"> </button> <!-- <button class="layui-btn layui-btn-danger" lay-submit=""--> <!-- lay-filter="goods-update-form-cancel" id="cancel">取消--> <!-- </button>--> </div> </form> </div> </div> </div> </div> </div> </div> <style> .blue-border { border-left-color: #2db7f5; font-size: 18px; } .layui-table-cell { height: auto; } </style> <script type="text/html" id="toolbar"> <div class="layui-btn-container"> <button class="layui-btn layui-btn-danger layui-btn-sm" type="button" lay-event="delSku">删除</button> </div> </script> <script type="text/html" id="tableImgUpload"> <div class="layui-upload"> <button type="button" class="layui-btn layui-btn-normal layui-btn-xs sku-img" id="skuImg{{d.index}}">上传 </button> </br> <img class="layui-upload-img" id="imageUrls{{d.index}}" style="width: 100px; display:none;" src="{{d.skuImage}}"> <input type="text" id="skuImage{{d.index}}" name="skuImage{{d.index}}" autoComplete="off" value="{{d.skuImage}}" class="layui-input febs-hide"> </div> </script> <!-- 表格操作栏 end --> <script data-th-inline="javascript"> layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','dropdown', 'laydate','layedit','upload'], function () { layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree', 'dropdown', 'laydate', 'layedit', 'upload', 'element', 'table'], function () { var $ = layui.jquery, febs = layui.febs, layer = layui.layer, table = layui.table, formSelects = layui.formSelects, treeSelect = layui.treeSelect, form = layui.form, laydate = layui.laydate, eleTree = layui.eleTree, mailGoodsUpdate = [[${mailGoodsUpdate}]], $view = $('#goods-add'), goodsInfo = [[${goodsInfo}]], $view = $('#goods-update'), layedit = layui.layedit, upload = layui.upload, validate = layui.validate; validate = layui.validate, element = layui.element; form.render(); laydate.render({ elem: '#febs-form-group-date' }); formSelects.render(); var tableSkuData = []; var tableIns = table.render({ elem: '#multiSku' , limit: 999 , toolbar: "#toolbar" , defaultToolbar: [] , cols: [[ //表头 {type: 'checkbox'} , {field: 'index', title: '序号', width: 70} , {field: 'styleName', title: '样式', edit: 'text'} , {field: 'skuName', title: '规格', edit: 'text'} , {field: 'presentPrice', title: '现价', edit: 'text'} , {field: 'originalPrice', title: '原价', edit: 'text'} , {field: 'costPrice', title: '成本价', edit: 'text'} , {templet: '#tableImgUpload', title: '缩略图', width: 150} , {field: 'stock', title: '库存', edit: 'text'} , {field: 'skuVolume', title: '销量', edit: 'text'} , {field: 'skuImage', title: '缩略图地址', hide: true} , {field: 'id', title: 'skuId', hide: true} , {field: 'styleId', title: 'styleId', hide: true} ]] , data: [] }); var delSku = []; table.on('toolbar(multiSku)', function (obj) { var data = obj.data; var hasData = table.cache['multiSku']; var checkData = table.checkStatus('multiSku').data; if (checkData.length <= 0) { febs.alert.warn('请选择删除数据'); return; } if (obj.event === 'delSku') { for (let i = 0; i < checkData.length; i++) { var delData = checkData[i]; console.log(delData) for (let j = 0; j < hasData.length; j++) { if (hasData[j].index == delData.index) { if (delData.id) { delSku.push(delData.id); } hasData.splice(j, 1); break; } } } console.log(delSku); for (let i = 0; i < hasData.length; i++) { hasData[i].index = i + 1; } tableSkuData = hasData; reloadTable(hasData); } }); form.on('radio(isSku)', function (data) { if (data.value == 2) { $('.multi-sku-table').hide(); } else { $('.multi-sku-table').show(); } }); function addTableDate(data) { var hasData = table.cache['multiSku']; data.index = hasData.length + 1; tableSkuData.push(data); reloadTable(tableSkuData); return data.index; } function reloadTable(data) { table.reload('multiSku', { data: data }); for (let i = 0; i < data.length; i++) { if (data[i].skuImage) { $('#imageUrls' + (i + 1)).css('display', 'block'); } // 重新绑定图片上传 bindUpload(i + 1); } } table.on('edit(multiSku)', function (obj) { var value = obj.value //得到修改后的值 , data = obj.data //得到所在行所有键值 , field = obj.field; //得到字段 for (let i = 0; i < tableSkuData.length; i++) { if (tableSkuData[i].index == data.index) { tableSkuData[i] = data; } } }); $('#test3').on('click', function () { let attrNameVal = $('#attrName').val(); if (attrNameVal == null || attrNameVal == "") { febs.alert.warn('样式名称不能为空'); return false; } var data = {}; data.styleName = attrNameVal; addTableDate(data); }); function bindUpload(index) { // 普通图片上传 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); $('#imageUrls' + index).css('display', 'block'); $('#skuImage' + index).val(res.data.src); for (let i = 0; i < tableSkuData.length; i++) { if (tableSkuData[i].index == index) { tableSkuData[i].skuImage = res.data.src; } } reloadTable(tableSkuData); } }); } //(下拉框) $.get(ctx + 'admin/goodsCategory/categorys/allTree', function (data) { for (var k in data) { $(".categary-goods-updatenew-category").append("<option value='" + data[k].parentId + "'>" + data[k].name + "</option>"); for (var k in data) { $(".categary-addPeoduct").append("<option value='" + data[k].parentId + "'>" + data[k].name + "</option>"); } layui.use('form', function () { var form = layui.form; $("#goodsUpdateSelect").val(mailGoodsUpdate.categoryId) // $("#categarySelect").val(member.parentId) form.render(); }); }); @@ -198,7 +471,6 @@ }else{ $("#thumbs").val(thumbs + ',' + res.data.src); } // alert($("#thumb").val()); } }); @@ -214,16 +486,11 @@ }); } ,done: function(res){ // var thumbs = $("#thumb").val(); // if(thumbs == ''){ $("#thumb").val(res.data.src); // }else{ // $("#thumb").val(thumbs + ',' + res.data.src); // } // alert($("#thumb").val()); } }); initValue(); layedit.set({ //设置图片接口 uploadImage: { url: 'admin/goods/uploadFileBase64', //接口url @@ -242,87 +509,51 @@ } }); initUserValue(); function initValue() { var images = goodsInfo.images; var thumbs = images.join(","); form.val("goods-update-form", { "id": goodsInfo.id, "goodsName": goodsInfo.goodsName, "goodsNo": goodsInfo.goodsNo, "unit": goodsInfo.unit, "stock": goodsInfo.stock, "volume": goodsInfo.volume, "goodsIntrodution": goodsInfo.goodsIntrodution, "isNormal": goodsInfo.isNormal, "staticMulti": goodsInfo.staticMulti, "staticProp": goodsInfo.staticProp, "originalPrice": goodsInfo.originalPrice, "presentPrice": goodsInfo.presentPrice, "costPrice": goodsInfo.costPrice, "isSku": goodsInfo.isSku, "thumb": goodsInfo.thumb, "thumbs": thumbs }); function appendSku(sku,skuIndex){ var index = skuIndex; let attrNameVal = sku.skuName; let styleName = sku.styleName; let styleId = sku.styleId; let skuId = sku.id; let stockVal = sku.stock; let skuVolume = sku.skuVolume; let originalPrice = sku.originalPrice; let presentPrice = sku.presentPrice; let skuImage = sku.skuImage; $('#attrWrap').append(` <div class="layui-form-item item"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id` + index + `" value="` + skuId + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="delLog` + index + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">styleId:</label> <div class="layui-input-block"> <input type="text" id="styleId` + index +`" name="styleId` + index + `" value="` + styleId + `"> </div> </div> <div style="float:left" > <input type="text" name="styleName` + index + `" value="` + styleName + `" autocomplete="off" class="layui-input" readonly > </div> <div style="float:left" > <div> <input type="text" name="skuName` + index +`" value="` + attrNameVal + `" placeholder="规格名称" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <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-xs sku-img" id="skuImg` + index + `">上传</button> <img class="layui-upload-img" src="` + skuImage + `" id="imageUrls` + index + `" style="width: 100px" > </div> </div> </div> <div style="float:left" class="febs-hide"> <div> <input type="text" id="skuImage` + index +`" value="` + skuImage + `" name="skuImage` + index + `" autocomplete="off" class="layui-input"> </div> </div> <div style="float:left" > <div> <input type="number" name="stock` + index +`" value="` + stockVal + `" placeholder="库存" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="skuVolume` + index +`" value="` + skuVolume + `" placeholder="销售数量" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="originalPrice` + index +`" value="` + originalPrice + `" placeholder="原价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="presentPrice` + index + `" value="` + presentPrice + `" placeholder="现价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <button type="button" class="layui-btn del-attr-btn" data-index="` + index +`">删除</button> </div> </div> `) //普通图片上传 if (goodsInfo.isNormal == 2) { $(".tc-set").show(); } if (goodsInfo.isSku == 1) { $(".multi-sku-table").show(); } var skus = goodsInfo.skus; for (let i = 0; i < skus.length; i++) { skus[i].index = i+1; } for (let i = 0; i < images.length; i++) { $('#thumbsBanners').append('<img src="' + images[i] + '" alt="" class="layui-upload-img" style="width: 100px">') } $('#demo2').append('<img src="' + goodsInfo.thumb + '" alt="" class="layui-upload-img" style="width: 100px">') layedit.setContent(index, "1234", false); tableSkuData = skus; reloadTable(skus); } upload.render({ elem: '#skuImg' + index ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口 @@ -332,166 +563,11 @@ $('#skuImage'+ index).val(res.data.src); } }); } function initUserValue() { var skuIndex = 0; let skuLength = mailGoodsUpdate.mailGoodsSkuDetailVo.length; for(var skuIndex = 0; skuIndex < skuLength; skuIndex++){ appendSku(mailGoodsUpdate.mailGoodsSkuDetailVo[skuIndex],skuIndex); } //缩略图图片回显 if(mailGoodsUpdate.thumb != null || mailGoodsUpdate.thumb != ''){ $('#demo2').append('<img src="'+ mailGoodsUpdate.thumb +'" class="layui-upload-img" style="width: 100px">') $("#thumb").val(mailGoodsUpdate.thumb); } var imagesInitIndex = 0; let imagesInitIndexlength = mailGoodsUpdate.mailGoodsImagesVo.length; for(var imagesInitIndex = 0; imagesInitIndex < imagesInitIndexlength; imagesInitIndex++){ console.log(mailGoodsUpdate.mailGoodsImagesVo); $('#thumbsBanners').append('<img src="'+ mailGoodsUpdate.mailGoodsImagesVo[imagesInitIndex] +'" class="layui-upload-img" style="width: 100px">') $("#thumbs").val(mailGoodsUpdate.mailGoodsImagesVo[imagesInitIndex] + ','); } form.val("goods-updatenew-form", { "id": mailGoodsUpdate.id, "goodsNo": mailGoodsUpdate.goodsNo, "categoryId": mailGoodsUpdate.categoryId, "mailGoodsSkuDetailVo": mailGoodsUpdate.mailGoodsSkuDetailVo, "mailGoodsImagesVo": mailGoodsUpdate.mailGoodsImagesVo, "unit": mailGoodsUpdate.unit, "originalPrice": mailGoodsUpdate.originalPrice, "presentPrice": mailGoodsUpdate.presentPrice, "goodsIntrodution": mailGoodsUpdate.goodsIntrodution, "thumb": mailGoodsUpdate.thumb, "goodsDetails": mailGoodsUpdate.goodsDetails, "isHot": mailGoodsUpdate.isHot, "isHot": mailGoodsUpdate.isHot, "goodsName": mailGoodsUpdate.goodsName }); } $('#test3').on('click', function (){ var index = $("#attrWrap").children().length; let attrNameVal = $('#attrName').val(); if(attrNameVal==null || attrNameVal==""){ febs.alert.warn('样式名称不能为空'); return false; } $('#attrWrap').append(` <div class="layui-form-item item"> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">id:</label> <div class="layui-input-block"> <input type="text" name="id` + index + `"> </div> </div> <div class="layui-form-item febs-hide"> <label class="layui-form-label febs-form-item-require">styleId:</label> <div class="layui-input-block"> <input type="text" id="styleId` + index +`" name="styleId` + index + `"> </div> </div> <div style="float:left" > <input type="text" name="styleName` + index + `" value="` + $('#attrName').val() + `" autocomplete="off" class="layui-input" readonly > </div> <div style="float:left" > <div> <input type="text" name="skuName` + index +`" placeholder="规格名称" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <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-xs sku-img" id="skuImg` + index + `">上传</button> <img class="layui-upload-img" id="imageUrls` + index + `" style="width: 100px" > </div> </div> </div> <div style="float:left" class="febs-hide"> <div> <input type="text" id="skuImage` + index +`" name="skuImage` + index + `" autocomplete="off" class="layui-input"> </div> </div> <div style="float:left" > <div> <input type="number" name="stock` + index +`" placeholder="库存" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="skuVolume` + index +`" placeholder="销售数量" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="originalPrice` + index +`" placeholder="原价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <div> <input type="number" name="presentPrice` + index + `" placeholder="现价" autocomplete="off" class="layui-input" > </div> </div> <div style="float:left" > <button type="button" class="layui-btn del-attr-btn" data-index="` + index +`">删除</button> </div> </div> `) //普通图片上传 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); } }); }); 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); } }); $("#attrWrap").on("click",".del-attr-btn",function(){ var index = $(this).attr('data-index') if($("input[name='styleId" + index + "']").val() ==null || $("input[name='styleId" + index + "']").val() ==''){ $($("#attrWrap").find(".item")[index].remove()); }else{ $("input[name='delLog" + index + "']").val("delLog"); $($("#attrWrap").find(".item")[index].style.display = "none"); } }); form.on('submit(goods-update-form-submit)', function (data) { let skuArrs = []; var skuArr = $("#attrWrap").find(".item"); for(var i = 0;i < skuArr.length;i++){ skuArrs.push({ id: $("input[name='id" + i + "']").val(), styleName: $("input[name='styleName" + i + "']").val(), styleId: $("input[name='styleId" + i + "']").val(), delLog: $("input[name='delLog" + i + "']").val(), skuName: $("input[name='skuName" + i + "']").val(), skuImage: $("input[name='skuImage" + i + "']").val(), stock: $("input[name='stock" + i + "']").val(), skuVolume: $("input[name='skuVolume" + i + "']").val(), originalPrice:$("input[name='originalPrice" + i + "']").val(), presentPrice: $("input[name='presentPrice" + i + "']").val() }) } // if(skuArr.length < 0){ // febs.alert.warn("请填写商品规格"); // return false; // } // console.log(skuArrs) data.field.mailGoodsSkuDto = skuArrs; console.log(data.field) console.log(tableSkuData); data.field.mailGoodsSkuDto = tableSkuData; data.field.delSkuId=delSku; $.ajax({ 'url':ctx + 'admin/goods/updateMallGoods', 'type':'post', @@ -500,12 +576,9 @@ 'traditional': true,//ajax传递数组必须添加属性 'data':JSON.stringify(data.field), 'success':function (data) { if(data.code==0){ if (data.code == 200) { layer.closeAll(); febs.alert.success('操作成功'); // var index = parent.layer.getFrameIndex(window.name); // parent.layer.close(index); // febs.alert.success('操作成功'); febs.alert.success(data.message); $('#febs-goods').find('#reset').click(); }else{ febs.alert.warn(data.message); @@ -517,5 +590,16 @@ }) return false; }); form.on('select(goods-type-select)', function (data) { $('.tc-set').each(function () { if (data.value == 2) { $(this).show(); } else { $(this).hide(); } }) }); }); </script>