alevel_project/resources/views/admin/users.blade.php

@extends('admin.index')
@section('styles')
    @parent
    <link href="{{ asset('css/admin_users.css') }}" rel="stylesheet">
@endsection
@section('content')
    @parent
    <div class="container">
        <div class="table-users card">
            <div class="card-header">
                <h4>Администрирование пользователей</h4>
            </div>
            <table class="table table-striped table-hover">
                <thead class="table-dark">
                <tr>
                    <th>action</th>
                    <th>id</th>
                    <th>nickname</th>
                    <th>email</th>
                    <th>password</th>
                    <th>role</th>
                    <th>created</th>
                    <th>updated</th>
                </tr>
                </thead>
                <tbody>
                @foreach ( $users as $user)
                    <tr>
                        <td>
                            {{--<i class="fas fa-check"></i>--}}
                            <i class="glyphicon glyphicon-remove" title="отклонить" data-status="delete"
                               style="color: red"></i>
                            <i class="glyphicon glyphicon-edit" title="редактировать" data-status="edit"></i>
                        </td>
                        <td data-id>{{ $user->id }} </td>
                        <td>{{ $user->nickname }} </td>
                        <td>{{ $user->email }} </td>
                        <td> reset</td>
                        <td>{{ $user->role }} </td>
                        <td>{{ $user->updated_at->format('F j, Y') }} </td>
                        <td>{{ $user->created_at->format('F j, Y') }} </td>
                    </tr>
                @endforeach
            </table>
        </div>

        <div class="card-footer" style="height:60px;position:relative;">
            <div class="row">
                <div class="col-md-offset-1 col-md-10">{{ $users->links() }}</div>
            </div>
        </div>

    </div>

    {{----------------- MODAL USER -----------------------------}}
    <div id="myModal" class="modal animate" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
         aria-hidden="true" data-backdrop="true">
        <div class="modal-dialog a-zoomRight" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Редактирование итемки</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body text-center p-lg">
                    <p style="font-size: 1.2em">Содержимое отсутствует!</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-action="DELETE" onclick="changeMethod(this)">Удалить
                    </button>
                    <button type="button" class="btn btn-primary" data-action="PUT" onclick="changeMethod(this)">Изменить
                    </button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Закрыть</button>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('scripts')
    @parent
    <script>
        $(function () {
            $('i.glyphicon').on('click', function (element) {
                let action = $(this).data('status');
                if (action === 'delete') {
                    console.log($(this).closest('tr').find('[data-id]').text());
                    ajaxUserEditRequest(1);
                }
            });
        });

        function ajaxUserEditRequest($id) {
            $.ajax({
                headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                url: '{{ route("admin.users.ajax", ["id"=> '0'])}}' + $id,
                type: 'POST',
                data: ( '{ "user": ' + $id + ' }' ),
                contentType: 'json',
                success: function (response) {
                    $("#myModal .modal-body").html(response);
//console.log(response);
//                    let item = document.querySelector('#myModal input[name="id"]');
//                    let title = document.querySelector('#myModal .modal-title');
//                    title.innerHTML = "Редактирование итемки № <b>" + item.value + "</b>";
                }
            });
        }

        function optionShow($element) {
            var $id = $element.getAttribute('value')

            $.ajax({
                headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                url: '{{ route("admin.users.ajax", ["id"=> '0'])}}' + $id,
                type: 'POST',
                data: ( '{ "user": ' + $id + ' }' ),
                contentType: 'json',
                success: function (response) {
                    $("#myModal .modal-body").html(response);

                    let item = document.querySelector('#myModal input[name="id"]');
                    let title = document.querySelector('#myModal .modal-title');
                    title.innerHTML = "Редактирование итемки № <b>" + item.value + "</b>";
                }
            });

            $("#myModal").modal('show');
            $("#myModal").attr('style', 'margin-top: 5%; transition: all 600ms ease-in-out;');
        }

        function changeMethod(element) {
            let method = $(element).data('action');
            $('#item-form').find('[name="_method"]').val(method);
            $('#item-form').submit();
        }

    </script>
@endsection