@extends('layouts.administrator.master')

@section('title')
    {{__('Anggota')}}
@endsection

@section('content')
    <div class="nk-content-body">
        <div class="nk-block-head nk-block-head-sm">
            <div class="nk-block-between">
                <div class="nk-block-head-content">
                    <a href="{{ route('dashboard') }}" class="btn btn-primary btn-sm">
                        <em class="icon ni ni-arrow-left"></em>
                        {{__('Kembali')}}
                    </a>
                </div>
                <div class="nk-block-head-content">
                    <a href="{{ route('admin.anggota.export.excel') }}" class="btn btn-success btn-sm">
                        <em class="icon ni ni-file"></em>
                        {{__('Export Excel')}}
                    </a>
                    <a href="{{ route('admin.anggota.import') }}" class="btn btn-info btn-sm">
                        <em class="icon ni ni-file"></em>
                        {{__('Import')}}
                    </a>
                    {{-- <a href="{{ route('admin.anggota.form') }}" class="btn btn-success btn-sm">
                        <em class="icon ni ni-plus"></em>
                        {{__('Tambah')}}
                    </a> --}}
                </div>
            </div>
        </div>
        <div class="nk-block">
            <div class="card card-preview">
                <div class="card-inner">
                    <table class="datatable nowrap table" data-export-title="Export">
                        <thead>
                            <tr>
                                <th>{{__('No')}}</th>
                                <th>{{__('Nama')}}</th>
                                <th>{{__('Email')}}</th>
                                <th>{{__('No HP')}}</th>
                                <th>{{__('Status')}}</th>
                                <th>#</th>
                            </tr>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('script')
    <script>
        NioApp.DataTable('.datatable', {
            processing: true,
            serverSide: true,
            ajax : {
                url  : '{{ route('api.admin.data.anggota.list') }}',
                type : 'POST',
                data : {
                    user_id : '{{ Auth::user()->id }}'
                }
            },
            columns: [
                { data: 'no' },
                { data: 'nama' },
                { data: 'email' },
                { data: 'no_hp' },
                { data: 'status_personil' },
                { data: 'action', className : 'text-center' },
            ],
            ordering : false,
            responsive: {
                details: true
            },
            buttons: ['excel', 'pdf'],
            fnCreatedRow: function (row, data, index) {
                $('td', row).eq(0).html(index + 1);
            }
        });

        function confirm_delete(url) {
            Swal.fire({
                title             : "{{__('Konfirmasi')}}",
                text              : "{{__('Anda yakin akan menghapus data ini?')}}",
                showCloseButton   : true,
                showCancelButton  : true,
                confirmButtonText : "{{__('Iya')}}",
                cancelButtonText  : "{{__('Tidak')}}"
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url      : url,
                        dataType : "jSON",
                        success  : function(r) {
                            NioApp.Toast(r.message, (r.success ? "success" : "error"), {
                                position: "top-right"
                            });

                            $(".datatable").DataTable().ajax.reload();
                        }
                    })
                }
            })
        }
    </script>
@endpush