@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('social-insurance.exportRecords', $filters) }}" class="btn btn-success">
            <i class="fas fa-file-csv"></i> تصدير CSV
        </a>
        <a href="{{ route('social-insurance.calculate') }}" class="btn btn-primary">
            <i class="fas fa-calculator"></i> حساب جديد
        </a>
    </div>
</div>

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

<div class="filter-bar">
    <form method="GET" class="filter-form">
        <div class="filter-group">
            <label>الشهر</label>
            <input type="month" name="month" class="form-input" value="{{ $filters['month'] ?? '' }}">
        </div>
        <div class="filter-group">
            <label>الموظف</label>
            <select name="employee_id" class="form-select">
                <option value="">الكل</option>
                @foreach($employees as $employee)
                    <option value="{{ $employee->id }}" {{ ($filters['employee_id'] ?? '') == $employee->id ? 'selected' : '' }}>
                        {{ $employee->first_name }} {{ $employee->last_name }}
                    </option>
                @endforeach
            </select>
        </div>
        <div class="filter-group">
            <label>الدولة</label>
            <select name="country_code" class="form-select">
                <option value="">الكل</option>
                @foreach($countries as $code => $name)
                    <option value="{{ $code }}" {{ ($filters['country_code'] ?? '') === $code ? 'selected' : '' }}>{{ $name }}</option>
                @endforeach
            </select>
        </div>
        <div class="filter-group">
            <label>الحالة</label>
            <select name="status" class="form-select">
                <option value="">الكل</option>
                <option value="calculated" {{ ($filters['status'] ?? '') === 'calculated' ? 'selected' : '' }}>محسوب</option>
                <option value="approved" {{ ($filters['status'] ?? '') === 'approved' ? 'selected' : '' }}>معتمد</option>
                <option value="paid" {{ ($filters['status'] ?? '') === 'paid' ? 'selected' : '' }}>مدفوع</option>
            </select>
        </div>
        <div class="filter-group">
            <label>&nbsp;</label>
            <button type="submit" class="btn btn-primary"><i class="fas fa-filter"></i> تصفية</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-body">
        <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>
                        <th>الحالة</th>
                        <th>إجراءات</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($records as $record)
                        <tr>
                            <td>{{ optional($record->employee)->first_name }} {{ optional($record->employee)->last_name }}</td>
                            <td>{{ optional($record->config)->country_name_ar }}</td>
                            <td>{{ optional($record->config)->scheme_name }}</td>
                            <td>{{ optional($record->month)->format('Y-m') }}</td>
                            <td>{{ number_format($record->base_salary_amount, 2) }}</td>
                            <td>{{ number_format($record->employee_contribution, 2) }}</td>
                            <td>{{ number_format($record->employer_contribution, 2) }}</td>
                            <td><strong>{{ number_format($record->total_contribution, 2) }}</strong></td>
                            <td><span class="status-badge {{ $record->statusBadgeClass() }}">{{ $record->statusLabel() }}</span></td>
                            <td>
                                <a href="{{ route('social-insurance.showRecord', $record->id) }}" class="btn btn-secondary btn-sm">
                                    <i class="fas fa-eye"></i> عرض
                                </a>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="10">
                                <div class="empty-state">
                                    <i class="fas fa-inbox"></i>
                                    <p>لا توجد سجلات مطابقة</p>
                                </div>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        <div style="margin-top: 16px;">
            {{ $records->links() }}
        </div>
    </div>
</div>

@if(isset($singleRecord))
    <div class="card" style="margin-top: 20px;">
        <div class="card-header">
            <h3>تفاصيل السجل #{{ $singleRecord->id }}</h3>
        </div>
        <div class="card-body">
            <div class="form-grid cols-2">
                <div><strong>الموظف:</strong> {{ optional($singleRecord->employee)->first_name }} {{ optional($singleRecord->employee)->last_name }}</div>
                <div><strong>الدولة:</strong> {{ optional($singleRecord->config)->country_name_ar }}</div>
                <div><strong>النظام:</strong> {{ optional($singleRecord->config)->scheme_name }}</div>
                <div><strong>الشهر:</strong> {{ optional($singleRecord->month)->format('Y-m') }}</div>
                <div><strong>أساس الراتب:</strong> {{ number_format($singleRecord->base_salary_amount, 2) }}</div>
                <div><strong>حصة الموظف:</strong> {{ number_format($singleRecord->employee_contribution, 2) }}</div>
                <div><strong>حصة صاحب العمل:</strong> {{ number_format($singleRecord->employer_contribution, 2) }}</div>
                <div><strong>الإجمالي:</strong> {{ number_format($singleRecord->total_contribution, 2) }}</div>
                <div><strong>الحالة:</strong> <span class="status-badge {{ $singleRecord->statusBadgeClass() }}">{{ $singleRecord->statusLabel() }}</span></div>
            </div>
            @if($singleRecord->notes)
                <div class="form-group" style="margin-top: 16px;">
                    <strong>ملاحظات:</strong>
                    <p>{{ $singleRecord->notes }}</p>
                </div>
            @endif
        </div>
    </div>
@endif
@endsection