@extends('layouts.app')

@section('title', 'NDRT Surge')

@section('content')
<div class="container-fluid">
    {{-- show notifications here --}}
    @if(Auth::user()->isAdmin() || Auth::user()->isOperationsManager())
        @if(Auth::user()->unreadNotifications->count() > 0)
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            You have {{ Auth::user()->unreadNotifications->count() }} unread notifications.
            Click <a href="{{ route('notifications.index') }}">here</a> to view them.
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        @endif
    @endif
    {{-- if there are pending deployments, show a notification --}}
    @php
        $pendingDeployments = \App\Models\Deployment::where('status', 'pending')->count();
    @endphp

    @if((Auth::user()->isAdmin() || Auth::user()->isOperationsManager()) && $pendingDeployments > 0)
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            There are {{ $pendingDeployments }} new Deployments that need Approval.
            Click <a href="{{ route('deployments.index') }}">here</a> to approve.
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif
    <div class="page-header">
        <h1>NDRT Surge Management</h1>
        @if(Auth::user()->isAdmin() || Auth::user()->isOperationsManager())
        <a href="{{ route('ndrt.create') }}" class="btn btn-primary">
            <i class="fas fa-plus"></i> Register New NDRT Officer
        </a>
        @endif
    </div>

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

    <!-- Search and Filters -->
    <div class="card mb-4">
        <div class="card-body">
            <form method="GET" action="{{ route('ndrt.index') }}" class="row g-3">
                <div class="col-md-4">
                    <input type="text" name="search" class="form-control" 
                           placeholder="Search by name or ID number" 
                           value="{{ request('search') }}">
                </div>
                <div class="col-md-3">
                    <select name="branch" class="form-select">
                        <option value="">All Branches</option>
                        @foreach($branches as $branch)
                            <option value="{{ $branch->id }}" 
                                {{ request('branch') == $branch->id ? 'selected' : '' }}>
                                {{ $branch->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <select name="availability" class="form-select">
                        <option value="">All Availability</option>
                        <option value="1" {{ request('availability') == '1' ? 'selected' : '' }}>
                            Available
                        </option>
                        <option value="0" {{ request('availability') == '0' ? 'selected' : '' }}>
                            Not Available
                        </option>
                    </select>
                </div>
                <div class="col-md-2">
                    <button type="submit" class="btn btn-secondary w-100">Filter</button>
                </div>
            </form>
        </div>
    </div>

    <!-- Officers Table -->
    <div class="card">
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>Photo</th>
                            <th>Full Name</th>
                            <th>ID Number</th>
                            <th>Gender</th>
                            <th>Age</th>
                            <th>Location</th>
                            <th>Phone</th>
                            <th>Deployments(Completed)</th>
                            <th>Available</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($officers as $officer)
                        <tr>
                            <td>
                                @if($officer->photo_path)
                                    <img src="{{ Storage::url($officer->photo_path) }}" 
                                         alt="{{ $officer->full_name }}" 
                                         class="officer-photo">
                                @else
                                    <div class="officer-photo-placeholder">
                                        {{ substr($officer->first_name, 0, 1) }}{{ substr($officer->surname, 0, 1) }}
                                    </div>
                                @endif
                            </td>
                            <td>{{ $officer->full_name }}</td>
                            <td>{{ $officer->id_number }}</td>
                            <td>{{ $officer->gender }}</td>
                            <td>{{ $officer->age }}</td>
                            <td>
                                {{ $officer->location_type }}
                                @if($officer->branch)
                                    <br><small class="text-muted">{{ $officer->branch->name }}</small>
                                @endif
                            </td>
                            <td>{{ $officer->phone_1 }}</td>
                            <td>
                                <span class="badge bg-info">{{ $officer->deployment_count }}</span>
                            </td>
                            <td>
                                @if($officer->available_for_deployment)
                                    <span class="badge bg-success">Yes</span>
                                @else
                                    <span class="badge bg-danger">No</span>
                                @endif
                            </td>
                            <td>
                                <div class="btn-group btn-group-sm">
                                    <a href="{{ route('ndrt.show', $officer) }}" 
                                       class="btn btn-info" title="View">
                                        <i class="fas fa-eye"></i>
                                    </a>
                                    <a href="{{ route('ndrt.edit', $officer) }}" 
                                       class="btn btn-warning" title="Edit">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <form action="{{ route('ndrt.destroy', $officer) }}" 
                                          method="POST" 
                                          onsubmit="return confirm('Are you sure you want to delete this officer?');"
                                          style="display: inline;">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn btn-danger" title="Delete">
                                            <i class="fas fa-trash"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="10" class="text-center">No NDRT Surge found.</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            {{ $officers->links() }}
        </div>
    </div>
</div>
@endsection