{% extends "theme/base.twig" %}
{% set area = 'cpainel'%}
{% set type = 'usuario'%}
{% block CSSfiles %}
    {{ parent() }}
    <!--suppress SpellCheckingInspection, HtmlUnknownTarget, HtmlUnknownTag, SpellCheckingInspection -->
    <link rel="stylesheet" href="/assets/plugins/multiselect/multiselect.css?v={{ config.versionId }}">
    <link rel="stylesheet" href="/assets/plugins/slim/slim.css?v={{ config.versionId }}">
    <link rel="stylesheet" href="/assets/css/local/usuario.css?v={{ config.versionId }}">

{% endblock %}

{% block JSfiles %}
    {{ parent() }}
    <script src="/assets/plugins/multiselect/multiselect.js?v={{ config.versionId }}"></script>
    <script src="/assets/plugins/slim/slim.js?v={{ config.versionId }}"></script>
    <script src="/assets/js/local/usuario.js?v={{ config.versionId }}"></script>
{% endblock %}


{% block content %}


    <div class="row px-md-2 px-2 m-0 w-100 pt-2 mb-2 after-header">
        <div class="col-12 col-xl-12 col-xxl-12 d-flex align-items-stretch">
            <div class="container-fluid px-0">
                <div class="row align-items-center">
                    <div class="col">
                        <h1 class="mb-0 title-after-header py-2">Usuários >> Formulário de Usuário</h1>
                    </div>

                    <div class="col-auto d-flex align-items-center my-2 my-sm-0">
                        <div class="widthfull" >
                            <button onclick="location.href='/usuario/form'"
                                    class="btn btn-lg btn-warning btn-xs" >
                                Listar usuários
                            </button>
                        </div>
                    </div>

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

    <div class="row px-md-2 px-2 m-0 w-100 pt-2 mb-2 after-header">
        <div class="col-12 col-xl-12 col-xxl-12 d-flex align-items-stretch">
            <form id="userForm" method="POST" novalidate="novalidate" autocomplete="off" class="w-100">

                {% if entity.id %}
                    <input type="hidden" name="id" value="{{ entity.id }}">
                {% endif %}

                <div class="row">
                    <div class="col-6 col-xl-6 col-xxl-6 d-flex align-items-stretch">
                        <div class="card widthfull  shadow-dark-80 border border-gray-50 mb-3 mb-xl-5">

                            <div class="card-body p-3 d-flex flex-column">
                                <h4 class="title-section-settings">
                                    Informações básicas
                                </h4>

                                <div class="row">
                                    <div class="col-sm-12">
                                        <div class=" mb-md-2 pb-2">
                                            <label class="form-label form-label-lg" for="fullname">Nome Completo
                                                <star>*</star>
                                            </label>
                                            <input type="text" class="form-control form-control-xl" name="nome"
                                                   id="nome" placeholder="Nome completo" tabindex="1"
                                                   value="{{ entity.nome }}">
                                        </div>
                                        <div class="col-sm-6 col-md-6 col-lg-4 col-xxl-6">
                                            <div class=" mb-md-2">
                                                <label class="form-label form-label-lg cpf" for="fl_tipo_pessoa">CPF
                                                    <star>*</star>
                                                </label>
                                                
                                                <input type="text" class="form-control form-control-xl mask-cpf" name="cpf"
                                                    id="cpf" placeholder="CPF" tabindex="4"
                                                    value="{{ entity.cpf }}">
                                            </div>
                                        </div>

                                        <div class=" mb-md-2 pb-2">
                                            <label class="form-label form-label-lg" for="login">Login
                                                <star>*</star>
                                            </label>
                                            <input type="text" class="form-control form-control-xl" name="login"
                                                   id="login" {{ (entity.id_user) ? 'readonly="readonly"' : '' }}
                                                   placeholder="Login" tabindex="2" value="{{ entity.login }}"
                                                   autocomplete="off">
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-sm-6 col-md-6 col-lg-6 col-xxl-6">
                                        <div class=" mb-md-2">
                                            <label class="form-label form-label-lg" for="fl_tipo_pessoa">Telefone
                                                <star>*</star>
                                            </label>
                                            
                                            <input type="text" class="form-control form-control-xl mask-phone" name="telefone"
                                                id="telefone" placeholder="(xx) xxxxx-xxxx" tabindex="4"
                                                value="{{ entity.telefone }}">
                                        </div>
                                    </div>
                                    <div class="col-sm-6 col-md-6 col-lg-6 col-xxl-6">
                                        <div class=" mb-md-2">
                                            <label class="form-label form-label-lg" for="fl_tipo_pessoa">Celular
                                            </label>
                                            
                                            <input type="text" class="form-control form-control-xl mask-phone" name="celular"
                                                id="celular" placeholder="(xx) xxxxx-xxxx" tabindex="4"
                                                value="{{ entity.celular }}">
                                        </div>
                                    </div>
                                    <div class="col-sm-12 col-md-12 col-lg-12 col-xxl-4">
                                        <div class=" mb-md-2">
                                            <label class="form-label form-label-lg" for="fl_tipo_pessoa">Email
                                            </label>
                                            
                                            <input type="text" class="form-control form-control-xl " name="email"
                                                id="email" placeholder="email" tabindex="4"
                                                value="{{ entity.email }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-sm-6 mb-md-2 pb-2">
                                        <label class="form-label form-label-lg" for="password">Senha
                                            <star>*</star>
                                        </label>
                                        <input type="password" class="form-control form-control-xl" name="password"
                                               id="password" placeholder="Senha"
                                               value="{{ (user.id_user >= 0) ? entity.senha : '' }}"
                                               tabindex="4">
                                    </div>
                                    <div class="col-sm-6 mb-md-2 pb-2">
                                        <label class="form-label form-label-lg" for="password_confirm">Confirmar senha
                                            <star>*</star>
                                        </label>
                                        <input type="password" class="form-control form-control-xl"
                                               name="password_confirm"
                                               id="password_confirm" placeholder="Confirmar Senha" tabindex="5"
                                               value="{{ (user.id_user >= 0) ? entity.senha : '' }}">
                                    </div>
                                    
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 col-xl-6 col-xxl-6 d-flex align-items-stretch">
                        <div class="card widthfull  shadow-dark-80 border border-gray-50 mb-3 mb-xl-5">
                            <div class="card-body p-3 d-flex flex-column">
                                <h4 class="title-section-settings">
                                    Permissões de acesso
                                </h4>

                                <div class="mb-md-2 pb-2">
                                    <label class="form-label form-label-lg" for="role">Perfil
                                        <star>*</star>
                                    </label>
                                    <select name="id_perfil" class="form-control form-control-xl" id="id_perfil" tabindex="6">
                                        <option value="">Selecione o perfil</option>
                                        {% for itens in perfil %}
                                            {% set selected = (entity.id_perfil == itens.id) ? 'selected="selected"' : '' %}
                                           
                                            <option value="{{ itens.id }}" {{ selected }}  {{ disabled }}>{{ itens.descricao }}</option>

                                        {% endfor %}
                                      
                                    </select>
                                </div>
                                {% if session.session_user.id == 1 %}
                                    <div class="mb-md-2 pb-2">
                                        <label class="form-label form-label-lg" for="role">Conta
                                            <star>*</star>
                                        </label>
                                        <select name="id_conta" class="form-control form-control-xl" id="id_conta" tabindex="6">
                                            <option value="">Selecione a conta</option>
                                            {% for itens in conta %}
                                                {% set selected = (entity.id_conta == itens.id) ? 'selected="selected"' : '' %}
                                            
                                                <option value="{{ itens.id }}" {{ selected }}  {{ disabled }}>{{ itens.razao_social }}</option>

                                            {% endfor %}
                                        
                                        </select>
                                    </div>
                                {% endif %}
                                <button type="submit" class="btn btn-success btn-lg mt-auto btn-persist" tabindex="13">
                                    Salvar
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>

{% endblock %}