| <div class="layui-fluid layui-anim febs-anim" id="febs-act-add" lay-title="新增活动"> | 
|     <div class="layui-row febs-container"> | 
|         <div class="layui-col-md12"> | 
|             <div class="layui-fluid" id="act-add"> | 
|                 <form class="layui-form" action="" lay-filter="act-add-form"> | 
|                     <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief"> | 
|                             <ul class="layui-tab-title"> | 
|                                 <li class="layui-this">基础信息</li> | 
|                             </ul> | 
|                             <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="actName" 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="actCode" 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="actStartTime" id="febs-form-group-date" lay-verify="date" | 
|                                                        placeholder="yyyy-MM-dd" 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="actEndTime" id="febs-form-group-date" lay-verify="date" | 
|                                                        placeholder="yyyy-MM-dd" 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="actScoreCnt"  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"> | 
|                                             <label> | 
|                                                 <textarea name="actRemark" rows="5" autocomplete="off" class="layui-textarea" ></textarea> | 
|                                             </label> | 
|                                         </div> | 
|                                     </div> | 
|   | 
|                                     <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"> | 
|                                                 <select name="awardType" class="award-type" lay-filter="award-type-select"> | 
|                                                     <option value="1">积分</option> | 
|                                                     <option value="2">佣金</option> | 
|                                                     <option value="3">谢谢参与</option> | 
|                                                 </select> | 
|                                             </div> | 
|                                         </div> | 
|                                         <div class="layui-col-lg6"> | 
|                                             <button type="button" class="layui-btn layui-btn-normal layui-btn" id="test3" >添加奖品</button> | 
|                                         </div> | 
|   | 
|                                     <div class="layui-form-item"> | 
|                                         <div class="layui-input-block"> | 
|                                             <table id="multiAwardSku" lay-filter="multiAwardSku"></table> | 
|                                         </div> | 
|                                     </div> | 
|                                 </div> | 
|                             </div> | 
|                         </div> | 
|                     </div> | 
|   | 
|                     <div class="layui-form-item febs-hide"> | 
|                         <button class="layui-btn" lay-submit="" lay-filter="act-add-form-submit" id="submit">保存</button> | 
|                     </div> | 
|                 </form> | 
|             </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="delAct">删除</button> | 
|     </div> | 
| </script> | 
| <script type="text/html" id="awardtableImgUpload"> | 
|     <div class="layui-upload"> | 
|         <button type="button" class="layui-btn layui-btn-normal layui-btn-xs sku-img" id="awardImg{{d.index}}">上传</button></br> | 
|         <img class="layui-upload-img" id="awardImageUrls{{d.index}}" style="width: 100px; display:none;" src="{{d.awardImage}}" > | 
|         <input type="text" id="awardImage{{d.index}}" name="awardImage{{d.index}}" autocomplete="off" value="{{d.awardImage}}" 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', 'element', 'table', 'xmSelect'], 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, | 
|             $view = $('#act-add'), | 
|             layedit = layui.layedit, | 
|             upload = layui.upload, | 
|             validate = layui.validate, | 
|             element = layui.element; | 
|   | 
|         form.render(); | 
|   | 
|         laydate.render({ | 
|             elem: '#febs-form-group-date' | 
|         }); | 
|   | 
|         formSelects.render(); | 
|   | 
|         var category = xmSelect.render({ | 
|             el: '#goods-category', | 
|             language: 'zn', | 
|             prop : { | 
|                 value : 'id', | 
|                 children : 'child' | 
|             }, | 
|             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 tableAwardData=[]; | 
|         var tableIns = table.render({ | 
|             elem: '#multiAwardSku' | 
|             ,limit:999 | 
|             ,toolbar:"#toolbar" | 
|             ,defaultToolbar:[] | 
|             ,cols: [[ //表头 | 
|                 {type: 'checkbox'} | 
|                 ,{field: 'index', title: '序号', width:70} | 
|                 ,{field: 'awardName', title: '奖品名称', edit:'text'} | 
|                 ,{field: 'awardImage', title: '奖品图'} | 
|                 ,{templet: '#awardtableImgUpload', title: '缩略图', width:150} | 
|                 ,{field: 'awardTotal', title: '奖品总数', edit:'text'} | 
|                 ,{field: 'awardCnt', title: '已中奖数量', edit:'text'} | 
|                 ,{field: 'awardType', title: '奖品类型', | 
|                     templet: function (d) { | 
|                         if (d.awardType == '1') { | 
|                             return '<span style="color:blue;">积分</span>' | 
|                         } else if (d.awardType == '2') { | 
|                             return '<span style="color:green;">佣金</span>' | 
|                         }else if (d.awardType == '3') { | 
|                             return '<span>谢谢参与</span>' | 
|                         }else{ | 
|                             return '' | 
|                         } | 
|                     }, minWidth: 80,align:'center'} | 
|                 ,{field: 'awardValue', title: '奖金数量', edit:'text'} | 
|             ]] | 
|             ,data: [] | 
|         }); | 
|   | 
|         table.on('toolbar(multiAwardSku)', function(obj){ | 
|             var data = obj.data; | 
|   | 
|             var hasData = table.cache['multiAwardSku']; | 
|             var checkData = table.checkStatus('multiAwardSku').data; | 
|   | 
|             if (checkData.length <= 0) { | 
|                 febs.alert.warn('请选择删除数据'); | 
|                 return; | 
|             } | 
|             if(obj.event === 'delAct'){ | 
|                 for (let i = 0; i < checkData.length; i++) { | 
|                     var delData = checkData[i]; | 
|                     for (let j = 0; j < hasData.length; j++) { | 
|                         if (hasData[j].index == delData.index) { | 
|                             hasData.splice(j, 1); | 
|                             break; | 
|                         } | 
|                     } | 
|                 } | 
|   | 
|                 for (let i = 0; i < hasData.length; i++) { | 
|                     hasData[i].index = i + 1; | 
|                 } | 
|   | 
|                 tableAwardData=hasData; | 
|                 reloadTable(hasData); | 
|             } | 
|         }); | 
|   | 
|         function addTableDate(data) { | 
|             var hasData = table.cache['multiAwardSku']; | 
|   | 
|             data.index = hasData.length + 1; | 
|             tableAwardData.push(data); | 
|   | 
|             reloadTable(tableAwardData); | 
|             return data.index; | 
|         } | 
|   | 
|         function reloadTable(data) { | 
|             table.reload('multiAwardSku', { | 
|                 data : data | 
|             }); | 
|   | 
|             for (let i = 0; i < data.length; i++) { | 
|                 if (data[i].awardImage) { | 
|                     $('#awardImageUrls'+ (i+1)).css('display','block'); | 
|                 } | 
|                 // 重新绑定图片上传 | 
|                 bindUpload(i+1); | 
|             } | 
|         } | 
|   | 
|         table.on('edit(multiAwardSku)', function(obj){ | 
|             var value = obj.value //得到修改后的值 | 
|                 ,data = obj.data //得到所在行所有键值 | 
|                 ,field = obj.field; //得到字段 | 
|   | 
|             for (let i = 0; i < tableAwardData.length; i++) { | 
|                 if (tableAwardData[i].index == data.index) { | 
|                     tableAwardData[i] = data; | 
|                 } | 
|             } | 
|         }); | 
|   | 
|         $('#test3').on('click', function (){ | 
|             var awardTypeVal = $("select[name='awardType']").val(); | 
|             if(awardTypeVal == null || awardTypeVal == ""){ | 
|                 febs.alert.warn('奖品类型不能为空'); | 
|                 return false; | 
|             } | 
|   | 
|             var data = {}; | 
|             data.awardType = awardTypeVal; | 
|             addTableDate(data); | 
|         }); | 
|   | 
|         function bindUpload(index) { | 
|             // 普通图片上传 | 
|             upload.render({ | 
|                 elem: '#awardImg' + index | 
|                 ,url: ctx + 'admin/goods/uploadFileBase64' //改成您自己的上传接口 | 
|                 ,done: function(res){ | 
|                     febs.alert.success(res.data.src); | 
|                     $('#awardImageUrls' + index).attr('src', res.data.src); | 
|                     $('#awardImageUrls'+ index).css('display','block'); | 
|                     $('#awardImage'+ index).val(res.data.src); | 
|   | 
|                     for (let i = 0; i < tableAwardData.length; i++) { | 
|                         if(tableAwardData[i].index == index) { | 
|                             tableAwardData[i].awardImage = res.data.src; | 
|                         } | 
|                     } | 
|   | 
|                     reloadTable(tableAwardData); | 
|                 } | 
|             }); | 
|         } | 
|   | 
|         form.on('submit(act-add-form-submit)', function (data) { | 
|             data.field.addMallActAwardDtos = tableAwardData; | 
|             $.ajax({ | 
|                 'url':ctx + 'admin/act/addMallAct', | 
|                 '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==200){ | 
|                         layer.closeAll(); | 
|                         febs.alert.success(data.message); | 
|                         $('#febs-act').find('#reset').click(); | 
|                     }else{ | 
|                         febs.alert.warn(data.message); | 
|                     } | 
|                 }, | 
|                 'error':function () { | 
|                     febs.alert.warn('服务器繁忙'); | 
|                 } | 
|             }) | 
|             return false; | 
|         }); | 
|     }); | 
| </script> |