361 lines
10 KiB
HTML
361 lines
10 KiB
HTML
{extend name="app/shop/view/base.html"/}
|
||
{block name="resources"}
|
||
<style>
|
||
#goods thead th{ background-color: #f7f7f7;}
|
||
/* 优惠商品 */
|
||
.goods-empty { width: 100%; display: flex; justify-content: center; align-items: center; }
|
||
.goods-title{display: flex;align-items: center;}
|
||
.goods-title .goods-img{display: flex;align-items: center;justify-content: center;width: 55px;height: 55px;margin-right: 5px;}
|
||
.goods-title .goods-img img{max-height: 100%;max-width: 100%;}
|
||
.goods-title .goods-name{flex: 1;line-height: 1.6;}
|
||
.goods_num {padding-left: 20px;}
|
||
</style>
|
||
{/block}
|
||
{block name="main"}
|
||
<div class="layui-form form-wrap" id="add_active">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>活动名称：</label>
|
||
<div class="layui-input-block">
|
||
<input type="text" name="bl_name" value="{$info.bl_name}" lay-verify="required" autocomplete="off" placeholder="请输入活动名称" class="layui-input len-long" maxlength="40">
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>请认真填写优惠套餐名称，使顾客能从名称了解该套餐</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label"><span class="required">*</span>商品：</label>
|
||
<div class="layui-input-block">
|
||
<table class="layui-table" id="goods" lay-skin="line" lay-size="lg">
|
||
<colgroup>
|
||
<col width="45%">
|
||
<col width="20%">
|
||
<col width="20%">
|
||
<col width="15%">
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th>商品名称</th>
|
||
<th>价格</th>
|
||
<th>库存</th>
|
||
<th class="operation">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{if condition="$info.bundling_goods"}
|
||
{foreach name=$info.bundling_goods as $k => $v}
|
||
<tr data-sku_id="{$v.sku_id}">
|
||
<td>
|
||
<div class="goods-title">
|
||
<div class="goods-img">
|
||
{if condition="$v.sku_image"}
|
||
<img layer-src src="{:img($v.sku_image)}" alt="">
|
||
{else/}
|
||
<img layer-src src="" alt="">
|
||
{/if}
|
||
</div>
|
||
<p class="multi-line-hiding goods-name">{$v.sku_name}</p>
|
||
</div>
|
||
</td>
|
||
<td class="price-one">{$v.price}</td>
|
||
<td>{$v.stock}</td>
|
||
<td class="operation">
|
||
<div class="table-btn">
|
||
<a href="javascript:;" class="layui-btn" onclick="deleteGoods(this)">删除商品</a>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
{/foreach}
|
||
{else/}
|
||
<tr>
|
||
<td colspan="4">
|
||
<div class="goods-empty"><span>未添加商品</span></div>
|
||
</td>
|
||
</tr>
|
||
{/if}
|
||
</tbody>
|
||
</table>
|
||
<button class="layui-btn" onclick="addGoods()">添加商品</button> <span class="goods_num">已选商品（<span id="goods_num" class="text-color">{$info.bundling_goods_count}</span>）</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">套餐价格：</label>
|
||
<div class="layui-input-block form-row">
|
||
<div class="layui-input-inline">
|
||
<input type="number" name="bl_price" lay-verify="flo" value="{$info.bl_price}" autocomplete="off" class="layui-input combined-price" min="0.00">
|
||
</div>
|
||
<span class="layui-form-mid">元</span>
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>价格不能小于0，可保留两位小数</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">原价：</label>
|
||
<div class="layui-input-block">
|
||
<p class="input-text"><span class="original-price">{$info.goods_money}</span>元</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">节省价：</label>
|
||
<div class="layui-input-block">
|
||
<p class="input-text"><span class="save-prices"></span>元</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">运费承担：</label>
|
||
<div class="layui-input-block">
|
||
<input type="radio" name="shipping_fee_type" value="1" title="卖家承担运费" {$info.shipping_fee_type == 1 ? 'checked' : ''}>
|
||
<input type="radio" name="shipping_fee_type" value="2" title="买家承担运费（快递）" {$info.shipping_fee_type == 2 ? 'checked' : ''}>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">是否上下架：</label>
|
||
<div class="layui-input-block">
|
||
<input type="checkbox" name="status" lay-filter="isOpen" value="1" lay-skin="switch" {if $info.status==1}checked{/if} />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<button class="layui-btn" lay-submit lay-filter="save">保存</button>
|
||
<button class="layui-btn layui-btn-primary" onclick="back()">返回</button>
|
||
</div>
|
||
|
||
<input type="hidden" name="bl_id" value="{$bl_id}" />
|
||
</div>
|
||
{/block}
|
||
{block name="script"}
|
||
<script>
|
||
var priceAll = $(".original-price").text();
|
||
var priceBl = $("input[name=bl_price]").val();
|
||
$(".save-prices").text((parseFloat(priceAll) - parseFloat(priceBl)).toFixed(2)); //优惠价
|
||
var table, form, selectGoodsSkuId = [];
|
||
|
||
$("#goods").find("tbody tr").each(function (i) {
|
||
var id = $(this).attr("data-sku_id");
|
||
selectGoodsSkuId.push(id);
|
||
});
|
||
|
||
layui.use(['form'], function() {
|
||
form = layui.form;
|
||
var repeat_flag = false; //防重复标识
|
||
|
||
table = new Table({
|
||
elem: '#goods_list',
|
||
url: ns.url("bundling://shop/bundling/lists"),
|
||
cols: [
|
||
[{
|
||
unresize: 'false',
|
||
width: '8%',
|
||
templet: '#checkbox'
|
||
}, {
|
||
title: '商品',
|
||
unresize: 'false',
|
||
width: '37%',
|
||
templet: '#goodIntro'
|
||
}, {
|
||
field: 'stock',
|
||
title: '商品库存',
|
||
unresize: 'false',
|
||
width: '15%'
|
||
}, {
|
||
field: 'goods_class_name',
|
||
title: '商品类型',
|
||
unresize: 'false',
|
||
width: '12%'
|
||
}, {
|
||
field: 'goods_state_name',
|
||
title: '状态',
|
||
unresize: 'false',
|
||
width: '8%'
|
||
}, {
|
||
field: 'create_time',
|
||
title: '创建时间',
|
||
unresize: 'false',
|
||
width: '20%',
|
||
align: 'right',
|
||
templet: function (data) {
|
||
return ns.time_to_date(data.create_time);
|
||
}
|
||
}]
|
||
]
|
||
});
|
||
|
||
/**
|
||
* 监听提交
|
||
*/
|
||
form.on('submit(save)', function(data) {
|
||
var num = $("#goods").find("tbody tr").length;
|
||
var combinedPrice = $('.combined-price').val(),
|
||
originalPrice = Number($(".original-price").text());
|
||
if (num < 2) {
|
||
layer.msg("商品数不可小于2个！");
|
||
return;
|
||
}
|
||
|
||
if (data.field.status == undefined) {
|
||
data.field.status = 0;
|
||
}
|
||
|
||
if(combinedPrice > originalPrice){
|
||
layer.msg("组合套餐价格不能高于原价");
|
||
$(".save-prices").text(0).focus();
|
||
return false
|
||
}
|
||
|
||
var selectGoodsSkuId = []; //商品id
|
||
$("#goods").find("tbody tr").each(function (i) {
|
||
var id = $(this).attr("data-sku_id");
|
||
selectGoodsSkuId.push(id);
|
||
});
|
||
|
||
data.field.sku_ids = selectGoodsSkuId.toString();
|
||
|
||
if(repeat_flag) return;
|
||
repeat_flag = true;
|
||
|
||
$.ajax({
|
||
url: ns.url("bundling://shop/bundling/edit"),
|
||
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("bundling://shop/bundling/lists");
|
||
},
|
||
btn2: function() {
|
||
location.reload();
|
||
}
|
||
});
|
||
}else{
|
||
layer.msg(res.message);
|
||
}
|
||
}
|
||
});
|
||
});
|
||
|
||
form.verify({
|
||
flo: function (value) {
|
||
if (value == '') {
|
||
return;
|
||
}
|
||
var reg = /^(0|[1-9]\d*)(\s|$|\.\d{1,2}\b)/;
|
||
if (!reg.test(value)) {
|
||
return '价格不能小于0，可保留两位小数！'
|
||
}
|
||
}
|
||
});
|
||
});
|
||
|
||
/**
|
||
* 添加商品
|
||
*/
|
||
function addGoods() {
|
||
goodsSelect(function (res) {
|
||
if (!res.length) return false;
|
||
var price = 0.00;
|
||
var html = $("#goods tbody .goods-empty").length ? '' : $("#goods tbody").html();
|
||
for (var i = 0; i < res.length; i++) {
|
||
for (var k = 0; k < res[i].selected_sku_list.length; k++) {
|
||
var item = res[i].selected_sku_list[k];
|
||
html += `<tr data-sku_id="${item.sku_id}">`;
|
||
html += `
|
||
<td>
|
||
<div class="goods-title">
|
||
<div class="goods-img">
|
||
<img layer-src src="${item.sku_image ? ns.img(item.sku_image) : ''}" alt="">
|
||
</div>
|
||
<p class="multi-line-hiding goods-name">${item.sku_name}</p>
|
||
</div>
|
||
</td>
|
||
`;
|
||
html += `<td class='price-one'>${item.price }</td>`;
|
||
html += `<td>${item.stock}</td>`;
|
||
html += `<td class='operation'> <div class='table-btn '><a href='javascript:;' class='layui-btn' onclick='deleteGoods(this)'>删除商品</a></div></td>`;
|
||
html += `</tr>`;
|
||
|
||
price += Number(item.price);
|
||
selectGoodsSkuId.push(item.sku_id);
|
||
}
|
||
}
|
||
$("#goods_num").html(selectGoodsSkuId.length);
|
||
$("#goods tbody").html(html);
|
||
priceCount();
|
||
|
||
}, selectGoodsSkuId, {mode: "sku", max_num: 6, min_num: 2});
|
||
}
|
||
|
||
/**
|
||
* 删除商品
|
||
*/
|
||
function deleteGoods(data){
|
||
var obj = $(data).parent().parent().parent();
|
||
$(obj).remove();
|
||
priceCount(); //计算出当前总价格
|
||
for (var i in selectGoodsSkuId){
|
||
if(selectGoodsSkuId[i] == Number($(obj).attr("data-sku_id"))){
|
||
selectGoodsSkuId.splice(i,1);
|
||
}
|
||
}
|
||
$("#goods_num").html(selectGoodsSkuId.length)
|
||
}
|
||
|
||
/**
|
||
* 计算总价
|
||
*/
|
||
function priceCount() {
|
||
var price_count = 0;
|
||
$("#goods").find("tbody td.price-one").each(function (i) {
|
||
var price_one = Number($(this).text());
|
||
price_count += price_one;
|
||
});
|
||
|
||
$(".original-price").text(price_count.toFixed(2));
|
||
$(".save-prices").text(0);
|
||
$(".combined-price").val(price_count.toFixed(2));
|
||
|
||
if (price_count == 0) {
|
||
var html = '<tr>'+
|
||
'<td colspan="4">'+
|
||
'<div class="goods-empty">优惠套装还未选择添加商品</div>'+
|
||
'</td>'+
|
||
'</tr>';
|
||
|
||
$("#goods tbody").html(html);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 计算组合套餐价格、原价、节省价
|
||
*/
|
||
// $(".combined-price").blur(function () {
|
||
// var combinedPrice = $(this).val(),
|
||
// originalPrice = Number($(".original-price").text());
|
||
|
||
// if(combinedPrice > originalPrice){
|
||
// $(this).val(originalPrice);
|
||
// layer.msg("组合套餐价格不能高于原价");
|
||
// $(".save-prices").text(0);
|
||
|
||
// return false
|
||
// }else{
|
||
// $(".save-prices").text((originalPrice - combinedPrice).toFixed(2));
|
||
// }
|
||
// });
|
||
|
||
function back() {
|
||
location.href = ns.url("bundling://shop/bundling/lists");
|
||
}
|
||
</script>
|
||
{/block} |