@extends('layouts.app')
@section('content')
<!-- page-title -->
<div class="tf-page-title">
    <div class="container-full">
        <div class="heading text-center">Shopping Cart</div>
    </div>
</div>
<!-- /page-title -->

<!-- page-cart -->
<section class="flat-spacing-11">
    <div class="container">
        <!-- <div class="tf-page-cart text-center mt_140 mb_200">
            <h5 class="mb_24">Your cart is empty</h5>
            <p class="mb_24">You may check out all the available products and buy some in the shop</p>
            <a href="#" class="tf-btn btn-sm radius-3 btn-fill btn-icon animate-hover-btn">Return to shop<i class="icon icon-arrow1-top-left"></i></a>
        </div> -->
        <!--<div class="tf-cart-countdown">-->
        <!--    <div class="title-left">-->
        <!--        <svg class="d-inline-block" xmlns="http://www.w3.org/2000/svg" width="16" height="24" viewBox="0 0 16 24" fill="rgb(219 18 21)">-->
        <!--            <path fill-rule="evenodd" clip-rule="evenodd" d="M10.0899 24C11.3119 22.1928 11.4245 20.2409 10.4277 18.1443C10.1505 19.2691 9.64344 19.9518 8.90645 20.1924C9.59084 18.2379 9.01896 16.1263 7.19079 13.8576C7.15133 16.2007 6.58824 17.9076 5.50148 18.9782C4.00436 20.4517 4.02197 22.1146 5.55428 23.9669C-0.806588 20.5819 -1.70399 16.0418 2.86196 10.347C3.14516 11.7228 3.83141 12.5674 4.92082 12.8809C3.73335 7.84186 4.98274 3.54821 8.66895 0C8.6916 7.87426 11.1062 8.57414 14.1592 12.089C17.4554 16.3071 15.5184 21.1748 10.0899 24Z"></path>-->
        <!--        </svg>-->
        <!--        <p>These products are limited, checkout within </p>-->
        <!--    </div>-->
        <!--    <div class="js-countdown timer-count" data-timer="600" data-labels="d:,h:,m:,s"></div>-->
        <!--</div>-->
        <div class="tf-page-cart-wrap">
            <div class="tf-page-cart-item">
                <form>
                    <table class="tf-table-page-cart">
                        <thead>
                            <tr>
                                <th>Product</th>
                                <th>Price</th>
                                <th>Quantity</th>
                                <th>Total</th>
                            </tr>
                        </thead>
                        <tbody id="page-cart">


                            @if($cart_checker)

                                @if(empty($cart_query))
                                <div class="text-center">No Items in Your Cart</div>
                                @else
                                    @foreach($cart_query as $cart_item_id => $cart_item)
                                        <tr class="tf-cart-item file-delete">
                                            <td class="tf-cart-item_product">
                                                <a href="javascript:void(0)" class="img-box">
                                                    <img src="{{url('storage/admin/shop-bo/'.$cart_item->image)}}" alt="img-product">
                                                </a>
                                                <div class="cart-info">
                                                    <a href="javascript:void(0)" class="cart-title link">{{$cart_item->name}}</a>
                                                    <span class="text-muted">{{$cart_item->attribute_value}}</span>

                                                     <div class="tf-mini-cart-remove"><a href="#" onclick="remove_from_cart(this)" data-cart-item-id="{{Crypt::encrypt($cart_item_id)}}">Remove</a></div>
                                                </div>
                                            </td>
                                            <td class="tf-cart-item_price" cart-data-title="Price">
                                                <div class="cart-price" data-cart-price="{{$cart_item->prices[0]->price}}">₱{{number_format($cart_item->prices[0]->price,2)}}</div>
                                            </td>
                                            <td class="tf-cart-item_quantity" cart-data-title="Quantity">
                                                <div class="tf-mini-cart-btns" data-checker="view-page">
                                                    <div class="wg-quantity">
                                                        <div class="wg-quantity small">
                                                            <span class="btn-quantity quantity-minus-btn">-</span>
                                                            <input class="product-quantity" style="width:100%"type="text" name="number" value="{{$cart_item->cart_quantity}}" onchange="update_cart_item(this)" data-cart-product-price="{{$cart_item->prices[0]->price}}"  data-cart-item-id="{{Crypt::encrypt($cart_item->id.'_'.$cart_item->prices[0]->shop_attribute_values_id)}}">
                                                            <span class="btn-quantity quantity-plus-btn">+</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="tf-cart-item_total" cart-data-title="Total">
                                                <div class="cart-total price">₱{{number_format(($cart_item->prices[0]->price*$cart_item->cart_quantity),2)}}</div>
                                            </td>
                                        </tr>

                                    @endforeach
                                @endif

                            @else
                                @if(empty($cart['items']))
                                <div class="text-center">No Items in Your Cart</div>
                                @else
                                @foreach($cart['items'] as $product_id => $cart_item)

                                <tr class="tf-cart-item file-delete tf-cart-item">
                                    <td class="tf-cart-item_product">
                                        <a href="{{route('shop.product.view',['id'=>Crypt::encrypt($cart_item['product_id'])])}}" class="img-box">
                                            <img src="{{url('storage/admin/shop-bo/'.$cart_item['image'])}}" alt="img-product">
                                        </a>
                                        <div class="cart-info">
                                            <a href="{{route('shop.product.view',['id'=>Crypt::encrypt($cart_item['product_id'])])}}" class="cart-title link">{{$cart_item['name']}}</a>
                                            <span class="text-muted">{{$cart_item['attribute_value']}}</span>
                                            <span class="remove-cart link remove">Remove</span>
                                        </div>
                                    </td>
                                    <td class="tf-cart-item_price" cart-data-title="Price">
                                        <input type="hidden" id="product_price_{{$cart_item['product_id']}}" value="{{$cart_item['price']}}">
                                        <div class="cart-price" data-cart-price="{{$cart_item['price']}}">₱{{number_format($cart_item['price'],2)}}</div>
                                    </td>
                                    <td class="tf-cart-item_quantity" cart-data-title="Quantity">
                                        <div class="cart-quantity tf-mini-cart-btns" data-checker="view-page-offline">
                                            <div class="wg-quantity small">
                                                <span class="btn-quantity quantity-minus-btn">-</span>
                                                <input class="product-quantity numbers-only" readonly style="width:100%" type="text" name="number" value="{{$cart_item['quantity']}}" onchange="update_cart_item(this)" data-cart-product-price="{{$cart_item['price']}}" data-cart-pid="{{$cart_item['product_id']}}" data-cart-item-id="{{Crypt::encrypt($product_id)}}">
                                                <span class="btn-quantity quantity-plus-btn">+</span>
                                            </div>
                                        </div>
                                    </td>
                                    <td class="tf-cart-item_total" cart-data-title="Total">
                                        <div class="cart-total price" id="subtotal_{{$cart_item['product_id']}}">₱{{number_format($cart_item['total_price'],2)}}</div>
                                    </td>
                                </tr>
                                @endforeach
                                @endif
                            @endif
                        </tbody>
                    </table>
                    <div class="tf-page-cart-note">
                        <label for="cart-note">Add Order Note</label>
                        <textarea name="note" id="cart-note" placeholder="How can we help you?"></textarea>
                    </div>
                </form>
            </div>
            <div class="tf-page-cart-footer">
                <div class="tf-cart-footer-inner">
                    <!--<div class="tf-free-shipping-bar">-->
                    <!--    <div class="tf-progress-bar">-->
                    <!--        <span style="width: 50%;">-->
                    <!--            <div class="progress-car">-->
                    <!--                <svg xmlns="http://www.w3.org/2000/svg" width="21" height="14" viewBox="0 0 21 14" fill="currentColor">-->
                    <!--                    <path fill-rule="evenodd" clip-rule="evenodd" d="M0 0.875C0 0.391751 0.391751 0 0.875 0H13.5625C14.0457 0 14.4375 0.391751 14.4375 0.875V3.0625H17.3125C17.5867 3.0625 17.845 3.19101 18.0104 3.40969L20.8229 7.12844C20.9378 7.2804 21 7.46572 21 7.65625V11.375C21 11.8582 20.6082 12.25 20.125 12.25H17.7881C17.4278 13.2695 16.4554 14 15.3125 14C14.1696 14 13.1972 13.2695 12.8369 12.25H7.72563C7.36527 13.2695 6.39293 14 5.25 14C4.10706 14 3.13473 13.2695 2.77437 12.25H0.875C0.391751 12.25 0 11.8582 0 11.375V0.875ZM2.77437 10.5C3.13473 9.48047 4.10706 8.75 5.25 8.75C6.39293 8.75 7.36527 9.48046 7.72563 10.5H12.6875V1.75H1.75V10.5H2.77437ZM14.4375 8.89937V4.8125H16.8772L19.25 7.94987V10.5H17.7881C17.4278 9.48046 16.4554 8.75 15.3125 8.75C15.0057 8.75 14.7112 8.80264 14.4375 8.89937ZM5.25 10.5C4.76676 10.5 4.375 10.8918 4.375 11.375C4.375 11.8582 4.76676 12.25 5.25 12.25C5.73323 12.25 6.125 11.8582 6.125 11.375C6.125 10.8918 5.73323 10.5 5.25 10.5ZM15.3125 10.5C14.8293 10.5 14.4375 10.8918 14.4375 11.375C14.4375 11.8582 14.8293 12.25 15.3125 12.25C15.7957 12.25 16.1875 11.8582 16.1875 11.375C16.1875 10.8918 15.7957 10.5 15.3125 10.5Z"></path>-->
                    <!--                </svg>-->
                    <!--            </div>-->
                    <!--        </span>-->
                    <!--    </div>-->
                    <!--    <div class="tf-progress-msg">-->
                    <!--        Buy <span class="price fw-6">$75.00</span> more to enjoy <span class="fw-6">Free Shipping</span>-->
                    <!--    </div>-->
                    <!--</div>-->
                    <div class="tf-page-cart-checkout">
                        <div class="tf-cart-totals-discounts">
                            <h3>Grand Total</h3>
                            <span class="total-value">₱<span class="view_cart_subtotal">{{number_format($cart_checker ? $cart_total : $cart['total_price'],2)}}</span> PHP</span>

                        </div>
                        <p class="tf-cart-tax">
                            Taxes and <a href="#">shipping</a>  calculated at checkout
                        </p>
                        <div class="cart-checkout-btn">
                            <a href="{{route('shop.checkout')}}" class="tf-btn w-100 btn-fill animate-hover-btn radius-3 justify-content-center">
                                <span>Check out</span>
                            </a>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- page-cart -->
@endsection
@section('page_script')
@parent

@endsection
<!-- App js -->