@extends('layouts.side_bar')

@section('content')
<div class="container-fluid py-4">
    <div class="row justify-content-center">
        <div class="col-12 col-xl-10">
            <div class="card border-0 shadow-sm mb-4 bg-info-subtle">
                <div class="card-body d-flex flex-wrap justify-content-between align-items-center gap-2 p-4">
                    <div>
                        <h2 class="h4 mb-1">Assignments</h2>
                        <p class="text-secondary mb-0">Manage your course assignments</p>
                    </div>
                    <a href="{{ route('assignments.create') }}" class="btn btn-primary rounded-pill">Create New Assignment</a>
                </div>
            </div>

            @if (session('success'))
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    {{ session('success') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            @endif

            <div class="card border-0 shadow-sm">
                <div class="card-body p-0">
                    @if ($assignments->count() > 0)
                        <div class="table-responsive">
                            <table class="table table-hover mb-0">
                                <thead class="table-light">
                                    <tr>
                                        <th class="ps-4">Title</th>
                                        <th>Course</th>
                                        <th>Subject</th>
                                        <th>Due Date</th>
                                        <th>Status</th>
                                        <th>Submissions</th>
                                        <th class="text-end pe-4">Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($assignments as $assignment)
                                        <tr>
                                            <td class="ps-4">
                                                <strong>{{ $assignment->title }}</strong>
                                            </td>
                                            <td>{{ $assignment->course->title }}</td>
                                            <td>{{ $assignment->subject->name }}</td>
                                            <td>{{ $assignment->due_date->format('M d, Y') }}</td>
                                            <td>
                                                <span class="badge bg-{{ $assignment->status === 'open' ? 'success' : 'secondary' }}">
                                                    {{ ucfirst($assignment->status) }}
                                                </span>
                                            </td>
                                            <td>
                                                <span class="badge bg-info">{{ $assignment->submissions->count() }}</span>
                                            </td>
                                            <td class="text-end pe-4">
                                                <a href="{{ route('assignments.show', $assignment) }}" class="btn btn-sm btn-outline-primary">View</a>
                                                <a href="{{ route('assignments.edit', $assignment) }}" class="btn btn-sm btn-outline-secondary">Edit</a>
                                                <form method="POST" action="{{ route('assignments.destroy', $assignment) }}" style="display: inline;">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-sm btn-outline-danger" onclick="return confirm('Are you sure?')">Delete</button>
                                                </form>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @else
                        <div class="text-center py-5">
                            <p class="text-secondary">No assignments created yet</p>
                            <a href="{{ route('assignments.create') }}" class="btn btn-primary">Create Your First Assignment</a>
                        </div>
                    @endif
                </div>
            </div>

            <div class="mt-4">
                {{ $assignments->links() }}
            </div>
        </div>
    </div>
</div>
@endsection