@extends('layouts.app_admin')

@section('content')
<section class="content-wrapper mb-4">
    <div class="card">
        <div class="row pt-3 px-3">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                  <li class="breadcrumb-item"><a href="#">Master</a></li>
                  <li class="breadcrumb-item"><a href="#">Informasi</a></li>
                </ol>
            </nav>
        </div>
    </div>
</section>

<section class="content-wrapper">
    <div class="card">
        <div class="card-header">
            <h2><i class="fa fa-info-circle" aria-hidden="true"></i> Informasi</h2>
        </div>
        @if(Session::has("message_success"))
            <div class="alert alert-success alert-icon alert-dismissible fade show" role="alert">
                <i class="uil uil-check-circle"></i> {!! session("message_success") !!}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
            @endif
            @if(Session::has("message_error"))
            <div class="alert alert-danger alert-icon alert-dismissible fade show" role="alert">
                <i class="uil uil-times-circle"></i> {!! session("message_error") !!}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
            @endif
        <div class="card-body">
            <table id="datatableInformasi" class="table table-bordered table-hover">
                <thead>
                    <th>No.</th>
                    <th>Layanan</th>
                    <th>Judul</th>
                    <th>Informasi</th>
                    <th>File</th>
                    <th>Aksi</th>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</section>


@endsection
@section('script')
<script>
const delete_data = (ini) => {
    let dataset = ini.dataset;
    Swal.fire({
        "title": "Konfirmasi",
        "text": `${dataset['text']}?`,
        "type": "question",
        "confirmButtonText": "Iya",
        "showCancelButton": true,
        "reverseButtons": true,
        "cancelButtonText": "Tidak"
    }).then((result) => {
        if (result.value) {
            $.ajax({
                url: '{{ route('master.informasi.delete') }}',
                method: 'POST',
                data: {
                    _token: '{{ csrf_token() }}',
                    id_informasi: dataset['id_informasi']
                },
                beforeSend: function() {
                    showSwalLoading('Loading...', 'Menghapus Data');
                },
                success: function(data) {
                    let status = data.result.status;  
                    let keterangan_status = data.result.keterangan_status;  
                    let redirect = data.result.redirect;  
                    
                    showSwal(status,keterangan_status);
                    if (redirect){
                        window.location.href = redirect;
                    }  
                },
                error: function(data) {
                    alert("Terjadi Kesalahan pada Server");
                }
            });
        }
    });
}
$(document).ready(function () {
    $('#datatableInformasi').DataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url : "{{route('master.informasi.datatables')}}",
            type: 'POST',
            data: 
                {
                    "_token": "{{csrf_token()}}"
                }
        },
        dom: 'Blfrtip',
        buttons: [
            { 
                text:'<i class="fa fa-plus"></i>&nbsp Buat Informasi', 
                className: 'btn btn-success btn-sm rounded-0', 
                action: function ( e, dt, button, config ) {
                    window.location = "{{route('master.informasi.create')}}";
                }        
            }
        ],
        columns: [
            { data: 'no' },
            { data: 'nama_layanan' },
            { data: 'judul' },
            { data: 'isi' },
            { data: 'file' },
            { data: 'action' }
        ],
    });
});

</script>
@endsection