@extends('layouts.master')
@section('page-css')
@endsection
@section('content')
<div class="subheader">
    <h1 class="subheader-title">
        <i class='subheader-icon fal fa-building'></i> Tambah {{$title}}
    </h1>
</div>
<div class="row">
    <div class="col-lg-12">
        <div id="panel-4" class="panel">
            <div class="panel-container show">
                <div class="panel-content">
                    <form method="POST" action="{{route($route.'.store')}}" enctype="multipart/form-data">
                        {{csrf_field()}}
                        <div class="form-group">
                            <label class="label">Judul SK</label>
                            <input type="text" name="nama" class="form-control">
                            <small class="text-muted"><i>(Opsional)</i></small>
                        </div>
                        <div class="form-group">
                            <label class="label">Tanggal Penetapan SK</label>
                            <input type="date" name="tanggal_penetapan" class="form-control" required>
                        </div>
                        <div class="form-group">
                            <label class="label">Data Tahun</label>
                            <input type="text" name="tahun" value="{{date('Y')}}" disabled class="form-control">
                        </div>
                        <div class="form-group">
                            <label class="label">Jenis Usulan</label>
                            <select class="select2 form-control usulan" name="jenis_usulan" required>
                                <option value="">Pilih Jenis Usulan</option>
                                <option value="1">Adiwiyata Kab/Kota</option>
                                <option value="2">Adiwiyata Provinsi</option>
                                <option value="3">Adiwiyata Nasional</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="label">Pilih Sekolah</label>
                            <select class="select2 form-control sekolah" multiple name="sekolah[]" required>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="label">File SK</label>
                            <input type="file" name="file" accept=".pdf" class="form-control" required>
                        </div>
                        <div class="form-group">
                            <label class="label">Deskripsi</label>
                            <textarea name="deskripsi" class="form-control"></textarea>
                            <small class="text-muted"><i>(Opsional)</i></small>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-primary"><i class="fal fa-loading"></i>&nbsp;Proses Data</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('page-js')
<script type="text/javascript">
    $('.usulan').on('change',function(){
        var jenis_usulan = $(this).find(':selected').val();
        let base_url = "{{url('/')}}";
        $.ajax({
            url: base_url+'/getSekolahSK', // Ganti dengan URL API-mu
            type: 'POST', // Bisa juga 'POST' kalau perlu
            data: { 
                _token:'{{csrf_token()}}',
                data: jenis_usulan 
            }, // Kirim number sebagai parameter
            dataType: 'json', // Format respons JSON
            beforeSend: function () {
                $('#loading-spinner').show(); // Menampilkan spinner
            },
            success: function (response) {
                // toastr.success("Berhasil menyimpan data", 'Success!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});

                let $select = $('.sekolah');
                    $select.empty(); // kosongkan dulu
                    
                    $.each(response, function(index, item) {
                        $select.append('<option value="' + item.id + '">' + item.name + '</option>');
                    });
            },
            error: function (xhr, status, error) {
                toastr.error("Maaf Terjadi Kesalahan Menyimpan Data", 'Error!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
            },
            complete: function () {
                $('#loading-spinner').hide(); // Sembunyikan spinner setelah request selesai
            }
        });
    });
</script>
@endsection