634 lines
18 KiB
HTML
634 lines
18 KiB
HTML
{extend name="base"/}
|
||
{block name="resources"}
|
||
<link rel="stylesheet" href="SHOP_SUPPLY_LOCAL_CSS/cart.css">
|
||
{/block}
|
||
{block name="body"}
|
||
<div class="ns-supply-wrap">
|
||
<div class="ns-supply-wrap-con">
|
||
{include file="addon/supply/shop/view/market_head.html"/}
|
||
|
||
<div class="ns-supply-cart">
|
||
<div class="ns-cart-list-wrap">
|
||
|
||
</div>
|
||
<!-- 购物车为空 -->
|
||
{if $count > 0}
|
||
<div class="null-cart layui-hide">
|
||
{else/}
|
||
<div class="null-cart">
|
||
{/if}
|
||
<div class="null-cart-img"><img src="SHOP_SUPPLY_LOCAL_IMG/shopping_cart.png" /></div>
|
||
<div class="null-cart-font">
|
||
<p>您的供货单还是空的，赶紧行动吧！您可以：</p>
|
||
<p>看看 <a href="{:addon_url('supply://shop/goods/goodslist')}">商品列表</a></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script type="text/html" id="cartList">
|
||
<div class="ns-cart-wrap layui-form">
|
||
<ul class="ns-cart-th">
|
||
<li><input type="checkbox" name="" lay-skin="primary" lay-filter="allSelected" checked></li>
|
||
<li>商品信息</li>
|
||
<li>价格</li>
|
||
<li>数量</li>
|
||
<li>小计</li>
|
||
<li>操作</li>
|
||
</ul>
|
||
|
||
<div class="list">
|
||
{{# layui.each(d, function(siteIndex, siteItem) { }}
|
||
<div class="item">
|
||
<div class="head layui-form">
|
||
<input type="checkbox" name="" lay-skin="primary" lay-filter="siteSelected" data-site="{{siteIndex}}" checked>
|
||
<a href="#">{{ siteItem.site_name }}</a>
|
||
{{# if (siteItem.is_own) { }}
|
||
<span class="layui-badge">自营</span>
|
||
{{# } }}
|
||
</div>
|
||
|
||
{{# layui.each(siteItem.goodsList, function(goodsIndex, goodsItem) { }}
|
||
<ul data-site="{{siteIndex}}" data-sku="{{goodsIndex}}" data-sku_id="{{goodsItem.sku_id}}">
|
||
<li>
|
||
<input type="checkbox" name="" lay-skin="primary" lay-filter="goodsSelected" data-site="{{siteIndex}}" data-sku="{{goodsIndex}}" data-site_id="{{siteItem.site_id}}" data-cart_id="{{goodsItem.cart_id}}" checked>
|
||
</li>
|
||
<li class="goods-info-wrap">
|
||
<div class="img-wrap" onclick="goodsDetail({{goodsItem.sku_id}})"><img class="img-thumbnail" src="{{ns.img(goodsItem.sku_image)}}" onerror="this.src = 'SHOP_SUPPLY_LOCAL_IMG/default_goods.png' " /></div>
|
||
<div class="info-wrap">
|
||
<h5 onclick="goodsDetail({{goodsItem.sku_id}})">{{ goodsItem.sku_name }}</h5>
|
||
|
||
{{# if (goodsItem.sku_spec_format) { }}
|
||
{{# var sku_spec = JSON.parse(goodsItem.sku_spec_format) }}
|
||
{{# } }}
|
||
|
||
{{# layui.each(sku_spec, function(k, v) { }}
|
||
<span> {{ v.spec_name }}：{{ v.spec_value_name }}{{ k < goodsItem.sku_spec_format.length - 1 ? "；" : "" }}
|
||
</span>
|
||
{{# }) }}
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<span class="price-text">￥{{ goodsItem.price }}</span>
|
||
</li>
|
||
<li class="ns-goods-buy-num">
|
||
<span>
|
||
<span class="decrease" onclick="changeNum({{siteIndex}}, {{goodsIndex}}, 'down', {{goodsItem.cart_id}})">-</span><input type="text" name="buy_num" class="layui-input" data-id="{{goodsItem.cart_id}}" data-min="{{goodsItem.min_num}}" data-max="{{goodsItem.stock}}" data-site="{{siteIndex}}" data-sku="{{goodsIndex}}" value="{{goodsItem.num}}" data-sku_id="{{goodsItem.sku_id}}"/><span class="increase" onclick="changeNum({{siteIndex}}, {{goodsIndex}}, 'up', {{goodsItem.cart_id}})">+</span>
|
||
</span>
|
||
</li>
|
||
<li>
|
||
<strong class="subtotal ns-text-color" data-site="{{siteIndex}}" data-sku="{{goodsIndex}}">￥{{ goodsItem.total_price }}</strong>
|
||
</li>
|
||
<li>
|
||
<a class="layu-btn" onclick="deleteCart({{goodsItem.cart_id}}, {{siteIndex}}, {{goodsIndex}})">删除</a>
|
||
</li>
|
||
</ul>
|
||
{{# }) }}
|
||
</div>
|
||
{{# }) }}
|
||
</div>
|
||
|
||
<div class="lose-list" v-if="invalidGoods.length">
|
||
|
||
</div>
|
||
|
||
<div class="footer">
|
||
<input type="checkbox" name="" title="全选" lay-skin="primary" lay-filter="allSelected" checked>
|
||
<ul class="operation">
|
||
<li>
|
||
<a class="" onclick="deleteCartSelected()">删除</a>
|
||
</li>
|
||
<!-- <li>
|
||
<a class="" onclick="clearInvalidGoods()">清除失效宝贝</a>
|
||
</li> -->
|
||
</ul>
|
||
<div class="sum-wrap">
|
||
<div class="selected-sum">
|
||
<span>已选商品</span>
|
||
<em class="total-count"></em>
|
||
<span>件</span>
|
||
</div>
|
||
<div class="price-wrap">
|
||
<span>合计（不含运费）：</span>
|
||
<strong class="ns-text-color">￥</strong>
|
||
</div>
|
||
|
||
<button class="layui-btn ns-bg-color" onclick="settlement()">结算</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</script>
|
||
{/block}
|
||
|
||
{block name="script"}
|
||
<script>
|
||
$(document).ready(function() {
|
||
var count = 0;
|
||
$.ajax({
|
||
url: ns.url("supply://shop/cart/count"),
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
if (res.code >= 0) {
|
||
count = res.data;
|
||
if (count > 0) {
|
||
$(".ns-cart-wrap").removeClass("layui-hide");
|
||
$(".null-cart").addClass("layui-hide");
|
||
} else {
|
||
$(".ns-cart-wrap").addClass("layui-hide");
|
||
$(".null-cart").removeClass("layui-hide");
|
||
}
|
||
}
|
||
}
|
||
})
|
||
})
|
||
|
||
var temp_array = {}, invalidGoods = [], siteIndex = "", goodsIndex = "", repeat_flag = false; //防重复标识
|
||
layui.use(['form', 'laytpl'], function() {
|
||
var form = layui.form,
|
||
laytpl = layui.laytpl;
|
||
|
||
$.ajax({
|
||
url: ns.url("supply://shop/cart/lists"),
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
if(checkLogin(res)) {
|
||
|
||
handleCartList(res.data);
|
||
|
||
if (JSON.stringify(temp_array) != "{}") {
|
||
laytpl($("#cartList").html()).render(temp_array, function (html) {
|
||
$(".ns-cart-list-wrap").html(html);
|
||
form.render();
|
||
});
|
||
}
|
||
|
||
totalSum();
|
||
|
||
$(".ns-goods-buy-num input").blur(function () {
|
||
var val = $(this).val(),
|
||
min_num = Number($(this).attr("data-min")),
|
||
max_num = Number($(this).attr("data-max")),
|
||
_price,
|
||
id = $(this).attr("data-id");
|
||
|
||
if(!verifyNum(val, min_num, max_num, this)){
|
||
return false;
|
||
}else{
|
||
goodsNum(id, val);
|
||
var that = this;
|
||
$.each(temp_array, function (index, item) {
|
||
if ($(that).attr("data-site") == index) {
|
||
$.each(item.goodsList, function (key, value) {
|
||
|
||
if ($(that).attr("data-sku") == key) {
|
||
var sku_id = $(that).attr("data-sku_id");
|
||
var price_json_item = price_json_data[sku_id];
|
||
var item_price = 0;
|
||
$.each(price_json_item, function(price_key, price_value) {
|
||
if (val >= price_value.num) {
|
||
item_price = price_value.price;
|
||
}
|
||
})
|
||
value.price = item_price;
|
||
$(that).parent().parent().parent().find('.price-text').text(item_price);
|
||
|
||
value.num = val;
|
||
value.total_price = (value.num * Number(value.price)).toFixed(2);
|
||
_price = value.total_price
|
||
}
|
||
})
|
||
}
|
||
})
|
||
|
||
$(".subtotal").each(function () {
|
||
var site_index = $(this).attr("data-site");
|
||
var goods_index = $(this).attr("data-sku");
|
||
|
||
if (site_index == $(that).attr("data-site") && goods_index == $(that).attr("data-sku")) {
|
||
$(this).text("￥" + _price);
|
||
}
|
||
})
|
||
|
||
totalSum();
|
||
}
|
||
|
||
|
||
|
||
})
|
||
}
|
||
}
|
||
});
|
||
|
||
// 监听复选框
|
||
form.on('checkbox(allSelected)', function(data) {
|
||
siteIndex = ""; goodsIndex = "";
|
||
if (data.elem.checked) {
|
||
$("input[lay-filter='allSelected']").prop("checked", true);
|
||
$("input[lay-filter='siteSelected']").prop("checked", true);
|
||
$("input[lay-filter='goodsSelected']").prop("checked", true);
|
||
form.render();
|
||
} else {
|
||
$("input[lay-filter='allSelected']").prop("checked", false);
|
||
$("input[lay-filter='siteSelected']").prop("checked", false);
|
||
$("input[lay-filter='goodsSelected']").prop("checked", false);
|
||
form.render();
|
||
}
|
||
|
||
renderTemp(siteIndex, goodsIndex, data.elem.checked);
|
||
totalSum();
|
||
});
|
||
|
||
form.on('checkbox(siteSelected)', function(data) {
|
||
siteIndex = $(data.elem).attr("data-site");
|
||
goodsIndex = ""
|
||
|
||
var siteSelectedNum = $(data.elem).parents(".list").find("input[lay-filter='siteSelected']:checked").length; // 被选中的店铺数量
|
||
var siteNum = $(data.elem).parents(".list").find(".item").length; // 店铺总数量
|
||
if (data.elem.checked) {
|
||
if (siteSelectedNum == siteNum) {
|
||
$("input[lay-filter='allSelected']").prop("checked", true);
|
||
}
|
||
$(data.elem).parents(".item").find("input[lay-filter='goodsSelected']").prop("checked", true);
|
||
form.render();
|
||
} else {
|
||
$("input[lay-filter='allSelected']").prop("checked", false);
|
||
$(data.elem).parents(".item").find("input[lay-filter='goodsSelected']").prop("checked", false);
|
||
form.render();
|
||
}
|
||
|
||
renderTemp(siteIndex, goodsIndex, data.elem.checked);
|
||
totalSum();
|
||
});
|
||
|
||
form.on('checkbox(goodsSelected)', function(data) {
|
||
var siteIndex = $(data.elem).attr("data-site");
|
||
var goodsIndex = $(data.elem).attr("data-sku");
|
||
var selectedNum = $(data.elem).parents(".item").find("input[lay-filter='goodsSelected']:checked").length; // 当前店铺被选中的商品数量
|
||
var goodsNum = $(data.elem).parents(".item").find("ul").length; // 当前店铺总商品数量
|
||
|
||
if (data.elem.checked) {
|
||
if (selectedNum == goodsNum) {
|
||
$(data.elem).parents(".item").find("input[lay-filter='siteSelected']").prop("checked", true);
|
||
|
||
var siteSelectedNum = $(data.elem).parents(".list").find("input[lay-filter='siteSelected']:checked").length; // 被选中的店铺数量
|
||
var siteNum = $(data.elem).parents(".list").find(".item").length; // 店铺总数量
|
||
|
||
if (siteSelectedNum == siteNum) {
|
||
$("input[lay-filter='allSelected']").prop("checked", true);
|
||
}
|
||
}
|
||
form.render();
|
||
} else {
|
||
$("input[lay-filter='allSelected']").prop("checked", false);
|
||
$(data.elem).parents(".item").find("input[lay-filter='siteSelected']").prop("checked", false);
|
||
form.render();
|
||
}
|
||
|
||
renderTemp(siteIndex, goodsIndex, data.elem.checked);
|
||
});
|
||
})
|
||
|
||
var price_json_data = {};
|
||
// 改变数据结构
|
||
function handleCartList(data) {
|
||
price_json_data = {};
|
||
$.each(data, function(index, item) {
|
||
if (item.goods_state == 1 && item.verify_state == 1) {
|
||
var price_json = JSON.parse(item.price_json);
|
||
price_json_data[item.sku_id] = price_json;
|
||
var index = 0;
|
||
$.each(price_json, function(key, value) {
|
||
if (item.num >= value.num) {
|
||
index = key
|
||
}
|
||
})
|
||
item.price = price_json[index].price;
|
||
item.total_price = (Number(item.price) * Number(item.num)).toFixed(2);
|
||
item.checked = true;
|
||
if (!temp_array.hasOwnProperty(item.site_id)) {
|
||
temp_array[item.site_id] = {
|
||
site_id: item.site_id,
|
||
site_name: item.site_name,
|
||
is_own: item.is_own,
|
||
goodsList: []
|
||
}
|
||
}
|
||
temp_array[item.site_id].goodsList.push(item);
|
||
} else {
|
||
invalidGoods.push(item);
|
||
}
|
||
});
|
||
}
|
||
|
||
// 总数量和总价格
|
||
function totalSum() {
|
||
var total_num = 0, total_price = 0;
|
||
$.each(temp_array, function(index, item) {
|
||
$.each(item.goodsList, function(goodsIndex, goodsItem) {
|
||
if (goodsItem.checked) {
|
||
total_price += Number(goodsItem.total_price);
|
||
total_num++;
|
||
}
|
||
})
|
||
})
|
||
|
||
$(".sum-wrap .total-count").text(total_num);
|
||
$(".sum-wrap .price-wrap strong").text("￥" + total_price.toFixed(2));
|
||
|
||
if (total_num == 0) {
|
||
$(".sum-wrap>.layui-btn").addClass("layui-btn-disabled");
|
||
$(".sum-wrap>.layui-btn").removeClass("ns-bg-color");
|
||
} else {
|
||
$(".sum-wrap>.layui-btn").removeClass("layui-btn-disabled");
|
||
$(".sum-wrap>.layui-btn").addClass("ns-bg-color");
|
||
}
|
||
}
|
||
|
||
// 重新整理数据
|
||
function renderTemp(siteIndex, goodsIndex, flag) {
|
||
$.each(temp_array, function(index, item) {
|
||
if (siteIndex && goodsIndex) {
|
||
if (index == siteIndex) {
|
||
$.each(item.goodsList, function(key, value) {
|
||
if (key == goodsIndex) {
|
||
value.checked = flag;
|
||
}
|
||
})
|
||
}
|
||
} else if (siteIndex && !goodsIndex) {
|
||
if (index == siteIndex) {
|
||
$.each(item.goodsList, function(key, value) {
|
||
value.checked = flag;
|
||
})
|
||
}
|
||
} else {
|
||
$.each(item.goodsList, function(key, value) {
|
||
value.checked = flag;
|
||
})
|
||
}
|
||
})
|
||
|
||
totalSum();
|
||
}
|
||
|
||
// 商品详情
|
||
function goodsDetail(id) {
|
||
location.href = ns.url("supply://shop/goods/detail", {
|
||
sku_id: id
|
||
});
|
||
}
|
||
|
||
// 删除商品
|
||
function deleteCart(id, siteIndex, goodsIndex) {
|
||
layer.confirm('是否将该商品从供货单中删除？', function(index){
|
||
if (repeat_flag) return;
|
||
repeat_flag = true;
|
||
|
||
delCartGoods(id);
|
||
repeat_flag = false;
|
||
|
||
$(".item ul").each(function() {
|
||
var site_index = $(this).attr("data-site"), goods_index = $(this).attr("data-sku");
|
||
if (site_index == siteIndex && goods_index == goodsIndex) {
|
||
$(this).remove();
|
||
}
|
||
})
|
||
|
||
$(".item").each(function() {
|
||
if ($(this).find("ul").length == 0) {
|
||
$(this).remove();
|
||
}
|
||
})
|
||
|
||
delTemp(siteIndex, goodsIndex, "", "");
|
||
}, function() {
|
||
repeat_flag = false;
|
||
layer.close();
|
||
});
|
||
}
|
||
|
||
// 删除多个
|
||
function deleteCartSelected() {
|
||
var id_arr = [], input_arr = [];
|
||
$("input[lay-filter='goodsSelected']:checked").each(function(index, item) {
|
||
id_arr.push($(item).attr("data-cart_id"));
|
||
input_arr.push($(item));
|
||
})
|
||
|
||
layer.confirm('是否将商品从供货单中删除？', function(index){
|
||
if (repeat_flag) return;
|
||
repeat_flag = true;
|
||
|
||
delCartGoods(id_arr.toString());
|
||
repeat_flag = false;
|
||
|
||
$.each(input_arr, function(index, item) {
|
||
var siteIndex = $(item).attr("data-site"), goodsIndex = $(item).attr("data-sku"), siteId = $(item).attr("data-site_id"), cartId = $(item).attr("data-cart_id");
|
||
$(".item ul").each(function(key, value) {
|
||
var site_index = $(value).attr("data-site"), goods_index = $(value).attr("data-sku");
|
||
if (site_index == siteIndex && goods_index == goodsIndex) {
|
||
$(value).remove();
|
||
}
|
||
})
|
||
|
||
$(".item").each(function() {
|
||
if ($(this).find("ul").length == 0) {
|
||
$(this).remove();
|
||
}
|
||
})
|
||
delTemp(siteIndex, goodsIndex, siteId, cartId);
|
||
})
|
||
}, function() {
|
||
repeat_flag = false;
|
||
layer.close();
|
||
});
|
||
}
|
||
|
||
// 删除购物车商品
|
||
function delCartGoods(id) {
|
||
$.ajax({
|
||
url: ns.url("supply://shop/cart/delete"),
|
||
data: {"cart_id": id},
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
async: false,
|
||
success: function(res) {
|
||
if(checkLogin(res)) {
|
||
layer.msg(res.message);
|
||
$.ajax({
|
||
url: ns.url("supply://shop/cart/count"),
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function (res) {
|
||
if (res.code >= 0) {
|
||
var count = res.data;
|
||
if (count == 0) {
|
||
$(".ns-cart-wrap").addClass("layui-hide");
|
||
$(".null-cart").removeClass("layui-hide");
|
||
location.href = ns.url("supply://shop/cart/cart", {"count": 0});
|
||
}
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
// 删除数据
|
||
function delTemp(siteIndex, goodsIndex, siteId, cartId) {
|
||
if (!siteId && !cartId) {
|
||
var arr = temp_array[siteIndex].goodsList.splice(goodsIndex, 1);
|
||
if (temp_array[siteIndex].goodsList.length == 0) {
|
||
delete temp_array[siteIndex];
|
||
}
|
||
} else {
|
||
var temp_site = "", temp_cart = "";
|
||
$.each(temp_array, function(site, site_v) {
|
||
$.each(site_v.goodsList, function(cart, cart_v) {
|
||
if (cartId == cart_v.cart_id) {
|
||
temp_site = site_v;
|
||
temp_cart = cart;
|
||
}
|
||
if (site_v.goodsList.length == 0) {
|
||
temp_array.splice(site, 1)
|
||
}
|
||
})
|
||
})
|
||
temp_site.goodsList.splice(temp_cart, 1)
|
||
}
|
||
|
||
totalSum();
|
||
}
|
||
|
||
// 购买数量验证
|
||
function verifyNum(val, min_num, max_num, el) {
|
||
if (val % 1 != 0 || val < 0) {
|
||
layer.msg("购买数量必须为大于0的整数");
|
||
return false;
|
||
}
|
||
|
||
if (val < min_num) {
|
||
layer.msg("请至少购买"+ min_num +"件商品");
|
||
$(el).val(min_num);
|
||
$(el).blur();
|
||
return false;
|
||
}
|
||
|
||
if (val > max_num) {
|
||
layer.msg("库存不足");
|
||
$(el).val(max_num);
|
||
return false;
|
||
}
|
||
return true;
|
||
}
|
||
|
||
function changeNum(siteIndex, goodsIndex, str, id) {
|
||
var el, val, min_num, max_num, site_index, goods_index, _price;
|
||
$("input[name='buy_num']").each(function(index, item) {
|
||
site_index = $(item).attr("data-site");
|
||
goods_index = $(item).attr("data-sku");
|
||
|
||
if (site_index == siteIndex && goods_index == goodsIndex) {
|
||
el = item;
|
||
val = Number($(item).val());
|
||
min_num = Number($(item).attr("data-min"));
|
||
max_num = Number($(item).attr("data-max"));
|
||
}
|
||
});
|
||
|
||
if (str == 'up') {
|
||
val++;
|
||
} else {
|
||
val--;
|
||
}
|
||
|
||
|
||
|
||
$(el).val(val);
|
||
if(!verifyNum(val, min_num, max_num, el)){
|
||
return false;
|
||
}else{
|
||
goodsNum(id, val);
|
||
$.each(temp_array, function(index, item) {
|
||
if (siteIndex == index) {
|
||
$.each(item.goodsList, function(key, value) {
|
||
if (goodsIndex == key) {
|
||
|
||
var sku_id = $(el).attr("data-sku_id");
|
||
var price_json_item = price_json_data[sku_id];
|
||
|
||
var item_price = 0;
|
||
$.each(price_json_item, function(price_key, price_value) {
|
||
if (val >= price_value.num) {
|
||
item_price = price_value.price;
|
||
}
|
||
})
|
||
value.price = item_price;
|
||
|
||
$(el).parent().parent().parent().find('.price-text').text(item_price);
|
||
|
||
value.num = val;
|
||
value.total_price = (value.num * Number(value.price)).toFixed(2);
|
||
_price = value.total_price
|
||
}
|
||
})
|
||
}
|
||
})
|
||
|
||
$(".subtotal").each(function() {
|
||
var site_index = $(this).attr("data-site");
|
||
var goods_index = $(this).attr("data-sku");
|
||
|
||
if (site_index == siteIndex && goods_index == goodsIndex) {
|
||
$(this).text("￥" + _price);
|
||
}
|
||
})
|
||
|
||
totalSum();
|
||
}
|
||
|
||
|
||
}
|
||
|
||
// 改变购买数量
|
||
function goodsNum(id, val) {
|
||
|
||
if (repeat_flag) return;
|
||
repeat_flag = true;
|
||
|
||
$.ajax({
|
||
url: ns.url("supply://shop/cart/edit"),
|
||
data: {"cart_id": id, "num": val},
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
repeat_flag = false;
|
||
if(checkLogin(res)) {
|
||
if (res.code < 0) {
|
||
layer.msg(res.message);
|
||
}
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
// 结算
|
||
function settlement() {
|
||
var cart_id_arr = [], num = 0, sku_id = "";
|
||
$.each(temp_array, function(siteIndex, siteItem) {
|
||
$.each(siteItem.goodsList, function(goodsIndex, goodsItem) {
|
||
if (goodsItem.checked) {
|
||
cart_id_arr.push(goodsItem.cart_id);
|
||
}
|
||
})
|
||
})
|
||
|
||
location.href = ns.url("supply://shop/ordercreate/payment", {"cart_ids": cart_id_arr.toString()})
|
||
}
|
||
</script>
|
||
{/block}
|