{include file="./app/home/view/web/common_head.html" /}
<div class="user-info">
    <div class="center">
        <div class="menu">
            <ul>
                <li><a href="{:url('user/index/index')}">会员信息</a></li>
                <li><a href="{:url('set/repass')}">密码管理</a></li>
                <li><a href="{:url('index/service')}">售后服务</a></li>
                <li><a href="{:url('index/address')}">收货地址</a></li>
                <li><a href="{:url('order/index')}">我的订单</a></li>
                <li class="active"><a href="{:url('cart/index')}">购物车</a></li>
            </ul>
        </div>
        <div class="pos">购物车</div>
        <div class="main cart">
            <div class="public-title">全部商品
                <div class="right"><a href="javascript:;" onclick="del_all(this)">删除选中商品</a><span>全选</span><input type="checkbox" id="all"><label for="all"></label></div>
            </div>
            <form action="{:url('user/cart/submit')}" method="post">
                <table class="order-list">
                    <tr class="order-list-title">
                        <th width="360">商品</th>
                        <th width="180">数量</th>
                        <th width="200">单价（元）</th>
                        <th width="180">小计</th>
                        <th width="180">操作</th>
                        <th width="100"></th>
                    </tr>
                    {volist name="list" id="vo"}
                    <tr class="list" data-id="{$vo.cid}">
                        <td>
                            <img src="{:imgUrl($vo.thumb)}" alt="{$vo.title}">
                            <a href="{:url('home/product/info',array('id'=>$vo['id'],'catId'=>$vo['catid']))}" target="_blank">{$vo.title}</a>
                        </td>
                        <td class="goods-num">
                            <input type="button" class="min" value="-">
                            <input type="text" name="num" class="num" value="{$vo.number}">
                            <input type="button" class="add" value="+">
                        </td>
                        <td>￥<span>{$vo.price}</span></td>
                        <td>￥<span>{:number_format($vo.price * $vo.number,2)}</span></td>
                        <td><a href="javascript:;" data-id="{$vo.cid}" class="del" onclick="this_confirm('del_cart', this);">删除</a></td>
                        <td class="checkbox"><input type="checkbox" name="id[]" id="cart{$vo.cid}" value="{$vo.cid}"><label for="cart{$vo.cid}"></label></td>
                    </tr>
                    {/volist}
                </table>
                <div class="cart-bot">
                    <p class="price">总价：￥<span id="totalPrice">0</span></p>
                    <p class="btn"><span>选中商品数<font>0</font></span> <button type="submit">提交订单</button></p>
                </div>
            </form>
        </div>
    </div>
</div>
<script type="text/javascript" src="__HOME__/js/user.js"></script>
<script>
    var cart = {
        totalPrice : 0,
        totalNumber : 0,
        'checked' : function(elem){
            //var num = $(elem).parents("tr").children("td:eq(1)").children("input:eq(1)").val();
            var num = 1;
            var prices = $(elem).parents("tr").children("td:eq(3)").find("span").text();
            if ($(elem).is(":checked")){
                cart.totalNumber += parseInt(num);
                cart.totalPrice += parseFloat(prices);
            } else {
                cart.totalNumber -= parseInt(num);
                cart.totalPrice -= parseFloat(prices);
            }
        }
    };

    $(function(){
        //产品加减
        $("input.add").click(function(){
            var id = $(this).parents("tr").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("tr").children("td:eq(2)").find("span").text();
            var sprice = parseFloat(price) * num;
            $(this).parents("tr").children("td:eq(3)").find("span").html(sprice.toFixed(2));
            $("input[type='checkbox']").removeAttr("checked");
            cart.totalPrice = 0;
            cart.totalNumber = 0;
            $("#totalPrice").html(cart.totalPrice).parent().siblings().find("font").html(cart.totalNumber);
        });

        $("input.min").click(function(){
            var id = $(this).parents("tr").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("tr").children("td:eq(2)").find("span").text();
            var sprice = parseFloat(price) * number;
            $(this).parents("tr").children("td:eq(3)").find("span").html(sprice.toFixed(2));
            $("input[type='checkbox']").removeAttr("checked");
            cart.totalPrice = 0;
            cart.totalNumber = 0;
            $("#totalPrice").html(cart.totalPrice).parent().siblings().find("font").html(cart.totalNumber);
        });

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

        //复选框选中
        $("input[type=checkbox]").each(function(i, n){
            $(n).click(function(){
                if (i > 0) {
                    cart.checked(this);
                } else {
                    //i == 0 全选
                    cart.totalPrice = 0;
                    cart.totalNumber = 0;
                    if ($(this).is(":checked")) {
                        //设置全部为不选中
                        $("input[type='checkbox']").attr("checked","true");
                        $("input[type=checkbox]").each(function(ii, nn){
                            if (ii > 0) {
                                cart.checked(nn);
                            }
                        });
                    } else {
                        //设置全部为选中
                        $("input[type='checkbox']").removeAttr("checked");
                    }


                }

                $("#totalPrice").html(cart.totalPrice).parent().siblings().find("font").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.msg(data.msg, {"icon" : 2});
            }
        }, 'json');
    };

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

        $.post("{:url('user/cart/del')}", {'id':id}, function(data){
            if (data.code == 1) {
                layer.msg(data.msg, {'icon':1});
                location.reload();
            } else {
                layer.msg(data.msg, {'icon':2});
            }
        }, 'json');
    };

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

        id = id.join(",");
        if (id == '') {
            layer.msg("请选择产品", {"icon":2});
            return false;
        }

        $(elem).data("id", id);
        this_confirm('del_cart', elem);
    };
</script>
{include file="./app/home/view/web/common_footer.html" /}