@extends($layout)

@section('content')
<form method="POST" action="{{ route('user_update', ['user' => $user->id]) }}" enctype="multipart/form-data">

<div class="row">
    <div class="col s10">
        <div class="container" style="padding-right: 5px; padding-left: 5px;">
            <div class="section">

                    @csrf

                    @if (Session::has('success'))
                    <div class="card-alert card green">
                        <div class="card-content white-text">
                            <p>{{ Session::get('success') }} </p>
                        </div>
                        <button type="button" class="close white-text" data-dismiss="alert" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                    </div>
                    @endif

                    <div class="card">
                        <div class="card-panel">

                            <div class="row">


                                <div class="col s12 m12">

                                    <div class="col s4 input-field">
                                        <input id="first_name" name="first_name" type="text"
                                            value="{{ old('first_name', $user->first_name) }}">

                                        <label for="first_name">Prénom</label>
                                        @error('first_name')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>

                                    <div class="col s4 input-field">
                                        <input id="name" value="{{ old('name', $user->name) }}" name="name" type="text">
                                        <label for="name">Nom </label>
                                        @error('name')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>

                                    <div class="col s4 input-field" id='div_role'>
                                        <select style="width: 100%;" name="role" id='role'
                                            class="select2 browser-default">
                                            @foreach ($roles as $role)
                                            <option class="option"
                                                {{ $role->id == old('role', $user->role) ? 'selected' : '' }}
                                                value="{{ $role->id }}">{{ $role->label }}</option>
                                            @endforeach
                                        </select>
                                        <label>Role</label>
                                        @error('role')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>



                                </div>


                                



                                <div class="col s12 m12">

                                <div class="col s4 input-field">
                                        <input id="login" name="login" value="{{ old('login', $user->login) }}"
                                            autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"
                                            type="text">
                                        <label for="login">Identifiant </label>
                                        @error('login')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>

                                    <div class="col s4 input-field">
                                        <input id="password" name="password" readonly
                                            onfocus="this.removeAttribute('readonly');" autocomplete="off"
                                            type="password">
                                        <label for="password"> Mot de passe</label>
                                        @error('password')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>

                                    <div class="col s4 input-field">
                                        <input id="password_confirmation" readonly
                                            onfocus="this.removeAttribute('readonly');" name="password_confirmation"
                                            type="password" class="validate">
                                        <label for="password_confirmation"> Confirmation mot de passe</label>
                                        @error('password_confirmation')
                                        <span class="helper-text materialize-red-text">{{ $message }}</span>
                                        @enderror
                                    </div>

                                </div>

                                <div class="col s12 input-field" style="height:auto">
                                    <select multiple="multiple" size="10" name="fonctionnalites_ajoutees[]" class="listbox">
                                        @foreach ($fonctionnalites as $fonctionnalite)
                                        <option
                                            {{ in_array($fonctionnalite->id, old('fonctionnalites_ajoutees', json_decode($user->fonctionnalites_ajoutees)))  ? "selected" : '' }}
                                            value="{{ $fonctionnalite->id }}">{{ $fonctionnalite->name }}
                                        </option>
                                        @endforeach
                                    </select>
                                    <label for="label" style="font-size: 1rem;"> Liste des fonctionnalités à ajouter au rôle :
                                    </label>
                                </div>


                                <div class="col s12 input-field" style="height:auto">
                                    <select multiple="multiple" size="10" name="fonctionnalites_retirees[]" class="listbox">
                                        @foreach ($fonctionnalites as $fonctionnalite)
                                        <option
                                        {{ in_array($fonctionnalite->id, old('fonctionnalites_retirees', json_decode($user->fonctionnalites_retirees)))  ? "selected" : '' }}
                                            value="{{ $fonctionnalite->id }}">{{ $fonctionnalite->name }}

                                            
                                        </option>
                                        @endforeach
                                    </select>
                                    <label for="label" style="font-size: 1rem;"> Liste des fonctionnalités à retirer du rôle :
                                    </label>
                                </div>
                            </div>


                            <div class="row">
                                <div class="col s12 m12">
                                    <div class="col s12 display-flex justify-content-end mt-3">
                                        <a onclick="load()" href="{{ route('user_list') }}"><button type="button"
                                                class="btn btn-light">Retour </button></a>
                                        <button onclick="load()" type="submit" class="btn indigo" style="margin-left: 1rem;">
                                            Enregistrer</button>
                                    </div>
                                </div>
                            </div>




                        </div>
                    </div>
                

            </div>
        </div>
    </div>




<div class="col s2" style="padding:0px; ">
                            <div class="container" style="padding-left: 0px;">
                                <div class="section">
                                    <div class="card">
                                        <div class="card-panel">
                                            <div class="row">
                                                    <div class="col s12 m12">
                                                        <div class="row">
                                                            </div>
                                                            <img width="90%" src="{{\App\Models\Util::getphoto($user->photo, $user->sexe)}}" style="width: 70%; margin: 0% 16%; height: 120px; ">
                                                        
                                                        
                                                            <div class="col s12 input-field" style="margin: 0px; padding: 0px;">
                                                                <div class="file-field input-field" style="width: 100%; float: left;">
                                                                    <div class="btn">
                                                                        <span>Photo</span>
                                                                        <input name="file" type="file">
                                                                    </div>
                                                                <div class="file-path-wrapper">
                                                                    <input class="file-path" type="text">
                                                                </div>
                                                            </div>
                                                        
                                                        
                                                        </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                            </div>
                        </div>


</div></div>
</form>
@stop
@section('js')
<link rel="stylesheet" type="text/css" href="/assets/vendors/duallistbox/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/assets/vendors/duallistbox/bootstrap-duallistbox.css">
<script src="/assets/vendors/duallistbox/jquery.bootstrap-duallistbox.js"></script>

<style>
.select-dropdown {
    display: none !important;
}

.info {
    display: none !important;
}

.info-container {
    display: none !important;
}
</style>
<script>
$(document).ready(function() {
    $('.listbox').bootstrapDualListbox();
});
</script>
@stop