@extends('layouts.teacher')

@section('title', 'Report a Concern · '.config('brand.name'))

@section('content')
    <div class="content">
        <x-admin.page-header
            kicker="Safeguarding"
            title="Report a Concern"
            meta="You can report a concern and view your own reports. Teachers do not see safeguarding cases unrelated to them."
        />

        @include('teacher.safeguarding.nav', ['section' => $section])

        @if ($errors->any())
            <div class="alert alert-danger">{{ $errors->first() }}</div>
        @endif

        <div class="alert alert-warning">
            If a child is in immediate danger, contact {{ config('safeguarding.emergency_label') }} on {{ config('safeguarding.emergency_number') }} first, then complete this form.
        </div>

        <form method="POST" action="{{ route('teacher.safeguarding.store') }}">
            @csrf
            <div class="card mec-panel mb-3">
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label" for="student_user_id">Student (if known)</label>
                            <select class="form-select" id="student_user_id" name="student_user_id">
                                <option value="">Not a student on my lessons / not sure</option>
                                @forelse ($students as $student)
                                    <option value="{{ $student->id }}" @selected((int) old('student_user_id', $preselectedId) === (int) $student->id)>
                                        {{ $student->full_name }} · {{ $student->classLabel() }}
                                    </option>
                                @empty
                                @endforelse
                            </select>
                            <p class="fs-13 text-muted mb-0 mt-1">Only children on lessons you are assigned to teach appear here.</p>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="occurred_on">When this happened (if known)</label>
                            <input class="form-control" id="occurred_on" type="date" name="occurred_on" value="{{ old('occurred_on') }}" max="{{ now('Africa/Accra')->toDateString() }}">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="concern_type">Type of concern</label>
                            <select class="form-select" id="concern_type" name="concern_type" required>
                                <option value="">Choose one</option>
                                @foreach ($types as $type)
                                    <option value="{{ $type->value }}" @selected(old('concern_type') === $type->value)>{{ $type->label() }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label" for="urgency">Urgency</label>
                            <select class="form-select" id="urgency" name="urgency" required>
                                <option value="">Choose one</option>
                                @foreach ($urgencies as $urgency)
                                    <option value="{{ $urgency->value }}" @selected(old('urgency') === $urgency->value)>{{ $urgency->label() }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-12">
                            <label class="form-label" for="title">Short summary</label>
                            <input class="form-control" id="title" name="title" value="{{ old('title') }}" required maxlength="180" placeholder="A factual headline, not a conclusion">
                        </div>
                        <div class="col-12">
                            <label class="form-label" for="details">What happened</label>
                            <textarea class="form-control" id="details" name="details" rows="8" required maxlength="8000" placeholder="Write what you saw, heard or were told. Use the child’s words where you can. Do not add guesses.">{{ old('details') }}</textarea>
                        </div>
                        <div class="col-12">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="confirm" name="confirm" value="1" @checked(old('confirm'))>
                                <label class="form-check-label" for="confirm">
                                    I understand this goes to MyEdCamp safeguarding officers, not ordinary support. I will not investigate or contact the family about this concern.
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="d-flex justify-content-end gap-2">
                <a href="{{ route('teacher.safeguarding.reports') }}" class="btn mec-btn-secondary btn-md">Cancel</a>
                <button type="submit" class="btn mec-btn-navy btn-md">Submit report</button>
            </div>
        </form>
    </div>
@endsection