@extends('layouts.app')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">إنشاء ملف WPS</h1>
        <p class="page-subtitle">اختر الدولة والشهر لمعاينة وإنشاء ملف حماية الأجور</p>
    </div>
    <div class="page-actions">
        <a href="{{ route('wps.index') }}" class="btn btn-secondary">
            <i class="fas fa-arrow-right"></i> رجوع
        </a>
    </div>
</div>

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

<div class="card">
    <div class="card-header">
        <h3>بيانات الملف</h3>
    </div>
    <div class="card-body">
        <form action="{{ route('wps.preview') }}" method="POST" class="filter-form">
            @csrf
            <div class="form-grid cols-2">
                <div class="form-group">
                    <label class="form-label required">الدولة / النظام</label>
                    <select name="country_code" class="form-select" required>
                        <option value="">-- اختر الدولة --</option>
                        @foreach ($systems as $code => $system)
                            <option value="{{ $code }}" {{ $countryCode == $code ? 'selected' : '' }}>
                                {{ $system['name'] }} ({{ $system['short'] }})
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label required">الشهر</label>
                    <input type="month" name="month" class="form-input" value="{{ $month ?? date('Y-m') }}" required>
                    <span class="form-hint">شهر الرواتب المطلوب إنشاء الملف له</span>
                </div>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-primary">
                    <i class="fas fa-search"></i> معاينة الموظفين
                </button>
            </div>
        </form>
    </div>
</div>

@if ($summary)
    <div class="stats-grid cols-3">
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-users"></i></div>
            <div class="stat-value">{{ $summary['total_employees'] }}</div>
            <div class="stat-label">عدد الموظفين</div>
        </div>
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-money-bill-wave"></i></div>
            <div class="stat-value">{{ number_format($summary['total_net'], 2) }}</div>
            <div class="stat-label">إجمالي الصافي</div>
        </div>
        <div class="stat-card">
            <div class="stat-icon"><i class="fas fa-coins"></i></div>
            <div class="stat-value">{{ number_format($summary['total_basic'], 2) }}</div>
            <div class="stat-label">إجمالي الأساسي</div>
        </div>
    </div>

    <div class="card">
        <div class="card-header">
            <h3>معاينة الموظفين</h3>
        </div>
        <div class="card-body">
            @if ($employees->isEmpty())
                <div class="empty-state">
                    <i class="fas fa-user-slash"></i>
                    <p>لا يوجد موظفون لهذه الدولة</p>
                </div>
            @else
                <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 ($employees as $row)
                                <tr>
                                    <td>{{ $row['employee']->employee_code }}</td>
                                    <td>{{ $row['employee']->first_name }} {{ $row['employee']->last_name }}</td>
                                    <td>{{ $row['employee']->national_id }}</td>
                                    <td>{{ $row['employee']->bank_name }}</td>
                                    <td>{{ number_format($row['amounts']['basic_salary'], 2) }}</td>
                                    <td>{{ number_format($row['amounts']['housing_allowance'] + $row['amounts']['transport_allowance'] + $row['amounts']['other_allowances'], 2) }}</td>
                                    <td>{{ number_format($row['amounts']['deductions'], 2) }}</td>
                                    <td>{{ number_format($row['amounts']['net_salary'], 2) }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <form action="{{ route('wps.download') }}" method="POST" style="margin-top: 1rem;">
                    @csrf
                    <input type="hidden" name="country_code" value="{{ $countryCode }}">
                    <input type="hidden" name="month" value="{{ $month }}">
                    <button type="submit" class="btn btn-success">
                        <i class="fas fa-file-download"></i> إنشاء وتنزيل ملف WPS
                    </button>
                </form>
            @endif
        </div>
    </div>
@endif
@endsection