@extends('includes.main')

@section('pageSpecificStyles')
    <style type="text/css">

    </style>
@endsection
@section('pageSpecificContent')

<div class="card m-b-20">
    <div class="card-body">

        <div class="row">
            <div class="col-md-12">
                <div class="table-rep-plugin">
                    <div class="table table-responsive b-0" data-pattern="priority-columns">
                        <table id="dataTable" class="table"
                               cellspacing="0"
                               width="100%">
                            <thead>
                            <tr>
                                <th scope="col">Email</th>
                                <th scope="col">User Role</th>
                                <th scope="col">Registered At</th>
                                <th scope="col">Actions</th>
                            </tr>
                            </thead>
                            <tbody id="tBody">
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection
@section('pageSpecificScript')
    <script language="JavaScript" type="text/javascript">
    let table;
      $(document).ready(function () {
          showTable();
        });

        function showTable(){
            table =  $('#dataTable').DataTable({
                processing: true,
                serverSide: true,
                sortable:true,
                "email": [[0, "asc"]],
                ajax: "{{ route('user.index') }}",
                columns: [
                    { data: 'email', name: 'email' },
                    { data: 'role', name: 'role' },
                    { data: 'register', name: 'updated_at'  },
                    { data: 'action', name: 'action',sortable:false }
                ],
                "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
                createdRow: function( row, data, dataIndex){
                    if( data['status'] !=  1){
                        $(row).addClass('text-danger');
                    }
                }
            });

        }

        function destroy(url) {
            swal.fire({
                title: 'Permanantly Delete?',
                text:'You will not be able to revert this process',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: `Delete`,
                confirmButtonClass: `deleteBtn`,
                buttonsStyling: true,
            }).then((result) => {
                /* Read more about isConfirmed, isDenied below */
                if (result.isConfirmed) {
                    $.ajax({
                    url: url,
                    type: 'DELETE',
                    success: function (data) {
                        showControllerErrors(data);
                        if (data.success != null) {
                            table.ajax.reload();
                            showSuccess(data.success);//show success alert
                        }
                    },
                    error: function (data) {
                        showRequestErrors(data);
                    }
                });
                } else if (result.isDenied) {
                    Swal.fire('Process terminated', '', 'info')
                }
                });
        }

        function disable(userId,status) {
            swal.fire({
                title: 'Disable This User?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: `Disable`,
                buttonsStyling: true,
            }).then((result) => {
                /* Read more about isConfirmed, isDenied below */
                if (result.isConfirmed) {
                    $.ajax({
                    url: "{{ route('user.changeStatus') }}",
                    data:{userId:userId,status:status},
                    type: 'POST',
                    success: function (data) {
                        showControllerErrors(data);
                        if (data.success != null) {
                            table.ajax.reload();
                            showSuccess(data.success);//show success alert
                        }
                    },
                    error: function (data) {
                        showRequestErrors(data);
                    }
                });
                } else if (result.isDenied) {
                    Swal.fire('Process terminated', '', 'info')
                }
                });
        }

        function activate(userId,status) {
            swal.fire({
                title: 'Activate This User?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: `Activate`,
                buttonsStyling: true,
            }).then((result) => {
                /* Read more about isConfirmed, isDenied below */
                if (result.isConfirmed) {
                    $.ajax({
                    url: "{{ route('user.changeStatus') }}",
                    data:{userId:userId,status:status},
                    type: 'POST',
                    success: function (data) {
                        showControllerErrors(data);
                        if (data.success != null) {
                            table.ajax.reload();
                            showSuccess(data.success);//show success alert
                        }
                    },
                    error: function (data) {
                        showRequestErrors(data);
                    }
                });
                } else if (result.isDenied) {
                    Swal.fire('Process terminated', '', 'info')
                }
                });
        }
    </script>
@endsection