@extends('site.master')
@section('title','My Wislist')
@section('content')
    <!-- Page Banner Section Start -->
    @include('site.layouts.breadcrumb')
    <style>
        .sidebar-category li.active {
            border-left: 5px solid #ff5252;
        }
    </style>
    <!-- Cart Page Start -->
    <div class="page-section section mt-20 mb-10">
        <div class="container-fluid">
            <div class="row">

                <div class="shop-sidebar-wrap col-xl-3 col-lg-4 col-12 order-lg-1 mb-15">
                    <div class="shop-sidebar mb-30">
                        <h4 class="title">MENU</h4>
                        <ul class="sidebar-category">
                            <li class="active"><a href="{{ route('site.myAccount') }}">My Account</a></li>
{{--                            <li class="active"><a href="{{ route('site.myOrder') }}">My Orders</a></li>--}}
                            <li class="active"><a href="{{ route('site.myWishlist') }}">My Wishlist</a></li>
                            <li class="active"><a href="{{ route('site.myProfile') }}">My Profile</a></li>
                            <li class="active"><a href="{{ route('site.logout') }}">Logout</a></li>
                        </ul>
                    </div>
                </div>

                <div class="col-xl-9 col-lg-8 col-12 order-lg-2 mb-50">
                    <form action="#">
                        <div class="cart-table table-responsive">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th class="pro-thumbnail">Image</th>
                                    <th class="pro-title">Product</th>
                                    <th class="pro-price">Price</th>
                                    <th class="pro-quantity">Quantity</th>
                                    <th class="pro-subtotal">Buy</th>
                                    <th class="pro-remove">Remove</th>
                                </tr>
                                </thead>
                                <tbody>

                                @foreach($wishList as $wishListProduct)
                                    <tr class="wishlist_{{  $wishListProduct->id }}">
                                        <td class="pro-thumbnail">
                                            @if(file_exists(public_path().'/uploads/product/'.$wishListProduct->product->thumb_image) && !empty($wishListProduct->product->thumb_image))
                                                <a class="thumb-image active" data-toggle="tab" href="#single-image-1">
                                                    <img src="{{ asset('uploads/product/'.$wishListProduct->product->thumb_image) }}"
                                                         alt="Thumbnail Image"></a>
                                            @else
                                                <a class="thumb-image active" data-toggle="tab" href="#single-image-1">
                                                    <img src="{{ asset('site_assets/images/single-product/thumb-1.png') }}"
                                                         alt="Thumbnail Image"></a>
                                            @endif
                                        </td>
                                        <td class="pro-title">
                                            <a href="#">@if($wishListProduct->product) {{  $wishListProduct->product->name  }}@endif</a>
                                        </td>
                                        <td class="pro-price"><span>
                                            @if($wishListProduct->product)
                                                    ৳&nbsp;
                                                    @if(!empty($wishListProduct->product->retail_price_after_discount))
                                                        {{ $wishListProduct->product->retail_price_after_discount }}
                                                    @else
                                                        {{ $wishListProduct->product->retail_price }}
                                                    @endif

                                                @endif
                                        </span></td>
                                        <td class="pro-quantity">
                                            <div class="pro-qty"><input type="text" name="quantity" class="product_quantity" value="1" min="1"></div>
                                        </td>
                                        <td class="pro-addtocart">

                                            <a class="add-to-cart header-cart btn btn-circle hover-theme"
                                               data-id="{{ $wishListProduct->product_id }}"><i
                                                        class="ti-shopping-cart"></i><span>ADD TO CART</span></a>
                                        </td>
                                        <td class="pro-remove" data-id="{{ $wishListProduct->id }}"><a href="javascript:void(0)" ><i class="fa fa-trash-o"></i></a></td>
                                    </tr>
                                @endforeach

                                </tbody>
                            </table>
                        </div>

                    </form>
                </div>


            </div>
        </div>
    </div>
    <!-- Cart Page End -->

@stop



@section('page_scripts')
    <script type="text/javascript">
        $('.pro-remove').on("click", function () {

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            var wishlist_id = $(this).data("id");
            $.ajax({
                url: "{{ route('site.wishlist.delete')}}",
                type: "post",
                data: "wishlist_id=" + wishlist_id,
                success: function (response) {
                    if (response == 'success') {
                        toastr.options =
                            {
                                "closeButton": true,
                                "progressBar": true,

                            }
                        $('.wishlist_' + wishlist_id).fadeOut();
                        toastr.success("Product deleted from wishlist successfully");
                    } else {
                        toastr.options =
                            {
                                "closeButton": true,
                                "progressBar": true
                            }
                        toastr.error("Unable to delete from wishlist");
                    }
                }
            });
        });

    </script>

@endsection