@extends('layouts.layout_pagina',
[
    'icone_titulo'=>'fas fa-laptop',
    'titulo'=>'Configurações',
    'breadcrumb'=>['Configurações','Perfil']
])

@section('css')
<link rel="stylesheet" href="{{{ URL::asset('js/DataTables/datatables.min.css') }}}" />
<link rel="stylesheet" href="{{{ URL::asset('css/bootstrap-select-1.13.2/bootstrap-select.min.css') }}}" />
<style>


.circle {
  background-color: #aaa;
  border-radius: 50%;
  width: 200px;
  height: 200px;
  overflow: hidden;
  position: relative;
}

.circle img {
  position: absolute;
  bottom: 0;
  width: 100%;
}


input[type="file"] {
    display: none;
}
.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}

</style>

@endsection

@section('scripts')
<script src="{{{ URL::asset('js/DataTables/datatables.min.js') }}}"></script>
<script src="{{{ URL::asset('js/views/perfil/perfil.js') }}}"></script>
<script src="{{{ URL::asset('js/bootstrap-select-1.13.2/bootstrap-select.min.js') }}}"></script>
<script src="{{{ URL::asset('js/bootstrap-select-1.13.2/i18n/defaults-pt_BR.min.js') }}}"></script>
@endsection

@section('pagina')


<div class="container-fluid">

    <div class="card mt-2">
        <div class="card-header cor-card-header text-white d-flex justify-content-between bg-primary-gradient">
            <h3><i class="far fa-user"> </i> Perfil </h3>
        </div>
        <form method="POST" action="{{route('acesso.perfil.salvar')}}" enctype="multipart/form-data">
            @csrf

        <div class="card-body">

            <input type="hidden" name="codigo" value="{{$usuario->id}}"/>
            <input type="hidden" name="setor" value="{{$usuario->fk_setor}}"/>
            <input type="hidden" name="usuario" value="{{$usuario->usuario}}"/>
            <input type="hidden" id="fotoPerfil" name="foto_perfil" value="{{$usuario->foto}}"/>
            <input type="hidden" name="password_perfil" value="{{$usuario->password}}"/>

            <div class="row">

                <div class="col-md-2">

                            <div class="preview text-center" style="display: none">

                                @if($usuario->foto != "Null")

                                    @if($usuario->foto == null)
                                    <img id="imgPreview"  src="{{URL::asset('/img/default-user.png')}}" alt="Imagem Perfil" class="circle" />
                                    @else
                                    <img id="imgPreview"  src="{{ asset('storage/images/'.$usuario->foto) }}" alt="Imagem Perfil" class="circle" />
                                    @endif

                                @else
                                <img id="imgPreview"  src="{{URL::asset('/img/default-user.png')}}" alt="Imagem Perfil" class="circle" />
                                @endif
                            </div>

                            <div class="img-perfil text-center">

                                <img src="{{URL::asset('/img/default-user.png')}}" alt="..." class="circle">
                            </div>

                            <div class="text-center mt-2">
                                <label for="foto" class="custom-file-upload">
                                    <i class="fa fa-cloud-upload"></i> Selecionar imagem
                                </label>
                                <input type="file" name="foto" id="foto" />
                            </div>



                </div>

                <div class="col-md-10">


                        @if ( $usuario->email ==null)
                        <div class="row">
                            <div class="col form-group">
                                <div class="alert alert-danger" role="alert">
                                  O campo de e-mail é necessário para recuperação de acesso.
                                 </div>
                            </div>
                        </div>
                        @endif
                            <div class="row">
                                <div class="col form-group">
                                    <label for="txtNome" class="col-form-label text-md-left">Nome</label>
                                    <input id="txtNome" class="form-control" name="txtNome" type="text" maxlength="100" value="{{$usuario->nome}}" placeholder="Nome" disabled/>
                                </div>


                                <div class="col form-group">
                                    <label for="txtUsuario" class="col-form-label text-md-left">ID</label>
                                    <input id="txtUsuario" class="form-control" name="txtUsuario" type="text" maxlength="100" value="{{$usuario->usuario}}" placeholder="CPF" readonly/>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col form-group">
                                    <label id="txtEmail_label" for="txtEmail"  class="col-form-label text-md-left">E-mail</label>
                                    <input id="txtEmail" class="form-control" name="txtEmail" type="text" maxlength="100" value="{{$usuario->email}}" placeholder="Seu e-mail" />
                                </div>

                                <div class="col form-group">
                                    <label for="txtTelefone"  class="col-form-label text-md-left">Telefone</label>
                                    <input id="txtTelefone" class="form-control" name="txtTelefone" type="text" maxlength="20" value="{{$usuario->telefone}}" laceholder="Telefone" />
                                </div>

                             </div>

                            <div class="row">
                                <div class="col form-group">
                                    <label for="txtSenha"  class="col-form-label text-md-left">Senha</label>
                                    <input id="txtSenha" class="form-control" name="txtSenha" type="password" maxlength="30" />
                                </div>

                                <div class="col form-group">
                                    <label for="txtSenha_confirmation"  class="col-form-label text-md-left">Confirmar Senha</label>
                                    <input id="txtSenha_confirmation" class="form-control" name="txtSenha_confirmation" type="password" maxlength="30"/>
                                </div>
                            </div>

                </div>
            </div>
        </div>
        <div class="card-action mb-4 pt-0">

            <div class="form-group">
                <button id="btnNovaSenha" type="submit" class="btn btn-lg btn-info float-lg-right" aria-label="Salvar" >
                    <i class="fas fa-save"></i> Salvar </button>
            </div>
        </div>


      </form>

        </div>
    </div>

</div>


@endsection