{include file="./app/home/view/mobile/head.html" /}
<div class="body gray-bg">
    <div class="header">
        <div class="menu">
            <a onclick="javascript:window.history.back();return false;" class="back-btn"></a>
        </div>
        <div class="logo">购物车</div>
        <div class="user"><a href="{:url('user/index/index')}"></a></div>
    </div>
    <div class="wrap">
        <form action="{:url('user/cart/submit')}" method="post">
            <div class="goods-list cart">
                <ul>
                    {volist name="list" id="vo"}
                    <li data-id="{$vo.cid}" data-pid="{$vo.id}" data-price="{$vo.price}">
                        <div class="ch-btn"><input type="checkbox" name="id[]" id="cart{$vo.cid}" value="{$vo.cid}"><label for="cart{$vo.cid}"></label></div>
                        <div class="left"><a href="{:url('home/product/info',array('id'=>$vo['id'],'catId'=>$vo['catid']))}"><img src="{:imgUrl($vo.thumb)}" alt="{$vo.title}"></a><!--<i>热卖</i>--></div>
                        <div class="num">
                            <span>数量：</span>
                            <div class="input">
                                <input type="button" class="min" value="-">
                                <input type="text" name="num" class="number" value="{$vo.number}" />
                                <input type="button" class="add" value="+">
                            </div>
                        </div>
                        <div class="right">
                            <p class="tit">{$vo.title}</p>
                            <p class="des">{$vo.intro}</p>
                            <p class="price">￥<span>{:number_format($vo.price * $vo.number,2)}</span></p>
                            <p class="buy-btn"></p>
                        </div>
                    </li>
                    {/volist}
                </ul>
            </div>
            <div class="cart-foot">
                <span class="all">全选</span>
                <span class="del" onclick="del_all(this)">删除选中商品</span>
                <div class="cart-info">
                    <p>选中商品<span>0</span>件</p>
                    <p>数量：<span>0</span></p>
                    <p class="price">总价：￥<span id="totalPrice">0</span></p>
                </div>
                <button type="submit" class="submit" onclick="return sub();">提交订单</button>
            </div>
        </form>
    </div>
    <script>
        function sub(){
            if(cart.totalItem <= 0) {
                layer.open({
                    content: "请选择产品"
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
                return false;
            }
        }
        var cart = {
            totalPrice : 0,
            totalNumber : 0,
            totalItem : 0,
            'checked' : function(elem){
                var num = $(elem).parents("li").children("div.num").children("div.input").find("input[name=num]").val();
                //var num = 1;
                var prices = $(elem).parents("li").children("div.right").children("p.price").find("span").text();
                if ($(elem).is(":checked")){
                    cart.totalNumber += parseInt(num);
                    cart.totalPrice += parseFloat(prices);
                    cart.totalItem++;
                } else {
                    cart.totalNumber -= parseInt(num);
                    cart.totalPrice -= parseFloat(prices);
                    cart.totalItem--;
                }
            }
        };

        $(function(){
            //立即购买
            $(".buy-btn").click(function(){
                var num = $(this).parent().prev().find(".number").val();
                var product_id = $(this).parent().parent().data("pid");
                location.href = "{:url('user/cart/buy')}?product_id=" + product_id + "&num=" + num;
            });

            //产品加减
            $("input.add").click(function(){
                var id = $(this).parents("li").data("id");
                var num = $(this).siblings("input[name='num']").val();
                num = parseInt(num) + 1;
                //修改远程数据
                changeNum(id, num);
                //设置数量
                $(this).siblings("input[name='num']").val(num);
                //设置小计
                var price = $(this).parents("li").data("price");
                var sprice = parseFloat(price) * num;
                $(this).parents("li").find("p.price").find("span").html(sprice.toFixed(2));
                $("input[type='checkbox']").removeAttr("checked");
                cart.totalPrice = 0;
                cart.totalNumber = 0;
                cart.totalItem = 0;
                $("#totalPrice").html(cart.totalPrice).parent().siblings().find("font").html(cart.totalNumber);
            });

            $("input.min").click(function(){
                var id = $(this).parents("li").data("id");
                var num = $(this).siblings("input[name='num']").val();
                var number = parseInt(num) - 1;
                if (number <= 1) number = 1;
                //修改远程数据
                changeNum(id, number);
                //设置数量
                $(this).siblings("input[name='num']").val(number);
                //设置小计
                var price = $(this).parents("li").data("price");
                var sprice = parseFloat(price) * number;
                $(this).parents("li").find("p.price").find("span").html(sprice.toFixed(2));
                $("input[type='checkbox']").removeAttr("checked");
                cart.totalPrice = 0;
                cart.totalNumber = 0;
                cart.totalItem = 0;
                $("#totalPrice").html(cart.totalPrice).parent().siblings("p").find("span").html(cart.totalNumber);
            });

            $("input[name='num']").change(function(){
                var number = $(this).val();
                var id = $(this).parents("li").data("id");
                changeNum(id, number);
            });

            //全选中
            $("span.all").click(function(){
                cart.totalPrice = 0;
                cart.totalNumber = 0;
                cart.totalItem = 0;
                if ($(this).hasClass("checked")) {
                    //设置全部为选中
                    $(this).removeClass("checked");
                    $("input[type='checkbox']").removeAttr("checked");
                } else {
                    //设置全部为不选中
                    $(this).addClass("checked");
                    $("input[type='checkbox']").prop("checked","true");
                    $("input[type='checkbox']").each(function(ii, nn){
                        cart.checked(nn);
                    });
                }

                $("#totalPrice").html(cart.totalPrice).parent().siblings("p:eq(0)").find("span").html(cart.totalItem);
                $("#totalPrice").parent().siblings("p:eq(1)").find("span").html(cart.totalNumber)
            });

            //复选框单选
            $("input[type=checkbox]").each(function(i, n){
                $(n).click(function(){
                    cart.checked(this);
                    $("#totalPrice").html(cart.totalPrice).parent().siblings("p:eq(0)").find("span").html(cart.totalItem);
                    $("#totalPrice").parent().siblings("p:eq(1)").find("span").html(cart.totalNumber)
                });
            });
        });

        var changeNum = function(id, num){
            $.post("{:url('user/cart/value')}", {'id':id,'number':num}, function(data){
                if (data.code == 1) {
                    window.location.reload();
                } else {
                    layer.open({
                        content: data.msg
                        ,skin: 'msg'
                        ,time: 2 //2秒后自动关闭
                    })
                }
            }, 'json');
        };

        function del_all(elem){
            var id = [];
            $("input[type=checkbox]").each(function(ii, nn){
                if ($(nn).is(":checked")){
                    id.push($(nn).val());
                }
            });

            id = id.join(",");
            if (id == '') {
                layer.open({
                    content: "请选择产品"
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
                return false;
            }

            $(elem).data("id", id);
            this_confirm('del_cart', elem);
        }

        var del_cart = function(index){
            var id = $(index).data("id");

            $.post("{:url('user/cart/del')}", {'id':id}, function(data){
                if (data.code == 1) {
                    layer.open({
                        content: data.msg
                        ,skin: 'msg'
                        ,time: 2 //2秒后自动关闭
                    });
                    location.reload();
                } else {
                    layer.open({
                        content: data.msg
                        ,skin: 'msg'
                        ,time: 2 //2秒后自动关闭
                    });
                }
            }, 'json');
        };
    </script>
{include file="./app/home/view/mobile/foot.html" /}