@extends('admin.layouts.base')

@section('title', 'Awaiting Approval - Extension Requests')

@section('content')
    <div class="container-fluid">
        <div class="row mb-4">
            <div class="col-md-8">
                <h3><i class="fas fa-clock text-warning"></i> Extension Requests Awaiting Approval</h3>
                <p class="text-muted">Review and approve pending extension requests</p>
            </div>
            <div class="col-md-4 text-end">
                <a href="{{ route('admin.warehouse-extensions.index') }}" class="btn btn-outline-secondary">
                    <i class="fas fa-list me-2"></i> All Requests
                </a>
            </div>
        </div>

        @if (isset($statistics))
            <div class="row mb-4">
                <div class="col-md-4">
                    <div class="card border-warning">
                        <div class="card-body">
                            <h6 class="text-muted">Pending Review</h6>
                            <h2 class="mb-0 text-warning">{{ $statistics['pending'] ?? 0 }}</h2>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card border-danger">
                        <div class="card-body">
                            <h6 class="text-muted">Escalated</h6>
                            <h2 class="mb-0 text-danger">{{ $statistics['escalated'] ?? 0 }}</h2>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card border-info">
                        <div class="card-body">
                            <h6 class="text-muted">Total Awaiting</h6>
                            <h2 class="mb-0 text-info">{{ $statistics['awaiting'] ?? 0 }}</h2>
                        </div>
                    </div>
                </div>
            </div>
        @endif

        <div class="card">
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Priority</th>
                                <th>ID</th>
                                <th>Customer</th>
                                <th>Booking</th>
                                <th>Warehouse</th>
                                <th>Extension Period</th>
                                <th>Cost</th>
                                <th>Status</th>
                                <th>Requested</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($extensionRequests->sortByDesc('escalated_at')->sortByDesc('created_at') as $request)
                                <tr class="{{ $request->status === 'escalated' ? 'table-danger' : '' }}">
                                    <td>
                                        @if ($request->status === 'escalated')
                                            <span class="badge bg-danger"><i class="fas fa-exclamation-triangle"></i>
                                                URGENT</span>
                                        @else
                                            <span class="text-muted">Normal</span>
                                        @endif
                                    </td>
                                    <td><strong>#{{ $request->id }}</strong></td>
                                    <td>
                                        {{ $request->user->fullname }}<br>
                                        <small class="text-muted">{{ $request->user->email }}</small>
                                    </td>
                                    <td>
                                        <strong>{{ $request->booking->booking_code }}</strong><br>
                                        <small class="text-muted">{{ $request->booking->warehouse->name }}</small>
                                    </td>
                                    <td>{{ $request->booking->warehouse->name }}</td>
                                    <td>
                                        <small>{{ $request->current_end_date->format('M d') }} →</small><br>
                                        <strong>{{ $request->requested_end_date->format('M d, Y') }}</strong><br>
                                        <small class="text-primary">(+{{ $request->additional_days }} days)</small>
                                    </td>
                                    <td><strong>${{ number_format($request->additional_amount, 2) }}</strong></td>
                                    <td>
                                        @if ($request->status === 'escalated')
                                            <span class="badge bg-danger">Escalated</span>
                                        @else
                                            <span class="badge bg-warning">Pending</span>
                                        @endif
                                    </td>
                                    <td>
                                        {{ $request->created_at->diffForHumans() }}<br>
                                        <small class="text-muted">{{ $request->created_at->format('M d, H:i') }}</small>
                                    </td>
                                    <td>
                                        <a href="{{ route('admin.warehouse-extensions.show', $request) }}"
                                            class="btn btn-sm btn-primary mb-1">
                                            <i class="fas fa-eye"></i> Review
                                        </a>
                                        <button type="button" class="btn btn-sm btn-success mb-1"
                                            onclick="quickApprove({{ $request->id }})">
                                            <i class="fas fa-check"></i> Approve
                                        </button>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="10" class="text-center py-5">
                                        <i class="fas fa-check-circle fa-3x text-success mb-3"></i>
                                        <h5>All Caught Up!</h5>
                                        <p class="text-muted">No extension requests awaiting approval.</p>
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    @push('scripts')
        <script>
            function quickApprove(id) {
                if (confirm('Quick approve thisextension request without notes?')) {
                    const btn = event.target.closest('button');
                    btn.disabled = true;
                    btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Approving...';

                    fetch(`/admin/warehouse-extensions/${id}/approve`, {
                            method: 'POST',
                            headers: {
                                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
                                'Content-Type': 'application/json'
                            },
                            body: JSON.stringify({
                                admin_notes: 'Quick approved from awaiting list'
                            })
                        })
                        .then(r => r.json())
                        .then(data => {
                            if (data.success !== false) {
                                location.reload();
                            } else {
                                alert(data.message || 'Error approving request');
                                btn.disabled = false;
                                btn.innerHTML = '<i class="fas fa-check"></i> Approve';
                            }
                        })
                        .catch(err => {
                            alert('Network error: ' + err.message);
                            btn.disabled = false;
                            btn.innerHTML = '<i class="fas fa-check"></i> Approve';
                        });
                }
            }
        </script>
    @endpush
@endsection