@extends('layouts.admin')

@section('page_title', $isRtl ? 'المستخدمون' : 'Users')

@push('styles')
<style>
    .umodal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.5);display:none;align-items:center;justify-content:center;z-index:200;}
    .umodal-backdrop.open{display:flex;}
    .umodal{background:#fff;border-radius:12px;padding:1.5rem;max-width:500px;width:90%;}
    .umodal h3{margin:0 0 1rem;font-size:1.1rem;}
</style>
@endpush

@section('content')
<div class="admin-card">
    <div class="card-head">
        <h2>{{ $isRtl ? 'قائمة المستخدمين' : 'Users List' }}</h2>
        <a href="{{ route('admin.users.create') }}" class="btn-admin btn-admin-primary">
            <i class="fa-solid fa-plus"></i> {{ $isRtl ? 'إضافة مستخدم' : 'Add User' }}
        </a>
    </div>
    <table class="admin-table">
        <thead>
        <tr>
            <th>{{ $isRtl ? 'الاسم' : 'Name' }}</th>
            <th>{{ $isRtl ? 'البريد' : 'Email' }}</th>
            <th>{{ $isRtl ? 'الهاتف' : 'Phone' }}</th>
            <th>{{ $isRtl ? 'الدور' : 'Role' }}</th>
            <th>{{ $isRtl ? 'التحقق' : 'Verified' }}</th>
            <th>{{ $isRtl ? 'الحالة' : 'Status' }}</th>
            <th style="min-width:240px;"></th>
        </tr>
        </thead>
        <tbody>
        @forelse($users as $user)
            <tr>
                <td><strong>{{ $user->name }}</strong></td>
                <td>{{ $user->email }}</td>
                <td>{{ $user->phone ?? '-' }}</td>
                <td><span class="badge-pill">{{ $user->role }}</span></td>
                <td>
                    @if($user->email_verified_at)
                        <span class="badge-pill badge-success"><i class="fa-solid fa-check"></i></span>
                    @else
                        <span class="badge-pill badge-warning">{{ $isRtl ? 'غير مؤكد' : 'Unverified' }}</span>
                    @endif
                </td>
                <td>
                    @if($user->is_active)
                        <span class="badge-pill badge-success">{{ $isRtl ? 'نشط' : 'Active' }}</span>
                    @else
                        <span class="badge-pill badge-muted">{{ $isRtl ? 'معطل' : 'Inactive' }}</span>
                    @endif
                </td>
                <td>
                    <a href="{{ route('admin.users.edit', $user) }}" class="btn-admin btn-admin-outline btn-admin-sm" title="{{ $isRtl ? 'تعديل' : 'Edit' }}">
                        <i class="fa-solid fa-pen"></i>
                    </a>
                    <button type="button" class="btn-admin btn-admin-outline btn-admin-sm" onclick="openModal('email-{{ $user->id }}')" title="{{ $isRtl ? 'إرسال إيميل' : 'Send Email' }}">
                        <i class="fa-solid fa-envelope"></i>
                    </button>
                    <button type="button" class="btn-admin btn-admin-outline btn-admin-sm" onclick="openModal('pwd-{{ $user->id }}')" title="{{ $isRtl ? 'تغيير كلمة المرور' : 'Reset Password' }}">
                        <i class="fa-solid fa-key"></i>
                    </button>
                    @if(!$user->email_verified_at)
                        <form method="POST" action="{{ route('admin.users.resend-verification', $user) }}" style="display:inline;">
                            @csrf
                            <button class="btn-admin btn-admin-outline btn-admin-sm" title="{{ $isRtl ? 'إعادة إرسال التحقق' : 'Resend Verification' }}">
                                <i class="fa-solid fa-paper-plane"></i>
                            </button>
                        </form>
                    @endif
                    @if($user->id !== auth()->id())
                        <form method="POST" action="{{ route('admin.users.destroy', $user) }}" style="display:inline;" onsubmit="return confirm('{{ $isRtl ? 'تأكيد الحذف؟' : 'Confirm delete?' }}')">
                            @csrf @method('DELETE')
                            <button class="btn-admin btn-admin-danger btn-admin-sm"><i class="fa-solid fa-trash"></i></button>
                        </form>
                    @endif

                    {{-- Send Email Modal --}}
                    <div class="umodal-backdrop" id="email-{{ $user->id }}" onclick="if(event.target===this)closeModal('email-{{ $user->id }}')">
                        <div class="umodal">
                            <h3>{{ $isRtl ? 'إرسال إيميل إلى' : 'Send Email to' }} {{ $user->name }}</h3>
                            <form method="POST" action="{{ route('admin.users.send-email', $user) }}">
                                @csrf
                                <div class="form-field" style="margin-bottom:.75rem;">
                                    <label>{{ $isRtl ? 'الموضوع' : 'Subject' }}</label>
                                    <input type="text" name="subject" required>
                                </div>
                                <div class="form-field" style="margin-bottom:1rem;">
                                    <label>{{ $isRtl ? 'الرسالة' : 'Message' }}</label>
                                    <textarea name="message" rows="6" required></textarea>
                                </div>
                                <div style="display:flex;gap:.5rem;justify-content:flex-end;">
                                    <button type="button" class="btn-admin btn-admin-outline" onclick="closeModal('email-{{ $user->id }}')">{{ $isRtl ? 'إلغاء' : 'Cancel' }}</button>
                                    <button class="btn-admin btn-admin-primary"><i class="fa-solid fa-paper-plane"></i> {{ $isRtl ? 'إرسال' : 'Send' }}</button>
                                </div>
                            </form>
                        </div>
                    </div>

                    {{-- Reset Password Modal --}}
                    <div class="umodal-backdrop" id="pwd-{{ $user->id }}" onclick="if(event.target===this)closeModal('pwd-{{ $user->id }}')">
                        <div class="umodal">
                            <h3>{{ $isRtl ? 'إعادة تعيين كلمة المرور' : 'Reset Password' }} — {{ $user->name }}</h3>
                            <form method="POST" action="{{ route('admin.users.reset-password', $user) }}">
                                @csrf
                                <div class="form-field" style="margin-bottom:1rem;">
                                    <label>{{ $isRtl ? 'كلمة المرور الجديدة (اختياري)' : 'New Password (optional)' }}</label>
                                    <input type="text" name="password" placeholder="{{ $isRtl ? 'اتركها فارغة لتوليد واحدة عشوائية' : 'Leave blank to auto-generate' }}">
                                    <small style="color:#6b7280;">{{ $isRtl ? 'سيتم إرسال كلمة المرور الجديدة إلى إيميل العميل.' : 'The new password will be emailed to the user.' }}</small>
                                </div>
                                <div style="display:flex;gap:.5rem;justify-content:flex-end;">
                                    <button type="button" class="btn-admin btn-admin-outline" onclick="closeModal('pwd-{{ $user->id }}')">{{ $isRtl ? 'إلغاء' : 'Cancel' }}</button>
                                    <button class="btn-admin btn-admin-primary"><i class="fa-solid fa-key"></i> {{ $isRtl ? 'تغيير وإرسال' : 'Reset & Email' }}</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </td>
            </tr>
        @empty
            <tr><td colspan="7" style="text-align:center;color:#9ca3af;padding:2rem;">{{ $isRtl ? 'لا يوجد مستخدمون' : 'No users yet' }}</td></tr>
        @endforelse
        </tbody>
    </table>
    <div style="margin-top:1rem;">{{ $users->links() }}</div>
</div>

@push('scripts')
<script>
    function openModal(id){ document.getElementById(id).classList.add('open'); }
    function closeModal(id){ document.getElementById(id).classList.remove('open'); }
</script>
@endpush
@endsection