402 lines
17 KiB
HTML
402 lines
17 KiB
HTML
{extend name="app/shop/view/base.html"/}
|
||
{block name="resources"}
|
||
<style type="text/css">
|
||
.tree-line{padding:10px 0;background:#ededed;margin-bottom:2px;line-height: 1.8;}
|
||
.tree-line .layui-form{padding-left: 10px !important;}
|
||
.tree-line .layui-form-checkbox{margin:0 10px !important;vertical-align:middle;}
|
||
.form {margin-top: 0;}
|
||
.item-block-hover-a {cursor: pointer;}
|
||
.input-box {position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
|
||
.layui-form-item .layui-form-checkbox[lay-skin=primary] {margin-top: 0;}
|
||
.item-content-desc{display:inline-block;white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis}
|
||
.item-block-parent .item-con {
|
||
flex: 1;
|
||
overflow: hidden;
|
||
height: 55px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
}
|
||
</style>
|
||
{/block}
|
||
{block name="main"}
|
||
<div class="layui-form form">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>套餐名称:</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="group_name" lay-verify="required" autocomplete="off" class="layui-input len-long">
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label img-upload-lable">封面:</label>
|
||
<div class="layui-input-block img-upload">
|
||
<div class="upload-img-block icon">
|
||
<div class="upload-img-box">
|
||
<div class="upload-default" id="group_image">
|
||
<div class="upload">
|
||
<img src="__STATIC__/img/upload_img.png" />
|
||
<p>点击上传</p>
|
||
</div>
|
||
</div>
|
||
<div class="operation" >
|
||
<div >
|
||
<i title="图片预览" class="iconfont iconreview js-preview" style="margin-right: 20px;"></i>
|
||
<i title="删除图片" class="layui-icon layui-icon-delete js-delete"></i>
|
||
</div>
|
||
<div class="replace_img js-replace">点击替换</div>
|
||
</div>
|
||
<input type="hidden" name="group_image"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>门店数量:</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="store_number" lay-verify="required" autocomplete="off" value="0" class="layui-input len-long">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>限制门店数量,0代表无限制</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>商品数量:</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="goods_number" lay-verify="required" autocomplete="off" value="0" class="layui-input len-long">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>限制商品数量,0代表无限制</p>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>团长数量:</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="leader_number" lay-verify="required" autocomplete="off" value="0" class="layui-input len-long">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>限制社区团购团长数量,0无限制</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item distribution-index fee" >
|
||
<label class="layui-form-label"><span class="required">*</span>设置价格:</label>
|
||
<div class="layui-input-block">
|
||
<div class="layui-input-inline">
|
||
<input type="number" name="fee" class="layui-input" value="" required lay-verify="price"/>
|
||
</div>
|
||
<div class="layui-form-mid layui-word-aux">元/</div>
|
||
<div class="layui-input-inline">
|
||
<select name="unit" lay-filter="unit">
|
||
<option value="year">年</option>
|
||
<option value="month">月</option>
|
||
<option value="week">周</option>
|
||
<option value="day">天</option>
|
||
{if $agent_type!='Sitefee'}
|
||
<option value="permanent">永久</option>
|
||
{/if}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layui-form-item fee_commission">
|
||
<label class="layui-form-label"><span class="required">*</span>分佣比例:</label>
|
||
<div class="layui-input-block">
|
||
<div class="layui-input-inline">
|
||
<input type="text" name="fee_commission" lay-verify="required" value="0" autocomplete="off" class="layui-input len-short">
|
||
</div>%
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>订单成交额进行分佣比例,按照百分百 如百分之一 填写:1 可保留两位小数</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item distribution-index">
|
||
<label class="layui-form-label">是否上架:</label>
|
||
<div class="layui-input-block">
|
||
<div class="layui-input-inline">
|
||
<input type="radio" name="status" value="1" lay-filter="level" title="上架"/>
|
||
<input type="radio" name="status" value="0" lay-filter="level" title="下架" checked/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item layui-form-text">
|
||
<label class="layui-form-label">描述:</label>
|
||
<div class="layui-input-block">
|
||
<textarea name="desc" class="layui-textarea len-long"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item layui-form-text" id="promotion_list">
|
||
<div id="promotion">
|
||
<span class="layui-form-label">店铺营销:</span>
|
||
<div class="layui-input-block">
|
||
<div class="site_list item-block-parent item-five">
|
||
{foreach $promotions as $promotion}
|
||
{if condition="$promotion['show_type'] eq 'shop'"}
|
||
<a class="item-block item-block-hover-a">
|
||
<div class="item-block-wrap">
|
||
<div class="item-pic">
|
||
<img src="{:img($promotion['icon'])}" />
|
||
</div>
|
||
<div class="item-con">
|
||
<div class="item-content-title">{$promotion['title']}</div>
|
||
<p class="item-content-desc">{$promotion['description']}</p>
|
||
</div>
|
||
</div>
|
||
<div class="input-box">
|
||
<input type="checkbox" value="{$promotion['name']}" class="input-checkbox" lay-filter="is_checked" lay-skin="primary">
|
||
</div>
|
||
</a>
|
||
{/if}
|
||
{/foreach}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="member">
|
||
<span class="layui-form-label">会员互动:</span>
|
||
<div class="layui-input-block">
|
||
<div class="site_list item-block-parent item-five" >
|
||
{foreach $promotions as $promotion}
|
||
{if condition="$promotion['show_type'] eq 'member'"}
|
||
<a class="item-block item-block-hover-a">
|
||
<div class="item-block-wrap">
|
||
<div class="item-pic">
|
||
<img src="{:img($promotion['icon'])}" />
|
||
</div>
|
||
<div class="item-con">
|
||
<div class="item-content-title">{$promotion['title']}</div>
|
||
<p class="item-content-desc">{$promotion['description']}</p>
|
||
</div>
|
||
</div>
|
||
<div class="input-box">
|
||
<input type="checkbox" value="{$promotion['name']}" class="input-checkbox" lay-filter="is_checked" lay-skin="primary">
|
||
</div>
|
||
</a>
|
||
{/if}
|
||
{/foreach}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="tool">
|
||
<span class="layui-form-label">应用模块:</span>
|
||
<div class="layui-input-block">
|
||
<div class="site_list item-block-parent item-five" >
|
||
{foreach $promotions as $promotion}
|
||
{if condition="$promotion['show_type'] eq 'tool'"}
|
||
<a class="item-block item-block-hover-a">
|
||
<div class="item-block-wrap">
|
||
<div class="item-pic">
|
||
<img src="{:img($promotion['icon'])}" />
|
||
</div>
|
||
<div class="item-con">
|
||
<div class="item-content-title">{$promotion['title']}</div>
|
||
<p class="item-content-desc">{$promotion['description']}</p>
|
||
</div>
|
||
</div>
|
||
<div class="input-box">
|
||
<input type="checkbox" value="{$promotion['name']}" class="input-checkbox" lay-filter="is_checked" lay-skin="primary">
|
||
</div>
|
||
</a>
|
||
{/if}
|
||
{/foreach}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<button class="layui-btn bg-color " lay-submit lay-filter="save">保存</button>
|
||
<button class="layui-btn layui-btn-primary" onclick="back()">返回</button>
|
||
</div>
|
||
</div>
|
||
{/block}
|
||
{block name="script"}
|
||
<script type="text/html" id="storeImageTpl">
|
||
{{# if(d.list.length){ }}
|
||
{{# for(var i=0;i<d.list.length;i++){ }}
|
||
<div class="item upload_img_square_item" data-index="{{i}}">
|
||
<div class="img-wrap">
|
||
<img src="{{ns.img(d.list[i],'small')}}" layer-src>
|
||
</div>
|
||
<div class="operation">
|
||
<i title="图片预览" class="iconfont iconreview js-preview"></i>
|
||
<i title="删除图片" class="layui-icon layui-icon-delete js-delete" data-index="{{i}}"></i>
|
||
<div class="replace_img" data-index="{{i}}">点击替换</div>
|
||
</div>
|
||
</div>
|
||
{{# } }}
|
||
{{# if(d.list.length < d.max){ }}
|
||
<div class="item js-add-image upload_img_square">+</div>
|
||
{{# } }}
|
||
{{# }else{ }}
|
||
<div class="item js-add-image upload_img_square">+</div>
|
||
{{# } }}
|
||
</script>
|
||
<script src="__STATIC__/ext/drag-arrange.js"></script>
|
||
<script>
|
||
var storeImage = [];
|
||
const STORE_IMAGE_MAX = 1;
|
||
// var promotion_items = $("#promotion a").length,
|
||
// extend_items = $("#admin a").length,
|
||
// interaction_items = $("#member a").length,
|
||
// tool_item = $("#tool").length;
|
||
// if (promotion_items == 0) {
|
||
// $("#promotion").hide();
|
||
// }
|
||
// if (extend_items == 0) {
|
||
// $("#admin").hide();
|
||
// }
|
||
// if (interaction_items == 0) {
|
||
// $("#member").hide();
|
||
// }
|
||
// if (tool_item == 0) {
|
||
// $("#tool").hide();
|
||
// }
|
||
var upload = new Upload({
|
||
elem: '#group_image',
|
||
post:"shop"
|
||
});
|
||
layui.use(['form','laytpl'], function() {
|
||
var form = layui.form,
|
||
laytpl = layui.laytpl,
|
||
total_price=0,
|
||
repeat_flag = false; //防重复
|
||
form.render();
|
||
// $(".item-block").each(function() {
|
||
// var checkCon = $(this).find(".input-checkbox");
|
||
// $(this).click(function() {
|
||
// if ($(checkCon).is(':checked')) {
|
||
// $(this).find(".layui-form-checkbox").removeClass("layui-form-checked");
|
||
// $(checkCon).prop("checked", false);
|
||
// total_price -=parseFloat($(checkCon).attr('data-price'),2)
|
||
// $("#yprice").html(total_price)
|
||
// } else {
|
||
// $(this).find(".layui-form-checkbox").addClass("layui-form-checked");
|
||
// $(checkCon).prop("checked", true);
|
||
// total_price +=parseFloat($(checkCon).attr('data-price'),2)
|
||
// $("#yprice").html(total_price)
|
||
// }
|
||
// })
|
||
// })
|
||
form.on("checkbox(is_checked)", function(data) {
|
||
// if(data.elem.checked){
|
||
// total_price +=parseFloat(data.elem.getAttribute('data-price'),2)
|
||
// }else {
|
||
// total_price -=parseFloat(data.elem.getAttribute('data-price'),2)
|
||
// }
|
||
// $("#yprice").html(total_price)
|
||
$(data.elem).parents(".item-block").click();
|
||
})
|
||
|
||
form.on('radio(fee_type)', function (data) {
|
||
var elem = data.elem; // 获得 radio 原始 DOM 对象
|
||
var value = elem.value; // 获得 radio 值
|
||
if(value=='fixed_fee'){
|
||
$(".fee_commission").hide()
|
||
$(".fee").show()
|
||
}else {
|
||
$(".fee_commission").show()
|
||
$(".fee").hide()
|
||
}
|
||
});
|
||
|
||
// 添加门店图片
|
||
$("body").on("click", ".js-add-image", function () {
|
||
openAlbum(function (data) {
|
||
for (var i = 0; i < data.length; i++) {
|
||
if (storeImage.length < STORE_IMAGE_MAX) storeImage.push(data[i].pic_path);
|
||
}
|
||
refreshStoreImage();
|
||
}, 5, 1);
|
||
});
|
||
|
||
//渲染门店图片
|
||
function refreshStoreImage() {
|
||
var store_image_template = $("#storeImageTpl").html();
|
||
var data = {
|
||
list: storeImage,
|
||
max: STORE_IMAGE_MAX
|
||
};
|
||
laytpl(store_image_template).render(data, function (html) {
|
||
$(".js-store-image").html(html);
|
||
//加载图片放大
|
||
loadImgMagnify();
|
||
if (storeImage.length) {
|
||
//预览
|
||
$(".js-store-image .js-preview").click(function () {
|
||
$(this).parent().prev().find("img").click();
|
||
});
|
||
//图片删除
|
||
$(".js-store-image .js-delete").click(function () {
|
||
var index = $(this).attr("data-index");
|
||
storeImage.splice(index, 1);
|
||
refreshStoreImage();
|
||
});
|
||
|
||
// 拖拽
|
||
$('.js-store-image .upload_img_square_item').arrangeable({
|
||
//拖拽结束后执行回调
|
||
callback: function (e) {
|
||
var indexBefore = $(e).attr("data-index");//拖拽前的原始位置
|
||
var indexAfter = $(e).index();//拖拽后的位置
|
||
var temp = storeImage[indexBefore];
|
||
storeImage[indexBefore] = storeImage[indexAfter];
|
||
storeImage[indexAfter] = temp;
|
||
refreshStoreImage();
|
||
}
|
||
});
|
||
}
|
||
|
||
//最多传十张图
|
||
if (storeImage.length < STORE_IMAGE_MAX) {
|
||
$(".js-add-image").show();
|
||
} else {
|
||
$(".js-add-image").hide();
|
||
}
|
||
});
|
||
}
|
||
|
||
refreshStoreImage();
|
||
|
||
form.on('submit(save)', function(data) {
|
||
var obj = $("#promotion_list input:checked");
|
||
var addon_array = [];
|
||
for (var i = 0; i < obj.length; i++) {
|
||
addon_array.push(obj.eq(i).val());
|
||
}
|
||
data.field.addon_array = addon_array.toString();
|
||
data.field.ad_image = storeImage.toString();
|
||
if(repeat_flag) return;
|
||
repeat_flag = true;
|
||
$.ajax({
|
||
url: ns.url("saas://shop/group/addgroup"),
|
||
data:data.field,
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
repeat_flag = false;
|
||
if (res.code == 0) {
|
||
layer.confirm('添加成功', {
|
||
title:'操作提示',
|
||
btn: ['返回列表', '继续添加'],
|
||
yes: function(){
|
||
location.href = ns.url("saas://shop/group/lists")
|
||
},
|
||
btn2: function() {
|
||
location.href = ns.url("saas://shop/group/addgroup")
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg(res.message);
|
||
}
|
||
}
|
||
});
|
||
});
|
||
});
|
||
//跳转到店铺列表
|
||
function back() {
|
||
location.href = ns.url("saas://shop/group/lists")
|
||
}
|
||
</script>
|
||
{/block} |