@extends('layouts.admin')
@section('page-title')
Users
@endsection

@section('content')
<meta name="csrf-token" content="{{ csrf_token() }}" />
<div class="row">
    <div class="col-md-12">
        <div class="text-right">

        </div>
        <br />
        <div class="card">
            <div class="card-body">
                <div class="">
                    <table class="table" id = "gridView">
                        <thead class="thead-light" >
                            <th>Name</th>
                            <th>Email</th>
                            <!-- <th>Status</th> -->
                            <th>Action</th>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="confirmModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header"  style="background-color: #343a40;color: #fff;">
                <h2 class="modal-title">Confirmation</h2>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <h4 align="center" style="margin: 0;">Are you sure you want to delete this ?</h4>
            </div>
            <div class="modal-footer">
                <button type="button" id="ok_delete" name="ok_delete" class="btn btn-danger">Delete</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endsection

@push('custom-js-scripts')
<script type="text/javascript">
    $(document).ready(function () {

        table =  $('#gridView').DataTable({
            processing: true,
            serverSide: true,
            order: [],
            ajax: "{{ url('/admin/users') }}",
            columns: [
                {data: 'name', name: 'name'},
                {data: 'email', name: 'email'},
                // {data: 'status', name: 'status'},
                {data: 'action', name: 'action', orderable: false, searchable: false},
                ],
        });
        var userDeleteId;
        $("body").on('click', '.deleteUser', function (){
            userDeleteId = $(this).data('id');
            $("#confirmModal").modal('show');
        });
        $("#ok_delete").on('click', function (){
            $("#confirmModal").modal('hide');
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: "{{url('admin/users')}}/"+userDeleteId,
                type: 'delete',
                success: function (resp){
                    if (resp.status == true){
                        $("#alertMsg").empty().removeClass('alert-danger').addClass('alert-success')
                            .append(resp.msg).css('display', 'block');
                        table.ajax.reload();
                    }else{
                        $("#alertMsg").empty().removeClass('alert-success').addClass('alert-danger')
                            .append(resp.error).css('display', 'block');
                    }
                }
            });
        });
    });


//     $(document).on('change', '.chkStatus', function() {
//         alert(this.checked);
//     if(this.checked) {
//       // checkbox is checked
//     }
// });

function ChangeStatus(id, status)
{
    $.ajax({
            type: "POST",
            url: "{{ url('admin/users/change-status') }}",
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data:{
                id:id,
                status:status
                },
                dataType: 'json',
            success: function (data) {
                location.reload();
            },
            error: function (data) {
                console.log('Error:', data);}
            });
}


</script>
@endpush