@extends('adminpanel.layouts.app')

@section('title')Пользователи@endsection

@section('content')
    <div class="content">
        <div class="col-12">
            <div class="card" style="width: 100%;">
                <button type="button" class="btn btn-success btn-sm col-2 m-2"
                        data-toggle="modal" data-target="#ModalUser-new">
                    Создать пользователя
                </button>
                <div class="modal fade" id="ModalUser-new" tabindex="-1"
                     role="dialog" aria-labelledby="ModalUser-newTitle"
                     aria-hidden="true">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                        <div class="modal-content">
                            <form method="POST" action="{{route('newUser')}}"
                                  enctype="multipart/form-data">
                                @csrf
                                <div class="modal-header">
                                    <h5 class="modal-title"
                                        id="ModalUser-newTitle">Редактировать</h5>
                                    <button type="button" class="close"
                                            data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                    </button>
                                </div>
                                <div class="modal-body">
                                    <div class="form-group">
                                        <label for="user-new-name">Имя</label>
                                        <input type="text" class="form-control"
                                               id="user-new-name"
                                               name="user[new][name]"
                                               value="">
                                    </div>
                                    <div class="form-group">
                                        <label for="user-new-email">Email</label>
                                        <input type="email" class="form-control"
                                               id="user-new-email"
                                               name="user[new][email]"
                                               value="">
                                    </div>
                                    <div class="form-group">
                                        <label for="user-new-password">Пароль</label>
                                        <input type="password" class="form-control"
                                               id="user-new-password"
                                               name="user[new][password]"
                                               value="">
                                        <label for="user-new-password_confirmation">Подтверждение
                                            пароля</label>
                                        <input type="password" class="form-control mt-2"
                                               id="user-new-password_confirmation"
                                               name="user[new][password_confirmation]"
                                               value="">
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary"
                                            data-dismiss="modal">Закрыть
                                    </button>
                                    <button type="submit" class="btn btn-success">
                                        Сохранить изменения
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-striped table-sm">
                            <thead>
                            <tr>
                                <th>ID</th>
                                <th>Имя</th>
                                <th>E-mail</th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($users as $user)
                                <tr>
                                    <td>{{$user->id}}</td>
                                    <td>{{ $user->name }}</td>
                                    <td>{{$user->email}}</td>
                                    <td>
                                        <button type="button" class="btn btn-primary btn-sm"
                                                data-toggle="modal" data-target="#ModalUser-{{$user->id}}">
                                            Редактировать
                                        </button>
                                        <a class="btn btn-danger btn-sm"
                                           href="{{route('deleteUser',['user'=>$user->id])}}">Удалить</a>
                                    </td>
                                    <!-- Modal Редактировать -->
                                    <div class="modal fade" id="ModalUser-{{$user->id}}" tabindex="-1"
                                         role="dialog" aria-labelledby="ModalUser-{{$user->id}}Title"
                                         aria-hidden="true">
                                        <div class="modal-dialog modal-dialog-centered" role="document">
                                            <div class="modal-content">
                                                <form method="POST" action="{{route('saveUser',['user'=>$user->id])}}"
                                                      enctype="multipart/form-data">
                                                    @csrf
                                                    <div class="modal-header">
                                                        <h5 class="modal-title"
                                                            id="ModalUser-{{$user->id}}Title">Редактировать</h5>
                                                        <button type="button" class="close"
                                                                data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="form-group">
                                                            <label for="user-{{$user->id}}-name">Имя</label>
                                                            <input type="text" class="form-control"
                                                                   id="user-{{$user->id}}-name"
                                                                   name="user[{{$user->id}}][name]"
                                                                   value="{{$user->name}}">
                                                        </div>
                                                        <div class="form-group">
                                                            <label for="user-{{$user->id}}-email">Email</label>
                                                            <input type="email" class="form-control"
                                                                   id="user-{{$user->id}}-email"
                                                                   name="user[{{$user->id}}][email]"
                                                                   value="{{$user->email}}">
                                                        </div>
                                                        <div class="form-group">
                                                            <label for="user-{{$user->id}}-password">Пароль</label>
                                                            <input type="password" class="form-control"
                                                                   id="user-{{$user->id}}-password"
                                                                   name="user[{{$user->id}}][password]"
                                                                   value="">
                                                            <label for="user-{{$user->id}}-password_confirmation">Подтверждение
                                                                пароля</label>
                                                            <input type="password" class="form-control mt-2"
                                                                   id="user-{{$user->id}}-password_confirmation"
                                                                   name="user[{{$user->id}}][password_confirmation]"
                                                                   value="">
                                                        </div>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-secondary"
                                                                data-dismiss="modal">Закрыть
                                                        </button>
                                                        <button type="submit" class="btn btn-success">
                                                            Сохранить изменения
                                                        </button>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection