@extends('admin.layouts.app')

@section('title', 'تعديل خدمة')
@section('page-title', 'تعديل خدمة')
@section('page-icon', 'fas fa-edit')

@section('content')
<div class="card">
    <div class="card-body">
        <form action="{{ route('admin.passenger-extra-services.update', $service->id) }}" method="POST" enctype="multipart/form-data">
            @csrf
            @method('PUT')
            <div class="form-group">
                <label>العنوان *</label>
                <input type="text" name="title" class="form-control" value="{{ old('title', $service->title) }}" required maxlength="255">
            </div>
            <div class="form-group">
                <label>سطر فرعي</label>
                <input type="text" name="subtitle" class="form-control" value="{{ old('subtitle', $service->subtitle) }}" maxlength="500">
            </div>
            <div class="form-group">
                <label>صورة الخدمة الحالية</label>
                @if($service->image_path)
                    <div class="mb-2"><img src="{{ $service->imagePublicUrl() }}" alt="" style="max-height:120px;border-radius:8px;border:1px solid #ddd;"></div>
                @else
                    <p class="text-muted small">لا توجد صورة</p>
                @endif
                <label class="d-block">استبدال الصورة (اختياري)</label>
                <input type="file" name="image" class="form-control-file" accept="image/jpeg,image/png,image/webp,image/jpg">
            </div>
            <div class="form-group">
                <label>الوصف</label>
                <textarea name="description" class="form-control" rows="5">{{ old('description', $service->description) }}</textarea>
            </div>
            <div class="form-group">
                <label>سعر تقديري</label>
                <input type="number" step="0.01" min="0" name="price_estimate" class="form-control" value="{{ old('price_estimate', $service->price_estimate) }}">
            </div>
            <div class="form-group">
                <label>ترتيب العرض</label>
                <input type="number" name="sort_order" class="form-control" value="{{ old('sort_order', $service->sort_order) }}" min="0">
            </div>
            <div class="custom-control custom-switch mb-3">
                <input type="hidden" name="is_active" value="0">
                <input type="checkbox" class="custom-control-input" id="is_active" name="is_active" value="1" {{ old('is_active', $service->is_active) ? 'checked' : '' }}>
                <label class="custom-control-label" for="is_active">نشط</label>
            </div>
            <button type="submit" class="btn btn-primary">تحديث</button>
            <a href="{{ route('admin.passenger-extra-services.index') }}" class="btn btn-secondary">رجوع</a>
        </form>

        <hr class="my-4">
        <h5>عناصر الخدمة (تظهر للراكب داخل {{ $service->title }})</h5>
        <p class="text-muted small">مثال: خدمة "الغسل والكوي" تحتوي عناصر: غسل قمصان، غسل بدلة، غسل مفروشات...</p>

        @if($service->items->isEmpty())
            <div class="alert alert-light">لا توجد عناصر بعد.</div>
        @else
            <div class="table-responsive mb-3">
                <table class="table table-bordered table-sm">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>صورة</th>
                            <th>العنوان</th>
                            <th>السعر</th>
                            <th>الخصم %</th>
                            <th>السعر بعد الخصم</th>
                            <th>نشط</th>
                            <th>حفظ/حذف</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($service->items as $item)
                            <tr>
                                <form action="{{ route('admin.passenger-extra-services.items.update', [$service->id, $item->id]) }}" method="POST" enctype="multipart/form-data">
                                    @csrf
                                    @method('PUT')
                                    <td>{{ $item->id }}</td>
                                    <td style="width:120px">
                                        @if($item->image_path)
                                            <img src="{{ $item->imagePublicUrl() }}" style="height:40px;width:40px;object-fit:cover;border-radius:6px;">
                                        @endif
                                        <input type="file" name="image" class="form-control-file mt-1" accept="image/jpeg,image/png,image/webp,image/jpg">
                                    </td>
                                    <td style="min-width:220px">
                                        <input type="text" name="title" class="form-control form-control-sm mb-1" value="{{ $item->title }}" required>
                                        <input type="text" name="subtitle" class="form-control form-control-sm" value="{{ $item->subtitle }}" placeholder="سطر فرعي">
                                    </td>
                                    <td style="width:120px"><input type="number" step="0.01" min="0" name="price" class="form-control form-control-sm" value="{{ $item->price }}" required></td>
                                    <td style="width:100px"><input type="number" step="0.01" min="0" max="100" name="discount_percent" class="form-control form-control-sm" value="{{ $item->discount_percent ?? 0 }}"></td>
                                    <td>{{ number_format($item->finalPrice(), 2) }}</td>
                                    <td style="width:100px">
                                        <input type="hidden" name="is_active" value="0">
                                        <input type="checkbox" name="is_active" value="1" {{ $item->is_active ? 'checked' : '' }}>
                                    </td>
                                    <td style="white-space:nowrap">
                                        <input type="number" min="0" name="sort_order" class="form-control form-control-sm mb-1" value="{{ $item->sort_order }}">
                                        <button class="btn btn-sm btn-primary" type="submit">حفظ</button>
                                </form>
                                        <form action="{{ route('admin.passenger-extra-services.items.destroy', [$service->id, $item->id]) }}" method="POST" class="d-inline" onsubmit="return confirm('حذف هذا العنصر؟');">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-sm btn-danger">حذف</button>
                                        </form>
                                    </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @endif

        <h6 class="mt-3">إضافة عنصر جديد</h6>
        <form action="{{ route('admin.passenger-extra-services.items.store', $service->id) }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="row">
                <div class="col-md-4">
                    <label>العنوان *</label>
                    <input type="text" name="title" class="form-control" required>
                </div>
                <div class="col-md-3">
                    <label>سعر العنصر *</label>
                    <input type="number" step="0.01" min="0" name="price" class="form-control" required>
                </div>
                <div class="col-md-2">
                    <label>الخصم %</label>
                    <input type="number" step="0.01" min="0" max="100" name="discount_percent" class="form-control" value="0">
                </div>
                <div class="col-md-3">
                    <label>الصورة</label>
                    <input type="file" name="image" class="form-control-file" accept="image/jpeg,image/png,image/webp,image/jpg">
                </div>
            </div>
            <div class="row mt-2">
                <div class="col-md-6">
                    <label>سطر فرعي</label>
                    <input type="text" name="subtitle" class="form-control">
                </div>
                <div class="col-md-2">
                    <label>ترتيب</label>
                    <input type="number" min="0" name="sort_order" class="form-control" value="0">
                </div>
                <div class="col-md-2 d-flex align-items-end">
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" name="is_active" value="1" checked>
                        <label class="form-check-label">نشط</label>
                    </div>
                </div>
                <div class="col-md-2 d-flex align-items-end">
                    <button type="submit" class="btn btn-success w-100">إضافة عنصر</button>
                </div>
            </div>
        </form>
    </div>
</div>
@endsection