@extends('layouts.master')
@section('title') Aramian Brother`s Jewelry @endsection
<meta name="csrf-token" content="{{ csrf_token() }}">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
.grouped_form table tbody tr td.grouped-product-list.label {
    font-weight: 150 !important;
    
  
}
/* .grouped_form table tbody tr td{
    border-color: #000 !important;
    border: solid 2px #000;
  border-collapse: collapse;
} */

.grouped_form table tbody tr td.grouped-product-list.price {
    font-weight: 300 !important;
}

.pro-code{
    color: #E7E7EA !important;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th {
    background-color: #f2f2f2; /* Light grey background for header */
    padding: 10px;
    text-align: left;
}

/* Table cell styling */
td {
    background-color: #ffffff; /* White background for cells */
    padding: 10px;
    text-align: left;
    text-align: justify;
    text-align-last: left;
}

/* Remove borders but add color to the table */
table, th, td {
    border: 1px solid transparent; /* Border set to transparent but still allows color to be applied */
}

/* Optional: Add a border color effect */
tbody tr:nth-child(odd) td {
    background-color: #f9f9f9; /* Alternating row background color */
}

.guide-img{
    width: 50%;
    margin: 0 auto !important;
}

.btn-added {
        background: #c09578;
        color: #ee0505;
    }
    
    .wishlistLink .icon{
        line-height: 2.3 !important;
    }
    
    .wishlistLink .fa-brands{
        line-height: 2 !important;
    }

</style>

@section('content')

@php
    use App\Models\ProductImage;
    use App\Models\ProductPcs;
    use App\Models\Product;
    use App\Models\ProductMainMenu;
    use App\Helpers\Helpers;
    use Illuminate\Support\Facades\Auth;
    use App\Models\Wishlist;
@endphp
<!-- Main Wrapper Start -->
    
    <!--breadcrumbs area start-->
    <div class="breadcrumbs_area product_bread">
        <div class="container">   
            <div class="row">
                <div class="col-12">
                    
                </div>
            </div>
        </div>         
    </div>
    <div id="ajax-success-message" class="alert alert-success" style="display: none;"></div>
    <div id="ajax-danger-message" class="alert alert-danger" style="display: none;"></div>
    <!--breadcrumbs area end-->
    
        <!--product details start-->
    <div class="product_details product_grouped">
        <div class="container">
            <div class="row">
                    <div class="col-lg-1 col-md-1"></div>
                    <div class="col-lg-4 col-md-4">
                    <div class="product-details-tab">

                        <div id="img-1" class="zoomWrapper single-zoom">
                            <a href="#">
                                <img id="zoom1" 
                                    src="{{ URL::asset('storage/assets/uploads/products/'.$products->id.'/'.$products->main_image) }}" 
                                    data-zoom-image="{{ URL::asset('storage/assets/uploads/products/'.$products->id.'/'.$products->main_image) }}"
                                    alt="">
                            </a>
                        </div>

                        @php
                            $productsAllImage = ProductImage::
                                                select('id', 'products_id', 'image_name', 'main_image'
                                                    )
                                                ->where('products_id', $products->id)
                                                ->distinct()
                                                ->get();
                        @endphp 
                        <div class="single-zoom-thumb">
                            <ul class="s-tab-zoom owl-carousel single-product-active" id="gallery_01">

                                @foreach ($productsAllImage as $allImg)
                                    <li>
                                        
                                        @php
                                            if(empty($allImg->image_name)){
                                                $image = $allImg->main_image;
                                            }else{
                                                $image = $allImg->image_name;
                                            }
                                        @endphp

                                        <a href="#" class="elevatezoom-gallery active" data-update="" 
                                            data-image="{{ URL::asset('storage/assets/uploads/products/'.$allImg->products_id.'/'.$image) }}" 
                                            data-zoom-image="{{ URL::asset('storage/assets/uploads/products/'.$allImg->products_id.'/'.$image) }}">
                                            <img src="{{ URL::asset('storage/assets/uploads/products/'.$allImg->products_id.'/'.$image) }}" alt="zo-th-1"/>
                                        </a>

                                    </li>
                                @endforeach

                                
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 col-md-6">                  
                    <div class="product_d_right">
                            {{-- <form action="#"> --}}

                                <h1>{{$products->title}}</h1>
                                
                                <div class="grouped_form table-responsive">
                                    <table>
                                        <tbody>
                                            <tr>
                                                <td class="grouped-product-list label"></td>
                                                <td class="pro-code">{{$products->code}}</td>
                                            </tr>
                                            
                                            @if(isset($products->discount_price))

                                            <tr>
                                                <td class="grouped-product-list label">Price</td>
                                                <td class="">
                                                    <div class="price_box">
                                                        <span class="old_price">
                                                            {{ Helpers::getUserNumberFormat()->format($products->price) }}
                                                        </span>
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="grouped-product-list label">Discount</td>
                                                <td class="">
                                                    <div class="price_box">
                                                        <span class="current_price">
                                                            {{ Helpers::getUserNumberFormat()->format($products->discount_price) }}
                                                        </span>
                                                    </div>
                                                </td>
                                            </tr>

                                            @else
                                            <tr>
                                                <td class="grouped-product-list label">Price</td>
                                                <td class="">
                                                    <div class="price_box">
                                                        <span class="current_price">
                                                            {{ Helpers::getUserNumberFormat()->format($products->price) }}
                                                        </span>
                                                    </div>
                                                </td>
                                            </tr>
                                            @endif
                                            
                                            <tr>
                                                <td class="grouped-product-list label">Material</td>
                                                <td class="grouped-product-list price">{{$products->material}}</td>
                                            </tr>
                                            <tr>
                                                <td class="grouped-product-list label">Purity</td>
                                                <td class="grouped-product-list price">{{$products->purity}}</td>
                                            </tr>
                                            <tr>
                                                <td class="grouped-product-list label">Weight</td>
                                                <td class="grouped-product-list price" style="text-transform: none; !important">{{$products->weight}}</td>
                                            </tr>
                                            <tr>
                                                <td class="grouped-product-list label">Diamond</td>
                                                <td class="grouped-product-list price">{{$products->diamond}}</td>
                                            </tr>
                                            @php
                                                $productsPcs = ProductPcs::
                                                                        select('id', 'products_id', 'pcs_img', 'pcs_count',
                                                                                'pcs_txt', 'pcs_ct_size', 'pcs_size_type',
                                                                                'gia_code', 'gia_url'
                                                                            )
                                                                        ->where('products_id', $products->id)
                                                                        ->distinct()
                                                                        ->get();
                                                                        
                                            @endphp
                                            
                                                @foreach ($productsPcs as $productsPcsVal)
                                                    @if (!empty($productsPcsVal->products_id))

                                                        <tr>
                                                            <td class="grouped-product-list label" style="text-transform: none; !important">
                                                                @if (!empty($productsPcsVal->pcs_img))
                                                                <img src="{{ URL::asset('storage/assets/uploads/products/'.$products->id.'/pcs/'.$productsPcsVal->pcs_img) }}" alt="" width="20">    
                                                                @endif
                                                                {{$productsPcsVal->pcs_count}} {{$productsPcsVal->pcs_txt}}
                                                                <p>
                                                                    <u>
                                                                        <a style="font-size: 12px;margin-left: 10%;color: #A4A3A8;" href="https://www.gia.edu/report-check?reportno={{$productsPcsVal->gia_url}}" target="_blank">
                                                                            {{$productsPcsVal->gia_code}}
                                                                        </a>
                                                                    </u>
                                                                </p>
                                                            </td>
                                                            <td class="grouped-product-list price" style="text-transform: none; !important">{{$productsPcsVal->pcs_ct_size}} {{$productsPcsVal->pcs_size_type}}</td>
                                                        </tr>
                                                    @endif
                                                @endforeach
                                            
                                            
                                            
                                            
                                        </tbody>
                                    </table>

                                </div>
                                @if ($products->category->short_name == 'rings')
                                    <div class=" product_d_action">
                                        {{-- <div class="quick_button"> --}}
                                            <a href="#" data-bs-toggle="modal" data-bs-target="#modal_box" 
                                                data-placement="top" 
                                                data-original-title="quick view">
                                                <img src="{{ URL::asset('storage/assets/img/size_guide_icon.png') }}" alt="" width="10"> Size guide
                                            </a>
                                        {{-- </div> --}}
                                        
                                    </div>

                                    <!-- modal area start-->
                                
                                    <div class="modal fade" id="modal_box" tabindex="-1" role="dialog"  aria-hidden="true">
                                        <div class="modal-dialog modal-dialog-centered" role="document">
                                            <div class="modal-content">
                                                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                                </button>
                                                <div class="modal_body">
                                                    <div class="container">
                                                        <div class="row guide-img">
                                                            <img src="{{ URL::asset('storage/assets/img/size_guide_image.png') }}" alt="">
                                                            
                                                        </div>     
                                                    </div>
                                                </div>    
                                            </div>
                                        </div>
                                    </div> 

                                    
                                    <div class="product_variant quantity">
                                        <label>Size &nbsp;</label>
                                        <select name="size" id="size" class="niceselect_option">
                                            @foreach ($sizeGuide as $sizeGuideVal)
                                                <option value="{{$sizeGuideVal->id}}"
                                                        {{ old('size') == $sizeGuideVal->id ? 'selected' : '' }}>
                                                    {{$sizeGuideVal->name}}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div> 
                                @endif
                                
                                <div class="product_variant quantity">
                                    
                                    <label>quantity</label>
                                    <input min="1" max="100" value="1" type="number" name="quantity" id="quantity">

                                    {{-- @if (!empty($addCart)) --}}
                                        <button class="button add-to-cart" type="submit" data-product-id="{{ $products->id }}" >add to cart</button>  
                                    {{-- @else
                                        <button class="button add-to-cart" type="submit" data-product-id="{{ $products->id }}" >add to cart</button>  
                                    @endif --}}

                                    <div class="product_d_action">
                                        <ul>
                                            <li style="margin-top: 25px;">
                                                @if (!empty($wishlists))
                                                    <button type="submit" 
                                                        class="btn btn-primary remove-from-wishlist" data-id="{{ $wishlists->id }}" 
                                                        style="min-width: 20%;color: #ee0505;">
                                                        <span class="icon icon-Heart" style="font-size: 32px;"></span>
                                                    </button>
                                                @else
                                                    <button type="submit" 
                                                        class="btn btn-primary add-to-wishlist" data-product-id="{{ $products->id }}" 
                                                        style="min-width: 20%;">
                                                        <span class="icon icon-Heart" style="font-size: 32px;"></span>
                                                    </button>
                                                @endif
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                

                                
                                <div class="product_meta">
                                    <span>Category: </span>
                                    {{$products->category->category_name}}/

                                    @foreach ($products->productMenu as $mainMenu)
                                        {{$mainMenu->mainMenu->name}}
                                    @endforeach
                                </div>
                                

                            {{-- </form> --}}
                            {{-- <div class="priduct_social">
                                <ul>
                                    <li><a href="#" title="facebook"><i class="fa fa-facebook"></i></a></li>           
                                    <li><a href="#" title="twitter"><i class="fa fa-twitter"></i></a></li>           
                                    <li><a href="#" title="pinterest"><i class="fa fa-pinterest"></i></a></li>           
                                    <li><a href="#" title="google +"><i class="fa fa-google-plus"></i></a></li>        
                                    <li><a href="#" title="linkedin"><i class="fa fa-linkedin"></i></a></li>        
                                </ul>      
                            </div> --}}
                        </div>
                </div>
                <div class="col-lg-1 col-md-1"></div>
            </div>
        </div>    
    </div>
    <!--product details end-->
    
    <!--product info start-->
    <div class="product_d_info">
        <div class="container">   
            <div class="row">
                <div class="col-12">
                    <div class="product_d_inner">   
                        <div class="product_info_button">    
                            <ul class="nav" role="tablist">
                                <li >
                                    <a class="active" data-bs-toggle="tab" href="#info" role="tab" aria-controls="info" aria-selected="false">
                                        More info
                                    </a>
                                </li>
                            </ul>
                        </div>
                        @if (!empty($products->description))
                            <div class="tab-content">
                                <div class="tab-pane fade show active" id="info" role="tabpanel" >
                                    <div class="product_info_content">
                                        <p>{{$products->description}}</p>
                                        
                                    </div>    
                                </div>
                            </div>
                        @endif
                    </div>     
                </div>
            </div>
        </div>    
    </div>  
    <!--product info end-->
    
    <!--product section area start-->
    <section class="product_section  p_section1">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="section_title">
                        <h2>Related products</h2>
                    </div> 
                </div>  
                <div class="col-12">
                    <div class="product_area ">
                            <div class="product_container bottom">
                            <div class="custom-row product_row1">
                                @php
                                        $getProduct = Product::inRandomOrder()
                                                                ->select('products.*', 
                                                                    'products_menu.products_id',
                                                                    'products_image.products_id', 'products_image.main_image', 'products_image.image_name',
                                                                    )
                                                                ->leftJoin('products_menu', function($join){
                                                                    $join->on('products_menu.products_id', '=', 'products.id');
                                                                })
                                                                ->leftJoin('products_image', function($join){
                                                                    $join->on('products_image.products_id', '=', 'products.id');
                                                                })
                                                                ->where('products.status', 1)
                                                                ->where('products.category_id', $products->category_id)
                                                                ->whereNotNull('products_image.main_image')
                                                                ->distinct()
                                                                ->limit(12)
                                                                ->get();
                                    @endphp
                                    
                                    @foreach ($getProduct as $getProductVal)
                                        <div class="custom-col-5">
                                            <div class="single_product">
                                                <div class="product_thumb">
                                                    <img src="{{ URL::asset('storage/assets/uploads/products/'.$getProductVal->id.'/'.$getProductVal->main_image) }}" alt="">
                                                    
                                                    @php
                                                    $productsAllImage = Product::
                                                                        select('products.*', 
                                                                            'products_menu.products_id', 'products_menu.menu_type_id',
                                                                            'products_image.products_id', 'products_image.main_image', 'products_image.image_name',
                                                                            )
                                                                        ->leftJoin('products_menu', function($join){
                                                                            $join->on('products_menu.products_id', '=', 'products.id');
                                                                        })
                                                                        ->leftJoin('products_image', function($join){
                                                                            $join->on('products_image.products_id', '=', 'products.id');
                                                                        })
                                                                        ->where('products.status', 1)
                                                                        ->where('products.id', $getProductVal->id)
                                                                        // ->where('menu_type_id', 1)
                                                                        ->get();
                                                @endphp     

                                                @if (count($productsAllImage) > 1)
                                                    @foreach ($productsAllImage as $allImg)
                                                        <a class="secondary_img" href="{{route('shop.show', $getProductVal->id)}}">
                                                            <img src="{{ URL::asset('storage/assets/uploads/products/'.$allImg->id.'/'.$allImg->image_name) }}" alt="">
                                                        </a>
                                                    @endforeach

                                                @else
                                                    <a class="secondary_img" href="{{route('shop.show', $getProductVal->id)}}">
                                                        <img src="{{ URL::asset('storage/assets/uploads/products/'.$getProductVal->id.'/'.$getProductVal->main_image) }}" alt="">
                                                    </a>
                                                @endif
                                                
                                                </div>
                                                <div class="product_content">
                                                    <div class="tag_cate">
                                                        <a href="#">{{$getProductVal->category->category_name}}</a>
                                                    </div>
                                                    <h3><a href="{{route('shop.show', $getProductVal->id)}}">{{$getProductVal->title}}</a></h3>
                                                    <div class="price_box">
                                                        @if(isset($getProductVal->discount_price))
                                                            <span class="old_price">{{Helpers::getUserNumberFormat()->format($getProductVal->price)}}</span>
                                                            <span class="current_price">{{Helpers::getUserNumberFormat()->format($getProductVal->discount_price)}}</span>
                                                        @else
                                                            <span class="current_price">{{Helpers::getUserNumberFormat()->format($getProductVal->price)}}</span>
                                                        @endif
                                                    </div>
                                                    <div class="product_hover">
                                                        <div class="product_desc">
                                                            <p>{{$getProductVal->description}}</p>
                                                        </div>
                                                        <div class="action_links">
                                                            <ul>
                                                                @php
                                                                    $wishlists = Auth::check() 
                                                                                    ? Wishlist::where('created_user_id', Auth::id())->where('products_id', $getProductVal->id)->first()
                                                                                    : Wishlist::where('session_id', session('wishlist_session_id'))->where('products_id', $getProductVal->id)->first();
                                                                @endphp     
                                                            
                                                                @if (!empty($wishlists))
                                                                    <li>
                                                                        <a href="javascript:void(0);" title="Wishlist" 
                                                                            class="btn-outline-primary wishlistLink" 
                                                                            style="color: #ee0505;"
                                                                            data-wish-id="{{ isset($wishlists)?$wishlists->id:null }}" 
                                                                            data-product-id="{{ $getProductVal->id }}" 
                                                                            >
                                                                            <span class="icon icon-Heart"></span>
                                                                        </a>
                                                                    </li>
                                                                    
                                                                @else
                                                                    <li>
                                                                        <a href="javascript:void(0);" title="Wishlist" 
                                                                            class="btn-outline-primary wishlistLink"
                                                                            data-product-id="{{ $getProductVal->id }}" 
                                                                            >
                                                                            <span class="icon icon-Heart"></span>
                                                                        </a>
                                                                    </li>
                                                                @endif
                                                            
                                                                <li class="add_to_cart" data-product-id="{{ $getProductVal->id }}" >
                                                                    <span class="add-txt" style="display:none; color:#c09578;">Added successfully</span>
                                                                    <a href="javascript:void(0);" 
                                                                        data-product-id="{{ $getProductVal->id }}"
                                                                        class="add-to-cart" 
                                                                        title="add to cart">add to cart</a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                       
                                    @endforeach
                            </div>
                        </div>
                    </div>
                </div>
            </div>    
        </div>
    </section>
    <!--product section area end-->
        
@endsection

@section('script')
<!-- JS
============================================ -->

<!-- Plugins JS -->
    <script src="{{ URL::asset('storage/assets/js/vendor/jquery-3.4.1.min.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/popper.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/bootstrap.min.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/plugins.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/owl.carousel.main.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/jquery.nice.select.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/scrollup.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/ajax.chimp.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/jquery.ui.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/jquery.elevatezoom.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/imagesloaded.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/isotope.main.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/jqquery.ripples.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/jquery.cookie.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/bpopup.js') }}"></script>
    <script src="{{ URL::asset('storage/assets/js/main.js') }}"></script>
    
    <script>
        $(document).ready(function () {
            // Set up the CSRF token for AJAX requests
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
    
            // Handle the Add to Wishlist button click event
            $('.add-to-wishlist').on('click', function () {
                var productId = $(this).data('product-id');
    
                $.ajax({
                    url: '/wishlist/add/' + productId,
                    method: 'POST',
                    success: function (response) {
                        if (response.success) {
                            $('html, body').animate({ scrollTop: 0 }, 'slow');
                            $('#ajax-success-message').text(response.message).show().delay(5000).fadeOut();
                            setTimeout(function(){
                                window.location.reload(1);
                            }, 2000);
                            // Optionally update the UI to reflect the wishlist addition
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });
            });
            $('.remove-from-wishlist').on('click', function () {
                var productId = $(this).data('id');
                
    
                $.ajax({
                    url: '/wishlist/remove/' + productId,
                    method: 'POST',
                    // data: 'quantity'
                    success: function (response) {
                        if (response.success) {
                            $('html, body').animate({ scrollTop: 0 }, 'slow');
                            $('#ajax-danger-message').text(response.message).show().delay(5000).fadeOut();
                            setTimeout(function(){
                                window.location.reload(1);
                            }, 2000);
                            // Optionally update the UI to reflect the wishlist addition
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });
            });


            $('.add-to-cart').on('click', function () {
                
                var productId = $(this).data('product-id');
                var quantity = $('#quantity').val();
                var size = $('#size').val();

                $.ajax({
                    url: '/cart/add/' + productId,
                    method: 'POST',
                    data: { sendquantity: quantity, sendSize:size},
                    success: function (response) {
                        if (response.success) {
                            $('html, body').animate({ scrollTop: 0 }, 'slow');
                            $('#ajax-success-message').text(response.message).show().delay(5000).fadeOut();
                            setTimeout(function(){
                                window.location.reload(1);
                            }, 2000);
                            // Optionally update the UI to reflect the wishlist addition
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });
            });

            $('.remove-cart').on('click', function () {
                var productId = $(this).data('id');
    
                $.ajax({
                    url: '/cart/remove/' + productId,
                    method: 'POST',
                    success: function (response) {
                        if (response.success) {
                            $('#ajax-danger-message').text(response.message).show().delay(5000).fadeOut();
                            // Optionally update the UI to reflect the wishlist addition
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });
            });
        });
    </script>

<script>
    $(document).ready(function () {

        // Set up the CSRF token for AJAX requests
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $('.wishlistLink').on('click', function () {
            
            if($('.wishlistLink').hasClass('btn-added')){
            
                var wishID = $(this).data('wish-id');
                var datProductId = $(this).data('product-id');
                let elem = $(this)

                $('.wishlistLink').css('backgroundColor', "#f1f1f1")
                $('.wishlistLink').css('color', "#666")
                $('.wishlistLink').removeClass('btn-added')
                $('.wishlistLink').removeClass('add-to-wishlist')

                $.ajax({
                    url: '/wishlist/remove/' + wishID,
                    method: 'POST',
                    // data: 'quantity'
                    success: function (response) {
                        if (response.success) {
                            elem.removeAttr('data-wish-id')
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });

            }else{

                var datProductId = $(this).data('product-id');
                let elem = $(this)
                $('.wishlistLink').addClass('btn-added')
                // $('.wishlistLink').css('backgroundColor', "#c09578")
                $('.wishlistLink').css('color', "#ee0505;")
                $('.wishlistLink').removeClass('remove-from-wishlist')
                
                $.ajax({
                    url: '/wishlist/add/' + datProductId,
                    method: 'POST',
                    success: function (response) {
                        console.log(response)
                        if (response.success) {
                            elem.attr('data-wish-id', response.data_id)
                            elem.data('wish-id', response.data_id)
                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function (xhr) {
                        alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
                    }
                });
            }
        })
    });
</script>
<script>

// $(document).ready(function () {

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

//     $('.add-to-cart').on('click', function () {

//             var productId = $(this).data('product-id');
//             let elem = $(this)          
//             // $('.add_to_cart').addClass('cart-added')
//             // var _token = $('meta[name=csrf-token]').attr('content');
//             $.ajax({
//                 url: '/cart/addto',
//                 method: 'POST',
//                 data: { sendproductId: elem.attr('data-product-id')},
//                 success: function (response) {
//                     if (response.success) {
//                         // var span = $('<span />').attr('className', 'folder_name').html('aaaaaaa');
//                         // $(this).attr('a').after("<span class=test>test</span>");
//                         $('.add-txt').show().delay(2000).fadeOut();
                        
//                         $('.cart_quantity').html(response.prodCount)
//                         $('.cart_text_quantity').html(response.prodSum)
//                     } else {
//                         alert('Something went wrong. Please try again.');
//                     }
//                 },
//                 error: function (xhr) {
//                     alert('An error occurred: ' + xhr.status + ' ' + xhr.statusText);
//                 }
//             });
//         })
// })

</script>

@endsection