@extends('layouts.app')

@section('content')

    <!-- Start Page Header Wrapper -->
    <div class="page-header-wrapper">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <div class="page-header-content">
                        <h2>Shopping Cart</h2>
                        <nav class="page-breadcrumb">
                            <ul class="d-flex justify-content-center">
                                <li><a href="{{route('index')}}">Home</a></li>
                                <li><a href="{{route('products.userIndex')}}">Products</a></li>
                                <li><a href="{{route('userCart')}}" class="active">Cart</a></li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Page Header Wrapper -->

    <!--== Start Cart Page Wrapper ==-->
    <div id="cart-page-wrapper" class="pt-86 pt-md-56 pt-sm-46 pb-50 pb-md-20 pb-sm-10">
        <div class="container">
            @if(session()->has('cart') && count(session('cart')) > 0)
            <div class="row">
                <div class="col-lg-8">
                    <div class="shopping-cart-list-area">
                        <div class="shopping-cart-table table-responsive">
                            <table class="table table-bordered text-center">
                                <thead>
                                <tr>
                                    <th>Product</th>
                                    <th>Price</th>
                                    <th>Quantity</th>
                                    <th>Total</th>
                                </tr>
                                </thead>

                                <tbody>
                                @if(session()->has('cart'))
                                    @foreach(session('cart') as $key => $cartItem)
                                        <!-- Start Single Product -->
                                        <tr>
                                            <td class="product-list" id="item-{{$key}}" data-price="{{$cartItem['cost']}}">
                                                <div class="cart-product-item d-flex align-items-center">
                                                    <div class="remove-icon">
                                                        <form action="{{route('cart.remove', $key)}}" method="POST">
                                                            @csrf
                                                            <button><i class="fa fa-trash-o" data-product_id="{{$key}}"></i></button>
                                                        </form>
                                                    </div>
                                                    <a href="{{route('products.showUser', $key)}}" class="product-thumb">
                                                        <img src="{{asset($cartItem['photo'])}}" alt="{{$cartItem['name']}}">
                                                    </a>

                                                    <a href="{{route('products.showUser', $key)}}" class="product-name">
                                                        {{$cartItem['name']}}
                                                    </a>
                                                </div>
                                            </td>
                                            <td>
                                                <span class="price">{{$cartItem['price']}}</span>
                                            </td>
                                            <td>
                                                <div class="pro-qty">
                                                    <input type="text" class="quantity" data-product_id="{{$key}}" data-cost="{{$cartItem['cost'] * $cartItem['quantity']}}" value="{{$cartItem['quantity']}}"/>
                                                </div>
                                            </td>
                                            <td>
                                                <span class="price"><span id="currency-{{$key}}">NGN</span> <span id="total-quantity-price-{{$key}}">{{number_format($cartItem['cost'] * $cartItem['quantity'])}} </span></span>
                                            </td>
                                        </tr>
                                        <!-- End Single Product -->
                                    @endforeach
                                @endif
                                </tbody>
                            </table>
                        </div>

                        <div class="cart-coupon-update-area d-sm-flex justify-content-between align-items-center">
{{--                            <div class="coupon-form-wrap">--}}
{{--                                <form action="#" method="post">--}}
{{--                                    <input type="text" placeholder="Coupon Code"/>--}}
{{--                                    <button class="btn-apply">Apply Button</button>--}}
{{--                                </form>--}}
{{--                            </div>--}}

                            <div class="cart-update-buttons mt-xs-14">
{{--                                <form action=""></form>--}}
                                <a href="{{route('cart.removeall')}}" class="btn-clear-cart font-weight-bold text-dark">Clear Cart</a>
{{--                                <button class="btn-update-cart">Update Cart</button>--}}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-4">
                    <!-- Cart Calculate Area -->
                    <div class="cart-calculate-area mt-sm-30 mt-md-30">
                        <h5 class="cal-title">Cart Totals</h5>

                        <div class="cart-cal-table table-responsive">
                            <table class="table table-borderless">
                                <tr class="cart-sub-total">
                                    <th>Subtotal</th>
                                    <td id="totalCartPrice" data-total="{{\App\Entities\Carts\Cart::totalPrice()}}"><span class="currency">NGN</span> <span id="cartSubtotal">{{number_format(\App\Entities\Carts\Cart::totalPrice())}}.00</span></td>
                                </tr>
                                <tr class="cart-sub-total">
                                    <th>Delivery Fee</th>
                                    <td>
                                        NGN {{number_format(\App\Entities\Carts\Cart::$delivery)}}
                                    </td>
                                </tr>
                                <tr class="shipping">
                                    <td>
                                        <ul class="shipping-method">
                                            @if(\App\Entities\Carts\Cart::$freeShipping)
                                            <li>
                                                <div class="custom-control custom-radio">
                                                    <input type="radio" id="free_shipping" name="shipping_method"
                                                           class="custom-control-input"/>
                                                    <label class="custom-control-label" for="free_shipping">Free
                                                        Shipping</label>
                                                </div>
                                            </li>
                                            @endif
                                        </ul>
                                    </td>
                                </tr>
                                <tr class="order-total">
                                    <th>Total</th>
                                    <td><b><span class="currency">NGN</span> <span id="totalPlusDelivery">{{number_format(\App\Entities\Carts\Cart::totalPrice() + \App\Entities\Carts\Cart::$delivery)}}.00</span></b></td>
                                </tr>
                            </table>
                        </div>

                        <div class="proceed-checkout-btn">
                            <a href="{{route('checkout')}}" class="btn btn-full btn-black">Proceed to Checkout</a>
                        </div>
                    </div>
                </div>
            </div>
            @else
                <div class="row">
                    <div class="col-lg-12 text-center">
                        <h1 class="mb-5">Cart is Empty</h1>
                        <p>You don't have any product in cart yet!</p>
                    </div>
                </div>
            @endif
        </div>
    </div>
    <!--== End Cart Page Wrapper ==-->


    @include('includes.productfooter')

@endsection