@extends('layouts.app')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">عروض التوظيف</h1>
        <p class="page-subtitle">إدارة ومتابعة عروض العمل المرسلة للمرشحين</p>
    </div>
    <div class="page-actions">
        <a href="{{ route('offer-letters.create') }}" class="btn btn-primary">
            <i class="fa-solid fa-plus"></i> إنشاء عرض توظيف جديد
        </a>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success">{{ session('success') }}</div>
@endif

<div class="filter-bar">
    <form method="GET" action="{{ route('offer-letters.index') }}" class="filter-form">
        <div class="filter-group">
            <label class="form-label">الحالة</label>
            <select name="status" class="form-select" onchange="this.form.submit()">
                <option value="">جميع الحالات</option>
                <option value="draft" @selected(request('status')=='draft')>مسودة</option>
                <option value="sent" @selected(request('status')=='sent')>تم الإرسال</option>
                <option value="accepted" @selected(request('status')=='accepted')>مقبول</option>
                <option value="rejected" @selected(request('status')=='rejected')>مرفوض</option>
                <option value="expired" @selected(request('status')=='expired')>منتهي الصلاحية</option>
                <option value="withdrawn" @selected(request('status')=='withdrawn')>مسحوب</option>
            </select>
        </div>
        <div class="filter-group">
            <label class="form-label">بحث</label>
            <input type="text" name="search" class="form-input" placeholder="اسم المرشح أو رقم العرض" value="{{ request('search') }}">
        </div>
        <div class="filter-group">
            <button type="submit" class="btn btn-secondary"><i class="fa-solid fa-search"></i> بحث</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-body">
        @if($offers->count())
        <div class="table-responsive">
            <table class="data-table">
                <thead>
                    <tr>
                        <th>رقم العرض</th>
                        <th>اسم المرشح</th>
                        <th>المسمى الوظيفي</th>
                        <th>القسم</th>
                        <th>إجمالي الحزمة</th>
                        <th>تاريخ المباشرة</th>
                        <th>الحالة</th>
                        <th>الإجراءات</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($offers as $offer)
                    <tr>
                        <td><span class="code-badge">{{ $offer->offer_number }}</span></td>
                        <td>{{ $offer->candidate_name }}</td>
                        <td>{{ $offer->position_title }}</td>
                        <td>{{ $offer->department->name ?? '—' }}</td>
                        <td>{{ number_format($offer->total_package, 2) }}</td>
                        <td>{{ $offer->start_date ? $offer->start_date->format('Y-m-d') : '—' }}</td>
                        <td><span class="status-badge {{ $offer->statusBadgeClass() }}">{{ $offer->statusLabel() }}</span></td>
                        <td>
                            <div class="action-btns">
                                <a href="{{ route('offer-letters.show', $offer->id) }}" class="action-btn" title="عرض">
                                    <i class="fa-solid fa-eye"></i>
                                </a>
                                <a href="{{ route('offer-letters.pdf', $offer->id) }}" class="action-btn" title="تحميل PDF">
                                    <i class="fa-solid fa-file-pdf"></i>
                                </a>
                            </div>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        <div class="pagination-wrap">
            {{ $offers->links() }}
        </div>
        @else
        <div class="empty-state">
            <i class="fa-solid fa-file-signature"></i>
            <p>لا توجد عروض توظيف حتى الآن</p>
            <a href="{{ route('offer-letters.create') }}" class="btn btn-primary">إنشاء عرض جديد</a>
        </div>
        @endif
    </div>
</div>
@endsection