@extends('layouts.app')

@section('page_title', 'Work Reports')

@section('content')
    <div class="row mb-4">
        <div class="col-md-6">
            <h4 class="fw-bold">My Work Reports</h4>
        </div>
        <div class="col-md-6 text-md-end">
            <a href="{{ route('reports.create') }}" class="btn btn-primary px-4"><i class="bi bi-plus-lg me-2"></i> Submit New
                Report</a>
        </div>
    </div>

    <div class="card border-0 shadow-sm">
        <div class="card-body p-4">
            <div class="table-responsive">
                <table class="table datatable table-hover align-middle">
                    <thead class="bg-light">
                        <tr>
                            <th class="border-0">Date</th>
                            <th class="border-0">Attendance</th>
                            <th class="border-0">Summary</th>
                            <th class="border-0">Tasks</th>
                            <th class="border-0">Status</th>
                            <th class="border-0 text-center">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($reports as $report)
                            <tr>
                                <td class="fw-semibold">{{ $report->created_at->format('d M, Y') }}</td>
                                <td>
                                    @if ($report->attendance)
                                        <span
                                            class="small text-muted">{{ $report->attendance->check_in ? $report->attendance->check_in->format('h:i A') : 'Manual' }}</span>
                                    @endif
                                </td>
                                <td><span class="text-muted small">{{ Str::limit($report->raw_summary, 50) }}</span></td>
                                <td><span class="badge bg-secondary-subtle text-secondary">{{ $report->total_tasks }}
                                        tasks</span></td>
                                <td>
                                    <span
                                        class="badge bg-{{ $report->approval_status == 'approved' ? 'success' : ($report->approval_status == 'rejected' ? 'danger' : 'warning') }}-subtle text-{{ $report->approval_status == 'approved' ? 'success' : ($report->approval_status == 'rejected' ? 'danger' : 'warning') }} px-3">
                                        {{ ucfirst($report->approval_status) }}
                                    </span>
                                </td>
                                <td class="text-center">
                                    <a href="{{ route('reports.show', $report->id) }}"
                                        class="btn btn-light btn-sm rounded-circle"><i class="bi bi-eye"></i></a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <div class="mt-4">
                {{ $reports->links() }}
            </div>
        </div>
    </div>
@endsection