@extends('layouts.app')

@section('title', 'Input Murid Naik Jenjang')

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="mb-4">
        <h2 class="mb-1">
            <i class="bi bi-arrow-up-circle-fill text-success"></i>
            Input Murid Naik Jenjang
        </h2>
        <p class="text-muted mb-0">Tambahkan data siswa yang naik ke jenjang berikutnya</p>
        <a href="{{ route('admin-sekolah.naik-jenjang.index') }}" class="btn btn-sm btn-outline-primary mt-2">
            <i class="bi bi-list-ul me-1"></i> Lihat Daftar Murid Naik Jenjang
        </a>
    </div>

    <!-- Info Alert -->
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        <div class="d-flex align-items-start">
            <i class="bi bi-info-circle-fill fs-4 me-3"></i>
            <div>
                <h5 class="alert-heading mb-2">
                    <i class="bi bi-info-circle me-1"></i> Informasi Penting
                </h5>
                <p class="mb-0">
                    <strong>Siswa yang naik jenjang adalah siswa yang lulus dari jenjang sebelumnya:</strong>
                </p>
                <ul class="mb-0 mt-2">
                    <li>Lulus <strong>TKLB</strong> → Masuk <strong>SDLB</strong> kelas I</li>
                    <li>Lulus <strong>SDLB</strong> → Masuk <strong>SMPLB</strong> kelas VII</li>
                    <li>Lulus <strong>SMPLB</strong> → Masuk <strong>SMALB</strong> kelas X</li>
                </ul>
                <p class="mb-0 mt-2 small text-danger">
                    <strong>NISN wajib diisi</strong> dan <strong>Ijazah jenjang sebelumnya wajib diunggah</strong>.
                </p>
            </div>
        </div>
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>

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

    @if(session('error'))
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
        <i class="bi bi-exclamation-circle me-2"></i>{{ session('error') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
    @endif

    <div class="row">
        <!-- Form Input -->
        <div class="col-lg-10 mx-auto">
            <div class="card border-0 shadow-sm">
                <div class="card-header bg-success text-white py-3">
                    <h5 class="mb-0">
                        <i class="bi bi-clipboard-plus me-2"></i>
                        Form Data Murid Naik Jenjang
                    </h5>
                </div>
                <div class="card-body p-4">
                    <form action="{{ route('admin-sekolah.naik-jenjang.store') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        
                        <!-- Data Identitas -->
                        <h6 class="text-success mb-3 pb-2 border-bottom">
                            <i class="bi bi-person-vcard me-2"></i>Data Identitas Siswa
                        </h6>
                        
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <label class="form-label fw-bold">NIK <span class="text-danger">*</span></label>
                                <input type="text" name="nik" class="form-control @error('nik') is-invalid @enderror" 
                                       value="{{ old('nik') }}" placeholder="16 digit NIK" maxlength="16" required>
                                @error('nik')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                                <small class="text-muted">Nomor Induk Kependudukan</small>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label fw-bold">NISN <span class="text-danger">*</span></label>
                                <input type="text" name="nisn" class="form-control @error('nisn') is-invalid @enderror" 
                                       value="{{ old('nisn') }}" placeholder="10 digit NISN" maxlength="10" required>
                                @error('nisn')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                                <small class="text-muted">Nomor Induk Siswa Nasional (WAJIB)</small>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label fw-bold">NIS <span class="text-danger">*</span></label>
                                <input type="text" name="nis" class="form-control @error('nis') is-invalid @enderror" 
                                       value="{{ old('nis') }}" placeholder="Nomor Induk Siswa" required>
                                @error('nis')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-3">
                            <label class="form-label fw-bold">Nama Lengkap <span class="text-danger">*</span></label>
                            <input type="text" name="nama" class="form-control @error('nama') is-invalid @enderror" 
                                   value="{{ old('nama') }}" placeholder="Nama lengkap sesuai ijazah" required>
                            @error('nama')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Tempat Lahir <span class="text-danger">*</span></label>
                                <input type="text" name="tempat_lahir" class="form-control @error('tempat_lahir') is-invalid @enderror" 
                                       value="{{ old('tempat_lahir') }}" placeholder="Kota/Kabupaten" required>
                                @error('tempat_lahir')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Tanggal Lahir <span class="text-danger">*</span></label>
                                <input type="date" name="tanggal_lahir" class="form-control @error('tanggal_lahir') is-invalid @enderror" 
                                       value="{{ old('tanggal_lahir') }}" required>
                                @error('tanggal_lahir')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="row mb-4">
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Jenis Kelamin <span class="text-danger">*</span></label>
                                <select name="jenis_kelamin" class="form-select @error('jenis_kelamin') is-invalid @enderror" required>
                                    <option value="">Pilih Jenis Kelamin</option>
                                    <option value="L" {{ old('jenis_kelamin') == 'L' ? 'selected' : '' }}>Laki-laki</option>
                                    <option value="P" {{ old('jenis_kelamin') == 'P' ? 'selected' : '' }}>Perempuan</option>
                                </select>
                                @error('jenis_kelamin')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Agama <span class="text-danger">*</span></label>
                                <select name="agama" class="form-select @error('agama') is-invalid @enderror" required>
                                    <option value="">Pilih Agama</option>
                                    <option value="Islam" {{ old('agama') == 'Islam' ? 'selected' : '' }}>Islam</option>
                                    <option value="Kristen" {{ old('agama') == 'Kristen' ? 'selected' : '' }}>Kristen</option>
                                    <option value="Katolik" {{ old('agama') == 'Katolik' ? 'selected' : '' }}>Katolik</option>
                                    <option value="Hindu" {{ old('agama') == 'Hindu' ? 'selected' : '' }}>Hindu</option>
                                    <option value="Buddha" {{ old('agama') == 'Buddha' ? 'selected' : '' }}>Buddha</option>
                                    <option value="Konghucu" {{ old('agama') == 'Konghucu' ? 'selected' : '' }}>Konghucu</option>
                                </select>
                                @error('agama')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <!-- Data Orang Tua -->
                        <h6 class="text-success mb-3 pb-2 border-bottom mt-4">
                            <i class="bi bi-people me-2"></i>Data Orang Tua
                        </h6>

                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Nama Ayah <span class="text-danger">*</span></label>
                                <input type="text" name="nama_ayah" class="form-control @error('nama_ayah') is-invalid @enderror" 
                                       value="{{ old('nama_ayah') }}" placeholder="Nama lengkap ayah kandung" required>
                                @error('nama_ayah')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Tahun Lahir Ayah <span class="text-muted">(opsional)</span></label>
                                <input type="number" name="tahun_lahir_ayah" class="form-control @error('tahun_lahir_ayah') is-invalid @enderror" 
                                       value="{{ old('tahun_lahir_ayah') }}" placeholder="Contoh: 1980" min="1940" max="{{ date('Y') }}">
                                @error('tahun_lahir_ayah')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="row mb-4">
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Nama Ibu <span class="text-danger">*</span></label>
                                <input type="text" name="nama_ibu" class="form-control @error('nama_ibu') is-invalid @enderror" 
                                       value="{{ old('nama_ibu') }}" placeholder="Nama lengkap ibu kandung" required>
                                @error('nama_ibu')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Tahun Lahir Ibu <span class="text-muted">(opsional)</span></label>
                                <input type="number" name="tahun_lahir_ibu" class="form-control @error('tahun_lahir_ibu') is-invalid @enderror" 
                                       value="{{ old('tahun_lahir_ibu') }}" placeholder="Contoh: 1982" min="1940" max="{{ date('Y') }}">
                                @error('tahun_lahir_ibu')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <!-- Data Kontak -->
                        <h6 class="text-success mb-3 pb-2 border-bottom mt-4">
                            <i class="bi bi-telephone me-2"></i>Data Kontak
                        </h6>

                        <div class="mb-3">
                            <label class="form-label fw-bold">Alamat Lengkap <span class="text-danger">*</span></label>
                            <textarea name="alamat" rows="3" class="form-control @error('alamat') is-invalid @enderror" 
                                      placeholder="Alamat lengkap sesuai KK" required>{{ old('alamat') }}</textarea>
                            @error('alamat')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="mb-4">
                            <label class="form-label fw-bold">No. HP/WA <span class="text-danger">*</span></label>
                            <input type="text" name="phone" class="form-control @error('phone') is-invalid @enderror" 
                                   value="{{ old('phone') }}" placeholder="Contoh: 08123456789" required>
                            @error('phone')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Data Pendidikan -->
                        <h6 class="text-success mb-3 pb-2 border-bottom mt-4">
                            <i class="bi bi-mortarboard me-2"></i>Data Pendidikan & Kenaikan Jenjang
                        </h6>

                        <div class="mb-3">
                            <label class="form-label fw-bold">Sekolah Asal <span class="text-muted">(opsional)</span></label>
                            <input type="text" name="sekolah_asal" class="form-control @error('sekolah_asal') is-invalid @enderror" 
                                   value="{{ old('sekolah_asal') }}" placeholder="Nama sekolah asal">
                            @error('sekolah_asal')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="row mb-3">
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Jenis Ketunaan <span class="text-danger">*</span></label>
                                <select name="disability_type_id" class="form-select @error('disability_type_id') is-invalid @enderror" required>
                                    <option value="">Pilih Jenis Ketunaan</option>
                                    @foreach($disabilityTypes as $type)
                                        <option value="{{ $type->id }}" {{ old('disability_type_id') == $type->id ? 'selected' : '' }}>
                                            {{ $type->name }}
                                        </option>
                                    @endforeach
                                </select>
                                @error('disability_type_id')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label fw-bold">Naik ke Jenjang <span class="text-danger">*</span></label>
                                <select name="jenjang_tujuan" class="form-select @error('jenjang_tujuan') is-invalid @enderror" required>
                                    <option value="">Pilih Jenjang Tujuan</option>
                                    <option value="SDLB" {{ old('jenjang_tujuan') == 'SDLB' ? 'selected' : '' }}>
                                        SDLB (dari TKLB)
                                    </option>
                                    <option value="SMPLB" {{ old('jenjang_tujuan') == 'SMPLB' ? 'selected' : '' }}>
                                        SMPLB (dari SDLB)
                                    </option>
                                    <option value="SMALB" {{ old('jenjang_tujuan') == 'SMALB' ? 'selected' : '' }}>
                                        SMALB (dari SMPLB)
                                    </option>
                                </select>
                                @error('jenjang_tujuan')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="mb-4">
                            <label class="form-label fw-bold">Unggah Ijazah Jenjang Sebelumnya <span class="text-danger">*</span></label>
                            <input type="file" name="ijazah" class="form-control @error('ijazah') is-invalid @enderror" 
                                   accept=".pdf,.jpg,.jpeg,.png" required>
                            @error('ijazah')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            <small class="text-muted">Format: PDF, JPG, JPEG, PNG. Maksimal 2MB</small>
                        </div>

                        <!-- Submit Button -->
                        <div class="d-grid gap-2 mt-4">
                            <button type="submit" class="btn btn-success btn-lg">
                                <i class="bi bi-save me-2"></i> Simpan Data Murid Naik Jenjang
                            </button>
                            <a href="{{ route('admin-sekolah.naik-jenjang.index') }}" class="btn btn-outline-secondary">
                                <i class="bi bi-arrow-left me-1"></i> Kembali
                            </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection