MINI Sh3ll

@extends('layouts.main')
@section('title', ' Registered User')
@section('content')
<div class="m-content">
       <div class="row" >
        <div class="m-portlet m-portlet--mobile filter_row">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <h3 class="m-portlet__head-text">
                            User Filter
                        </h3>
                    </div>
                </div>
            </div>
            <form class="m-form m-form--fit m-form--label-align-right" action="#" autocomplete="off" id="statusForm" method="POST" role="form" data-parsley-validate="parsley">
                {{ csrf_field() }}
                <div class="m-portlet__body">
                    <div class="row">
                        <div class="col-md-4">
                              <div class="form-group m-form__group">
                                    <label class="show_status">Name </label>
                                    <input type="text" name="first_name" class="form-control m-input" id="name" >
                            </div>
                        </div>
                        <div class="col-md-4">
                              <div class="form-group m-form__group">
                                    <label class="show_status">Role </label>
                                   <select class="form-control m-input" id="role">
                                    <option value="">All</option>
                                    @foreach($roles as $role)
                                        <option value="{{ $role['id'] }}" {{ old('role_id') == 1 ? 'selected' : '' }}>{{$role['name'] }}
                                        </option>
                                    @endforeach
                                   </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                              <div class="form-group m-form__group">
                                   <label class="show_status"> Select Comapny </label>
                                <select class="form-control m-input" id="company">
                                           <option value="">All</option>
                                    @foreach($companies as $company)
                                        <option value="{{ $company->id }}" {{ old('company_id') == 1 ? 'selected' : '' }}>{{ $company->company_name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                       {{--  <div class="col-md-4">
                            <div class="form-group m-form__group">
                                <label class="show_status"> Select Status </label>
                                <select class="form-control m-input" id="status">
                                    <option value="" >All</option>
                                    <option value="1" >Active</option>
                                    <option value="0" >In Active</option>
                                </select>
                        </div>
                        </div>  --}}
                    </div>
                </div>
                <div class="m-portlet__foot m-portlet__foot--fit">
                    <div class="m-form__actions">
                        <button type="button" id="statusBtn" name="submit" class="btn btn-sm btn-accent m-btn m-btn--custom m-btn--icon m-btn--air">
                                Search  <i class="la la-search"></i>
                            </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="row" >
        <div class="m-portlet m-portlet--mobile filter_row">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <h3 class="m-portlet__head-text">
                            Registered User List
                        </h3>
                    </div>
                </div>
               {{--  <div class="m-portlet__head-tools">
                    <a href="{{ route('user.create') }}" class="btn btn-sm btn-accent m-btn m-btn--custom m-btn--icon m-btn--air">
                        <span>
                            <i class="la la-user"></i>
                            <span>
                                Add User
                            </span>
                        </span>
                    </a>
                </div> --}}
            </div>
            <div class="m-portlet__body">
                <!--begin: Datatable -->
                <div class="m_datatable" id="local_data">
                    <table id="user_data" class="display" cellspacing="0" width="100%">
                        <thead>
                            <tr>
                                <th>Name</th>
                                <th>Email</th>
                                <th>Mobile</th>
                                <th>Company</th>
                                <th>Role</th>
                                <th>Status</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                    </table>
                </div>
                <!--end: Datatable -->
            </div>
        </div>
    </div>  
</div>

@endsection
@section('script')
<!--begin::Page Resources -->
<script>
var base_url = window.location.origin;
        var url = '{{ route('getRegisteredUser') }}';
        loadDataTable(url);

function loadDataTable(url) {
    $('#user_data').DataTable({
        "order": [],
        "bAutoWidth": false,
        "processing": false,
        "serverSide": false,
        "bDestroy": true,
        "scrollX": true,
        "aLengthMenu": [[10, 20, 50, -1], [10, 20, 50, "All"]],
        "pageLength": 10,
        "columnDefs": [{
                "targets": 'no-sort',
                "orderable": false,
            }],
        "ajax": url,
        language: {
            search: "_INPUT_",
            searchPlaceholder: "Search...",
            "lengthMenu": "Show _MENU_"
        }
    })
}

$(document).on('click', '.delete_user', function (event) {
    var id = $(this).attr("data-id");
    var deleteUrl = '{{ route("delete") }}';
    $('#deleteModal').modal('show');
    $(".delete").click(function (e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: deleteUrl,
            dataType: "json",
            data: {
                "id": id,
                "_token": "{{ csrf_token() }}",
            },
            success: function (response) {
                if (response.status == 1) {
                    $('#deleteModal').modal('hide');
                    location.reload(true);
                    toastr.success(response.success);
                }
            }
        });
    });
});

$(document).on("click", "#statusBtn", function () {
    $('#statusForm').submit();
    var name = $('#name').val();
    var company = $('#company').val();
    var role = $('#role').val();
            var url = '{{ route('getRegisteredUser') }}';
            url = url + "?name=" + name + "&company="+company + "&role="+role;
    loadDataTable(url);
});

</script>

@endsection