|  |  |  | 
|---|
|  |  |  | <div class="layui-fluid layui-anim febs-anim" id="febs-goods" lay-title="新增商品"> | 
|---|
|  |  |  | <div class="layui-fluid layui-anim febs-anim" id="febs-goods-add" 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-card">--> | 
|---|
|  |  |  | <!--                <div class="layui-card-body febs-table-full">--> | 
|---|
|  |  |  | <div class="layui-fluid" id="goods-add"> | 
|---|
|  |  |  | <form class="layui-form" action="" lay-filter="goods-add-form"> | 
|---|
|  |  |  | <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | <!--                                                    <select name="categoryId" class="categary-addPeoduct" >--> | 
|---|
|  |  |  | <!--                                                        <option value="">请选择</option>--> | 
|---|
|  |  |  | <!--                                                    </select>--> | 
|---|
|  |  |  | <div id="goods-category"></div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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="goodsDetailEdit" 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: 450px;"></div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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 class="layui-form-mid layui-word-aux">现价设置为0进入零撸专区</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"  style="text-align:center"> | 
|---|
|  |  |  | <div class="layui-form-item febs-hide"> | 
|---|
|  |  |  | <button class="layui-btn" lay-submit="" lay-filter="goods-add-form-submit" id="submit">保存</button> | 
|---|
|  |  |  | <button class="layui-btn layui-btn-danger" lay-submit="" lay-filter="goods-add-form-cancel" id="cancel">取消</button> | 
|---|
|  |  |  | <!--                                <button class="layui-btn layui-btn-danger" lay-submit="" lay-filter="goods-add-form-cancel" id="cancel">取消</button>--> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </form> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!--            </div>--> | 
|---|
|  |  |  | <!--        </div>--> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <style> | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-table-cell { | 
|---|
|  |  |  | height:auto; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-upload-list { | 
|---|
|  |  |  | margin: 0 !important; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .multi-images { | 
|---|
|  |  |  | margin: 0 5px !important; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <script type="text/html" id="toolbar"> | 
|---|
|  |  |  | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <!-- 表格操作栏 end --> | 
|---|
|  |  |  | <script data-th-inline="javascript"> | 
|---|
|  |  |  | layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','dropdown', 'laydate','layedit','upload', 'element', 'table'], function () { | 
|---|
|  |  |  | layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','dropdown', 'laydate', 'layedit', 'upload', 'element', 'table', 'xmSelect'], function () { | 
|---|
|  |  |  | var $ = layui.jquery, | 
|---|
|  |  |  | febs = layui.febs, | 
|---|
|  |  |  | layer = layui.layer, | 
|---|
|  |  |  | 
|---|
|  |  |  | form = layui.form, | 
|---|
|  |  |  | laydate = layui.laydate, | 
|---|
|  |  |  | eleTree = layui.eleTree, | 
|---|
|  |  |  | member = [[${member}]], | 
|---|
|  |  |  | $view = $('#goods-add'), | 
|---|
|  |  |  | layedit = layui.layedit, | 
|---|
|  |  |  | upload = layui.upload, | 
|---|
|  |  |  | 
|---|
|  |  |  | element = layui.element; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | form.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, '') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const editor = E.createEditor({ | 
|---|
|  |  |  | selector: '#editor-container', | 
|---|
|  |  |  | config : editorConfig, | 
|---|
|  |  |  | mode: 'default' | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const toolbar = E.createToolbar({ | 
|---|
|  |  |  | editor, | 
|---|
|  |  |  | selector: '#toolbar-container', | 
|---|
|  |  |  | mode: 'default' | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | laydate.render({ | 
|---|
|  |  |  | elem: '#febs-form-group-date' | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | formSelects.render(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var category = xmSelect.render({ | 
|---|
|  |  |  | el: '#goods-category', | 
|---|
|  |  |  | language: 'zn', | 
|---|
|  |  |  | prop : { | 
|---|
|  |  |  | value : 'id', | 
|---|
|  |  |  | children : 'child' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | iconfont: { | 
|---|
|  |  |  | parent: 'hidden', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | radio: true, | 
|---|
|  |  |  | clickClose: true, | 
|---|
|  |  |  | tree: { | 
|---|
|  |  |  | show: true, | 
|---|
|  |  |  | //非严格模式 | 
|---|
|  |  |  | strict: false, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data: [] | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | febs.get(ctx + 'admin/goodsCategory/categoryTree', null, function(res) { | 
|---|
|  |  |  | category.update({ | 
|---|
|  |  |  | data : res.data, | 
|---|
|  |  |  | autoRow: true, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var tableSkuData=[]; | 
|---|
|  |  |  | var tableIns = table.render({ | 
|---|
|  |  |  | 
|---|
|  |  |  | $('.multi-sku-table').hide(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | $('.multi-sku-table').show(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | form.on('radio(hasCarriage)', function(data){ | 
|---|
|  |  |  | if (data.value == 2) { | 
|---|
|  |  |  | $('.carriage-input').hide(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | $('.carriage-input').show(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | ,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){ | 
|---|
|  |  |  | 
|---|
|  |  |  | }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({ | 
|---|
|  |  |  | 
|---|
|  |  |  | ,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('lay_edit',{ | 
|---|
|  |  |  | height: 300 | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | //提交时把值同步到文本域中 | 
|---|
|  |  |  | 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) { | 
|---|
|  |  |  | console.log(tableSkuData); | 
|---|
|  |  |  | data.field.goodsType = 1; | 
|---|
|  |  |  | data.field.addMallGoodsSkuDtos = tableSkuData; | 
|---|
|  |  |  | data.field.categoryId = category.getValue('valueStr'); | 
|---|
|  |  |  | data.field.goodsDetails = editor.getHtml(); | 
|---|
|  |  |  | $.ajax({ | 
|---|
|  |  |  | 'url':ctx + 'admin/goods/addMallGoods', | 
|---|
|  |  |  | 'type':'post', | 
|---|
|  |  |  | 
|---|
|  |  |  | 'traditional': true,//ajax传递数组必须添加属性 | 
|---|
|  |  |  | 'data':JSON.stringify(data.field), | 
|---|
|  |  |  | 'success':function (data) { | 
|---|
|  |  |  | if(data.code==0){ | 
|---|
|  |  |  | if(data.code==200){ | 
|---|
|  |  |  | layer.closeAll(); | 
|---|
|  |  |  | febs.alert.success(data.message); | 
|---|
|  |  |  | var index = parent.layer.getFrameIndex(window.name); | 
|---|
|  |  |  | parent.layer.close(index); | 
|---|
|  |  |  | $('#febs-goods').find('#reset').click(); | 
|---|
|  |  |  | }else{ | 
|---|
|  |  |  | febs.alert.warn(data.message); | 
|---|
|  |  |  | } | 
|---|