@extends('layouts.master')

@section('page-content')
    <div class="title-bar">
        <h1 class="title-bar-title">
            <span class="d-ib">All Members in {{$region_name}} Region</span>
        </h1>
    </div>
    <div class="row gutter-xs">
        @if (session()->has('success'))
            <div class="alert alert-success alert-dismissible">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                <strong>Success!</strong> {{ Session::get('success') }}
            </div>
        @endif
        <div class="col-xs-12">
            <div class="card">
                <div class="card-header bg-primary">
                    <div class="card-actions">
                        <button type="button" class="card-action card-toggler" title="Collapse"></button>
                    </div>
                    <strong>Member List</strong>
                </div>
                <div class="card-body">
                    <table class="table table-bordered table-striped table-nowrap adataTable" cellspacing="0" width="100%">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Name</th>
                                <th>contact</th>
                                <th>Membercode</th>
                            </tr>
                        </thead>
                        <tbody>
                            @isset($members)
                            @foreach ($members as $member)
                                <tr>
                                    <td>{{$loop->iteration}}</td>
                                    <td>{{$member->f_name." ".$member->m_name." ".$member->l_name}}</td>
                                    <td>{{$member->contact}}</td>
                                    <td>{{$member->member_type.$member->member_code}}</td>
                             
                    </tr>
                    @endforeach
                    @endisset
                </tbody>
            </table>
        </div>
    </div>
</div>
</div>
@endsection

@push('page-script')

 <script type="text/javascript">
 $(document).ready(function() {
   $('.table').DataTable({
       dom: 'Bfrtip',
       // buttons: [
       //     'copyHtml5','excelHtml5','csvHtml5','pdfHtml5','print'
       // ],

        buttons: [
                    {
                        extend: 'csvHtml5',
                        title : 'Region Members',
                        exportOptions: {
                            columns: [ 0,1,2],
                        }
                    },
                   
                ],
    responsive: true,
   });
});
</script >
    
    <script type="text/javascript">
       
        $(document).on('click', '.delete', function(){
        let id = $(this).attr('data-id');

        swal({
            title: "Are you sure?",
            text: "Once deleted, you will not be able to recover this imaginary file!",
            icon: "warning",
            buttons: true,
            dangerMode: true,
        })
        .then((willDelete) => {
            if (willDelete) {
                $.ajax({
                    url:'/delete_brochure/'+ id,
                    type:'get',
                    data:{_method:'delete',_token:'{{ csrf_token() }}'},
                    success : function(response) {
                        swal("Poof! Your imaginary file has been deleted!", {
                            icon: "success",
                        });
                        $( ".dataTable" ).load( "/brochure .dataTable" );
                    }
                })
            } else {

            }
        });
    });
    </script>
@endpush