@extends('frontend.layout.app')

@section('content')
<section class="pt-4 mb-4">
    <div class="container">
        <div class="row">
            <div class="col-lg-3 text-center ">
                <h1 class="fw-600 h4">Products/{{ $name }}</h1>
            </div>
            <div class="col-lg-9">
                <ul class="breadcrumb bg-transparent p-0 justify-content-center justify-content-lg-end">
                    <li class="breadcrumb-item opacity-50">
                        <a class="text-reset" href="{{ route('home') }}">Home</a>
                    </li>
                    <li class="text-dark fw-600 breadcrumb-item">
                        <a class="text-reset" href="">Products</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>  
<section class="mb-4">
    <div class="container">
            <div class="row">
            @foreach($products as $product)
            <div class="col-6 col-md-3 product-display">
              
                            <div class="product-all-card-img">
                                <img src={{ asset('/storage/'.$product->thumbnail_img) }} class="img_center" alt="Laptop">
                            </div>    
                            
                                    <div class="p-3 text-left">
                                    <p class="product-all-brand"> {{ $product->category->name }} </p>
                                        <h4 class="product-name">
                                            <a href={{ route('viewproduct',[$product->id]) }}  tabindex="0">{{$product->name }}</a>
                                        </h4>
                                        <div class="rating rating-sm mb-2">
                                        </div>
                                        @php
                                    $prignalprice=$product->unit_price;
                                    $descount=$product->discount;
                                    $price=$prignalprice-$descount;
                             @endphp
                               @php
                                $choices = [];
                               if($product->choice_options){
                               $rawChoices = json_decode($product->choice_options, true);
                               foreach($rawChoices as $choice){
                               $choices[] = [
                               'attribute_id' => $choice['attribute_id'],
                               'attribute_name' => \App\Models\Attribute::find($choice['attribute_id'])->name ?? '',
                               'values' => $choice['values']
                               ];}}
                        @endphp
                                         <span class="selling-price">Rs:{{ number_format($price,2) }}</span>
                                         <span class="original-price">{{ number_format($product->unit_price,2) }}</span>
                                        
                                        <div class="card-footer d-flex justify-content-between bg-light">
                                 <a href="{{ route('viewproduct',[$product->id]) }}" class="btn btn-sm text-dark p-0"><i class="fas fa-eye text-primary mr-1"></i>View Detail</a>
                                 <a href="javascript:void(0);"
               class="btn btn-sm text-dark p-0"
               onclick="show_addtocart_modal(this)"
               data-id="{{ $product->id }}"
               data-name="{{ $product->name }}"
               data-images="{{ $product->photos }}"
               data-unitprice="{{ $product->unit_price }}"
               data-discount="{{ $product->discount }}"
               data-unit="{{ $product->unit }}"
               data-choice='@json($choices)'
               data-colors='@json(json_decode($product->colors, true))'
               data-stocks='@json($product->stocks)'
               >
               <i class="fas fa-shopping-cart text-primary me-1"></i> Add To Cart
            </a>
                                </div>
                                        <div class="mt-2">
                                             
                                        </div>
                                    </div>
                                </div>
                                    
            @endforeach
            </div>
     </div>
</section>            

@endsection

@section('modal')
@include('frontend.modal.addtocartmodal')
@endsection

@section('script')
<script>
 const STORAGE_URL = "{{ asset('storage') }}/";
</script>
<script>
    const COLORS = @json(\App\Models\Color::select('name','code')->get());
</script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
@endsection


<script src={{ asset('/storage/assets/js/script.js') }}></script>