@extends('layouts.backend')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <h4 class="page-title">Data Penduduk Tidak Mampu</h4>
            <ol class="breadcrumb">
                <li>
                    <a href="{{route('home')}}">Home</a>
                </li>
                <li class="active">
                    Data Penduduk Tidak Mampu
                </li>
            </ol>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <div class="card-box">
                <h4 class="m-t-0 header-title"><b>Data Penduduk Tidak Mampu</b></h4>
                <p class="text-muted font-13">
                   <!--  <a href="{{ route('penduduk-tidak-mampu-baru') }}" class="btn btn-primary btn-custom waves-effect waves-light"><i class="ti-plus"></i> Data baru</a> -->
                   <a href="{{ route('backoffice-penduduk-miskin-import') }}" class="btn btn-primary btn-custom waves-effect waves-light"><i class="ti-import"></i> Import Penduduk</a>
                </p>
                <table class="table table-bordered dt-responsive nowrap" width="100%">
                    <thead>
                        <tr>
                            <th>IDBDT</th>
                            <th>No PBDT</th>
                            <th>DESA</th>
                            <th>Alamat</th>
                            <th>Nama SLS</th>
                            <th>Nama KRT</th>
                            <th>Kecamatan</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var table = $('.table').DataTable({
            responsive : true,
            initComplete : function() {
                var api = this.api();
                $('[data-toggle="tooltip"]').tooltip()
                $('#tbl_filter input').off('.DT').on('input.DT',function() {
                    api.search(this.value).draw();
                });
            },
            oLanguage : {
                sProcessing : "Getting Item"
            },
            processing : true,
            serverSide : true,
            ajax : {
                url : "{{ route('get-penduduk-tidak-mampu') }}",
                type : 'POST',
                data : {
                    _token : "{{csrf_token()}}"
                },
                dataType : 'JSON',
                error : function(o,t,tr) {
                    alert(o.statusText);
                }
            },
            columns : [
                
                {data : 'IDBDT'},
                {data : 'NoPesertaPBDT'},
                {data : 'DESA'},
                {data : 'Alamat'},
                {data : 'Nama_SLS'},
                {data : 'Nama_KRT'},
                {data : 'kecamatan'},
                // {
                //     data : 'url',
                //     orderable : false,
                //     mRender : function(data) {
                //         return ('<a href="'+data.edit+'" class="btn btn-icon waves-effect waves-light btn-warning"><i class="fa fa-pencil-square-o"></i></a>&nbsp<a data-link="'+data.delete+'" class="btn btn-icon waves-effect waves-light btn-danger"><i class="fa fa-ban"></i></a>')
                //     }
                // }

            ],
            "order": [[1, 'asc']]
        });
        $('.table tbody').on('click', '.btn-success', function() {
            var link = $(this).data('link');
            window.open(link, '_blank')
        })
        $('.table tbody').on('click', '.btn-danger', function() {
            var link = $(this).data('link');
            if (confirm('Anda yakin ?')) {
                window.location = link;
            }
        })
    </script>
</div> 
@endsection