@extends('layout.mainlayout')

@section('content')
<div class="page-wrapper">
    <div class="content">

        <div class="page-header">
            <h3 class="page-title">Manager Leave Approval</h3>
            <p class="text-muted">Override enabled for pending lead approvals</p>
        </div>

        <form method="POST" action="{{ route('leave.approve.submit') }}">
            @csrf

            {{-- FILTER --}}
            <div class="mb-3">
                <a href="?filter=pending" class="btn btn-sm {{ $filter=='pending'?'btn-primary':'btn-outline-primary' }}">Pending</a>
                <a href="?filter=override" class="btn btn-sm {{ $filter=='override'?'btn-danger':'btn-outline-danger' }}">Override</a>
                <a href="?filter=approved" class="btn btn-sm {{ $filter=='approved'?'btn-success':'btn-outline-success' }}">Approved</a>
            </div>

            <div class="card">
                <div class="card-body table-responsive">

                    <table class="table table-bordered align-middle">
                        <thead>
                            <tr>
                                <th><input type="checkbox" id="selectAll"></th>
                                <th>Resource</th>
                                <th>Date Range</th>
                                <th>Total Days</th>
                                <th>Lead Status</th>
                                <th>Manager Status</th>
                                <th>Details</th>
                            </tr>
                        </thead>

                        <tbody>
                        @forelse($records as $leave)
                            <tr>
                                <td><input type="checkbox" name="leave_ids[]" value="{{ $leave->id }}" class="row"></td>
                                <td>{{ $leave->user->name }}</td>
                                <td>{{ $leave->start_date }} → {{ $leave->end_date }}</td>
                                <td>{{ $leave->total_days }}</td>

                                <td>
                                    <span class="badge bg-{{ $leave->lead_status=='approved'?'success':'warning' }}">
                                        {{ ucfirst($leave->lead_status) }}
                                    </span>
                                </td>

                                <td>
                                    <span class="badge bg-warning">Pending</span>
                                </td>

                                <td>
                                    <button type="button" class="btn btn-sm btn-outline-primary"
                                        data-bs-toggle="collapse"
                                        data-bs-target="#detail{{ $leave->id }}">
                                        View
                                    </button>
                                </td>
                            </tr>

                            <tr class="collapse" id="detail{{ $leave->id }}">
                                <td colspan="7">
                                    <div class="p-3 bg-light rounded">
                                        <strong>Reason:</strong> {{ $leave->reason }} <br>
                                        <strong>Project Lead:</strong> {{ optional($leave->projectLead)->name }} <br>
                                        <strong>Local Lead:</strong> {{ optional($leave->localLead)->name }} <br>
                                        <strong>Manager:</strong> {{ optional($leave->manager)->name }}
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="7" class="text-center">No records</td></tr>
                        @endforelse
                        </tbody>

                    </table>

                    <div class="mt-3">
                        @if($filter !== 'approved')
                            <button class="btn btn-success">Approve Selected</button>
                            <button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#rejectModal">
                                Reject Selected
                            </button>
                        @endif
                    </div>

                </div>
            </div>
        </form>
    </div>
</div>
@endsection