@extends('layouts.app')

@section('title', 'Custom Report Builder | Institution Axis')

@section('sidebar-menu')
    @include('schooladmin.partials.sidebar')
@endsection

@section('breadcrumb')
    <span><a href="{{ route('schooladmin.dashboard') }}">Home</a></span> / 
    <span><a href="{{ route('schooladmin.reports.index') }}">Reports</a></span> / 
    <span class="active-page">Custom Report Builder</span>
@endsection

@section('content')
<div class="container-fluid p-0">
    <div class="row g-4">
        <div class="col-lg-12">
            <div class="card shadow-sm border-0 rounded-4">
                <div class="card-header bg-white border-0 py-3">
                    <h5 class="mb-0 fw-bold"><i class="fas fa-filter me-2"></i> Report Filters</h5>
                </div>
                <div class="card-body">
                    <form action="{{ route('schooladmin.reports.custom.generate') }}" method="POST">
                        @csrf
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label fw-bold">Report Type</label>
                                <select name="report_type" class="form-select rounded-3" required>
                                    <option value="">-- Select Report --</option>
                                    <option value="student_performance">Student Performance Report</option>
                                    <option value="fee_balances">Fee Balances Report</option>
                                    <option value="attendance_summary">Attendance Summary</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label fw-bold">Class (Optional)</label>
                                <select name="class_id" class="form-select rounded-3">
                                    <option value="">All Classes</option>
                                    @foreach($classes as $class)
                                        <option value="{{ $class->id }}">{{ $class->name }} {{ $class->stream }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label fw-bold">Subject (Optional)</label>
                                <select name="subject_id" class="form-select rounded-3">
                                    <option value="">All Subjects</option>
                                    @foreach($subjects as $subject)
                                        <option value="{{ $subject->id }}">{{ $subject->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Start Date</label>
                                <input type="date" name="start_date" class="form-control rounded-3">
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">End Date</label>
                                <input type="date" name="end_date" class="form-control rounded-3">
                            </div>
                            <div class="col-12 mt-4">
                                <button type="submit" class="btn btn-primary px-5 py-2 rounded-pill shadow-sm">
                                    <i class="fas fa-file-export me-2"></i> Generate Report
                                </button>
                                <button type="reset" class="btn btn-light px-5 py-2 rounded-pill ms-2">
                                    Reset
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Suggestion Cards -->
        <div class="col-md-4">
            <div class="card shadow-sm border-0 rounded-4 p-4 text-center bg-light h-100">
                <i class="fas fa-users-viewfinder fa-3x text-primary mb-3"></i>
                <h5>Enrollment Report</h5>
                <p class="text-muted small">Generate a list of students filtered by class and enrollment date.</p>
                <button class="btn btn-link btn-sm text-primary">Use this template</button>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card shadow-sm border-0 rounded-4 p-4 text-center bg-light h-100">
                <i class="fas fa-receipt fa-3x text-success mb-3"></i>
                <h5>Fee Collection</h5>
                <p class="text-muted small">Analyze fee payments and identify defaulters for a specific term.</p>
                <button class="btn btn-link btn-sm text-success">Use this template</button>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card shadow-sm border-0 rounded-4 p-4 text-center bg-light h-100">
                <i class="fas fa-user-clock fa-3x text-info mb-3"></i>
                <h5>Teacher Clock-in</h5>
                <p class="text-muted small">Detailed log of staff attendance and overtime reporting.</p>
                <button class="btn btn-link btn-sm text-info">Use this template</button>
            </div>
        </div>
    </div>
</div>
@endsection