@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" value="{{@$sk->nama}}" class="form-control">
                            <small class="text-muted"><i>(Opsional)</i></small>
                        </div>
                        <div class="form-group">
                            <label class="label">Nomor SK</label>
                            <input type="text" name="nomor_sk" value="{{@$sk->nomor_sk}}" class="form-control" required>
                        </div>
                        <div class="form-group">
                            <label class="label">Tanggal Penetapan SK</label>
                            <input type="date" name="tanggal_penetapan" value="{{@$sk->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')}}" value="{{@$sk->tahun}}" 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 {{@$sk->jenis_usulan == '1' ? 'selected' : ''}} value="1">Adiwiyata Kab/Kota</option>
                                <option {{@$sk->jenis_usulan == '2' ? 'selected' : ''}} value="2">Adiwiyata Provinsi</option>
                                <option {{@$sk->jenis_usulan == '3' ? 'selected' : ''}} value="3">Adiwiyata Nasional</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="label">Pilih Sekolah</label>
                            <?php
                                $selected = json_decode(@$sk->sekolah);
                            ?>
                            <select class="select2 form-control sekolah" multiple name="sekolah[]" required>
                                @if(@$sk)
                                @foreach($selected as $dataSelected)
                                    <option selected value="{{$dataSelected}}">{{sekolah($dataSelected)->nama_sekolah}}</option>
                                @endforeach
                                @endif
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="label">File SK</label>
                            <input type="file" name="file" accept=".pdf" class="form-control" required>
                            @if(@$sk->file)
                            <a href="{{asset('uploads/'.@$sk->file)}}" class="btn btn-warning mt-2"><i class="fal fa-download"></i>&nbsp;Download File SK</a>
                            @endif
                        </div>
                        <div class="form-group">
                            <label class="label">Deskripsi</label>
                            <textarea name="deskripsi" class="form-control">{{@$sk->deskripsi}}</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
            xhrFields: {
                withCredentials: true
            },
            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