@extends('panel._layout.app')

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h4 class="mt-0 header-title">المنتجات</h4>
                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#create_modal">
                    <i class="mdi mdi-plus"></i> إضافة
                </button>
            </div>
            <div class="card-body">
                <table id="oTable" class="table table-bordered dt-responsive table-responsive nowrap">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>الاسم</th>
                            <th>السعر</th>
                            <th>التوصيل </th>
                            <th>المنتج</th>
                             <th>الأدوات</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($offers as $offer)
                            <tr>
                                <td>{{ $offer->id }}</td>
                                <td>{{ $offer->name }}</td>
                                <td>{{ $offer->price }}</td>
                                <td>{{ $offer->number }}</td>
                                <td>
                                    {{ optional($offer->product)->name }}
                                </td>
                                
                                
                          
                    
                                <td>
                                    <form action="{{ route('admin.offer.delete', ['id' => $offer->id]) }}" method="POST" style="display:inline;" onsubmit="return confirmDelete(event)">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn btn-danger">
                                            <i class="fas fa-trash"></i>
                                        </button>
                                    </form>
                                    <a href="#" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#edit_modal_{{ $offer->id }}">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <div class="row justify-content-between align-items-center" style="padding: 10px; margin-top: 20px;">
                {{-- <div class="col-md-2">
                    {{ $offers->links('pagination::bootstrap-4') }}
                </div> --}}
            </div>
        </div>
    </div>
</div>

<!-- Create offer Modal -->
<div class="modal fade" id="create_modal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-top">
        <div class="modal-content">
            <div class="modal-header bg-light">
                <h4 class="modal-title" id="myCenterModalLabel">إضافة منتج جديد</h4>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
            </div>
            <div class="modal-body">
                <form action="{{ route('admin.offer.create') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="mb-3">
                        <label for="name " class="form-label">اسم العرض</label>
                        <input type="text" class="form-control" name="name" id="name"  required>
                    </div>

                    <div class="mb-3">
                        <label for="name" class="form-label">سعر العرض</label>
                        <input type="text" class="form-control" name="price" id="price" placeholder="سعر المنتج" required>
                    </div>

                    <div class="mb-3">
                        <label for="delivery " class="form-label"> تكلفة التوصيل</label>
                        <input type="text" class="form-control" name="delivery" id="delivery"  required>
                    </div>

                    <div class="mb-3">
                        <label for="number " class="form-label">عدد منتجات العرض</label>
                        <input type="number" class="form-control" name="number" id="number"  required>
                    </div>
                   
                    <div class="mb-3">
                        <label for="product_id" class="form-label">المنتج</label>
                        <select class="form-control" name="product_id" id="product_id" required>
                            @foreach($products as $product)
                                <option value="{{ $product->id }}">{{ $product->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <button type="submit" class="btn btn-primary">إضافة</button>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Edit Product Modals -->
@foreach($offers as $offer)
    <div class="modal fade" id="edit_modal_{{ $offer->id }}" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-top">
            <div class="modal-content">
                <div class="modal-header bg-light">
                    <h4 class="modal-title" id="editModalLabel">تعديل العرض</h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('admin.offer.update', ['id' => $offer->id]) }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')
                        <div class="mb-3">
                            <label for="name_{{ $offer->id }}" class="form-label">اسم العرض</label>
                            <input type="text" class="form-control" name="name" id="name_{{ $offer->id }}" value="{{ $offer->name }}" required>
                        </div>

                        <div class="mb-3">
                            <label for="name" class="form-label">سعر العرض</label>
                            <input type="text" class="form-control" name="price" id="price" placeholder="سعر المنتج"  value="{{ $offer->price }}"  required>
                        </div>

                        

                        <div class="mb-3">
                            <label for="delivery{{ $offer->id }}" class="form-label">تكلفة التوصيل</label>
                            <input type="text" class="form-control" name="delivery" id="delivery{{ $offer->id }}" value="{{ $offer->delivery }}" required>
                        </div>

                        <div class="mb-3">
                            <label for="number{{ $offer->id }}" class="form-label">عدد منتجات العرض</label>
                            <input type="number" class="form-control" name="number" id="number{{ $offer->id }}" value="{{ $offer->number }}" required>
                        </div>
                      
                      
                     
                        {{-- <div class="mb-3">
                            <label for="product_id" class="form-label">المنتج</label>
                            <select class="form-control" name="product_id" id="product_id" required>
                                @foreach($products as $product)
                                    <option value="{{ $product->id }}">{{ $product->name }}</option>
                                @endforeach
                            </select>
                        </div> --}}
                        <button type="submit" class="btn btn-primary">تحديث</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endforeach

<script>
    function confirmDelete(event) {
        event.preventDefault();

        Swal.fire({
            title: 'تأكيد الحذف',
            text: 'هل أنت متأكد من رغبتك في الحذف؟',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'نعم',
            cancelButtonText: 'لا'
        }).then((result) => {
            if (result.isConfirmed) {
                event.target.submit(); // Submit the form if confirmed
            } else {
                Swal.fire('تم إلغاء الحذف', '', 'info');
            }
        });

        return false; // Prevent the default form submission
    }
</script>
@endsection