@php
    $previousName = null;
@endphp
@foreach($collectionProducts as $key => $value)
    {{--    {{ dd($value['details']['collection']['id']) }}--}}
    <div class="contentWrapper">
        <div class="proSlider swiper">
            <div>
                <h2>{{ $key }}</h2>
            </div>
            <div class="swiper-wrapper">
                @foreach($value['products'] as $product)
                    <div class="swiper-slide">
                        <div class="proThumb">
                            <div class="img">
                                <img src="{{ asset('uploads/products/' . $product['product_image'])
                                    ?? 'admin/images/placeholder.png' }}" alt="" class="w-100">
                            </div>
                            <a tabindex="0">{{ $product['product_name'] ?? 'Norcanna' }}</a>
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="swiper-pagination"></div>
        </div>

        <div class="discountBar">
            {!! $value['details']['collection']['descriptions'] ?? 'Special Discount Offer On Collection Purchase' !!}
            <div class="discount">
                <p>Collection Price</p>
                <h2>${{ $value['details']['discounted_amount'] ?? '0.00' }}</h2>
                <p>upto {{ $value['details']['discount'] ?? '00' }}%</p>
                <h4 class="cutPrice">
                    <strike>${{ $value['details']['actual_amount'] ?? '0.00' }}</strike>
                </h4>
            </div>
        </div>

        {{--Collection Form Start--}}
        @if(!empty($value['details']['discounted_amount']) && !empty($value['details']['actual_amount']))
            <div class="btnCont">
                <form action="{{ route('collection.buy', $value['details']['collection']['id']) }}" method="POST"
                      enctype="multipart/form-data">
                    {{ csrf_field() }}
                    <button type="submit" class="buyBtn btnStyle" id="buy-now-button">
                        Buy Now
                    </button>
                </form>
            </div>
        @endif
        {{--Collection Form End--}}

    </div>
@endforeach
{{--<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>--}}
{{--<script>--}}
{{--    $(document).ready(function () {--}}
{{--        $("#buy-now-button").click(function (e) {--}}
{{--            e.preventDefault();--}}
{{--            var collection_id = $('#collection_id').val();--}}
{{--            alert(collection_id);--}}
{{--            $.ajax({--}}
{{--                url: "{{ route('collection.buy') }}",--}}
{{--                type: "POST",--}}
{{--                data: {--}}
{{--                    collection_id: collection_id,--}}
{{--                    _token: '{{ csrf_token() }}'--}}
{{--                },--}}
{{--                dataType: "json",--}}
{{--                success: function (response) {--}}
{{--                    // hide the collection modal--}}
{{--                    // $("#offerPopup").modal("hide");--}}
{{--                    toastr.success(response.msg);--}}
{{--                },--}}
{{--                error: function (xhr, status, error) {--}}
{{--                    console.log("An error occurred: " + error);--}}
{{--                }--}}
{{--            });--}}
{{--        });--}}

{{--        let proSwiper = new Swiper('.proSlider', {--}}
{{--            slidesPerView: 4,--}}
{{--            spaceBetween: 10,--}}
{{--            observer: true,--}}
{{--            observeParents: true,--}}
{{--            pagination: {--}}
{{--                el: '.swiper-pagination',--}}
{{--            },--}}
{{--        });--}}
{{--    });--}}

{{--</script>--}}