@extends('layouts.app')

@section('content')
	<div class="page-title">
        <div class="row">
            <div class="col-12 col-md-6 order-md-1 order-last">
                <h3>Master Nilai</h3>
                
            </div>
            <div class="col-12 col-md-6 order-md-2 order-first">
                <nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="index.html">Home</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Master Nilai</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>
    <section class="section">
		<div class="card">
            <div class="card-header">
                Point
                 <div class="float-end">
                    @if($akses->is_add == 1)
                        <button class="btn btn-primary" onclick="loadForm(0)"><span class="bi bi-plus">TAMBAH</span></button>
                    @endif
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="card-body" >
               
               
                <div class="col-lg-12 col-12">
                    
                    <table class="table table-striped table-bordered" id="datatables" style="width:100%">
                        <thead>
                            <tr>
                                <th>Aksi</th>
                                <th>Nilai</th>
                                <th>Abjad</th>
                            </tr>
                        </thead>
                    </table>
                </div>
                
			</div>
		</div>
	</section>
@endsection

@push("modals")
   @include('pages.task.master.form')
   
@endpush
   
@push('scripts')
	<script>
        var table;
		$(function(){
            table = $('#datatables').DataTable({
                serverSide:true,
                processing:true,
                responsive: true,
                ajax:{
                    method:"POST",
                    url:"{{ url('task/master-nilai/data') }}"
                },
                columns:[
                    {data:"aksi",render:(data,type,row) => {
                        var button = "";
                            button += `<li><a class="dropdown-item" href="#" onclick="loadForm(${row.id})">EDIT</a></li>`;
                            
                            button += `<li><a class="dropdown-item" href="#" onclick="delData(${row.id})">DELETE</a></li>`;
                        return `<div class="dropdown ">
                                <button class="btn btn-primary btn-sm dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
                                AKSI
                                </button>
                                <ul class="dropdown-menu dropdown-menu-dark"  aria-labelledby="dropdownMenuButton1">
                                ${button}
                                </ul>
                            </div>`
                    },orderable:false,searchable:false},
                   
                    {data:"nilai"},
                    {data:"abjad"},
                ]
            });
        })
					
		function delData(id) {
       
            Notiflix.Confirm.show("KONFIRMASI","Apakah yakin akan menghapus data ini?","YA","TIDAK",() => {
                $.post("{{ url('task/master-nilai/delete') }}",{id,id}).done(resp => {
                    if (resp.error == false) {
                        Notiflix.Notify.success("Data Berhasil dihapus");
                        table.draw();
                    } else {
                        Notiflix.Notify.failure(resp.message);
                    }
                }).fail( err => {
                    Notiflix.Notify.failure(err.responseText);
                })
            })
        }		
	</script>
@endpush