{% extends 'base.html.twig' %}

{% block title %}
    {% if id %}
        {{ 'Edit user'|trans }}
    {% else %}
        {{ 'New user'|trans }}
    {% endif %}
{% endblock %}

{% block body %}

<ul class="nav nav-tabs nav-justified md-tabs" id="myTabJust" role="tablist">
    <li class="nav-item">
    <a class="nav-link active" id="general_tab_button" data-toggle="tab" href="#general_tab" role="tab" aria-controls="general_tab"
        aria-selected="true">{{ 'General'|trans }}</a>
    </li>
    <li class="nav-item" id="permits_tab_item" style="{{ (rol == '')?'display:none':'' }}">
    <a class="nav-link" id="permits_tab_button" data-toggle="tab" href="#user_permits_tab" role="tab" aria-controls="permits_tab"
        aria-selected="false">{{ 'Privileges'|trans }}</a>
    </li>
</ul>

<div class="tab-content card pt-5" id="permits_tab">
    <div class="tab-pane fade show active" id="general_tab" role="tabpanel" aria-labelledby="general_tab_button">
        {{ form_start(form, {method: 'POST', action: (id)?path("edit_user", {"id": id, "referer" : app.request.headers.get('referer')}):path("new_user", {"referer" : app.request.headers.get('referer')}), enctype:'multipart'}) }}

        <div class="md-form">
            {% if id %}
                <div class="row">
                    <div class="col-md-9">
            {% endif %}
            {{ form_label(form.username, "", {'attr': {'class': 'bmd-label-floating'}}) }}
            {{ form_widget(form.username, {'attr': {'class': 'form-control'}}) }}
            <div class="invalid-feedback">
               {{ form_errors(form.username) }}
            </div>
            {% if id %}
                    </div>
                    <div class="container_change_password">
                            <button id="bt_change_password" class="btn btn-primary btn-sm"><i class="fas fa-lock"></i> {{ 'Change password'|trans }}</button>
                    </div>
                </div>
            {% endif %}
        </div>

        <div class="md-form">
            {{ form_label(form.email, "", {'attr': {'class': 'bmd-label-floating'}}) }}
            {{ form_widget(form.email, {'attr': {'class': 'form-control'}}) }}
            <div class="invalid-feedback">
               {{ form_errors(form.email) }}
            </div>
        </div>

        <div id="password_container" style="{{ (id)?"display:none":" " }}">
            <div class="md-form">
                {{ form_label(form.plainPassword.first, "", {'attr': {'class': 'bmd-label-floating'}}) }}
                {{ form_widget(form.plainPassword.first, {'attr': {'class': 'form-control', 'disabled': (id)?true:false}}) }}
                <div class="invalid-feedback">
                   {{ form_errors(form.plainPassword.first) }}
                </div>
            </div>    
    
            <div class="md-form">
                {{ form_label(form.plainPassword.second, "", {'attr': {'class': 'bmd-label-floating'}}) }}
                {{ form_widget(form.plainPassword.second, {'attr': {'class': 'form-control', 'disabled': (id)?true:false}}) }}
                <div class="invalid-feedback">
                   {{ form_errors(form.plainPassword.second) }}
                </div>
            </div>
        </div>

        <div class="md-form">
            {{ form_label(form.firstName, "", {'attr': {'class': 'bmd-label-floating'}}) }}
            {{ form_widget(form.firstName, {'attr': {'class': 'form-control'}}) }}
            <div class="invalid-feedback">
               {{ form_errors(form.firstName) }}
            </div>
        </div>

        <div class="md-form">
            {{ form_label(form.lastName, "", {'attr': {'class': 'bmd-label-floating'}}) }}
            {{ form_widget(form.lastName, {'attr': {'class': 'form-control'}}) }}
            <div class="invalid-feedback">
               {{ form_errors(form.lastName) }}
            </div>
        </div>

        <div class="file-field">
            <div class="file-field row">
                <div class="col-md-9">
                    <div class="btn btn-primary btn-sm float-left">
                      <span>{{ 'User image'|trans }}</span>
                      {{ form_widget(form.image) }}
                    </div>
                    <div class="file-path-wrapper">
                      <input value="{{ user_image_name }}" class="file-path validate" type="text" placeholder="Upload your file">
                    </div>
                </div>
                <div class="col-md-2 offset-md-1  edit_user_image_container">
                   <div>
                        <img id="user_image_preview" src="{{ asset('') }}{{ (user.getImage())? user.getImage():"uploads/users/user_images/user_img_deafult.png" }}" class="img-fluid" alt="{{ user_image_name }}">
                   </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                {{ form_widget(form.partner_contracts, {'attr': {'class': 'mdb-select md-form', 'searchable': 'Search here..'}}) }}
                <label class="mdb-main-label">{{ 'users.choose_partner_contract'|trans }}</label>
                <div class="invalid-feedback">
                   {{ form_errors(form.partner_contracts) }}
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md">
                {{ form_widget(form.level, {'attr': {'class': 'mdb-select md-form', 'searchable': 'Search here..'}}) }}
                <label class="mdb-main-label">{{ 'choose_the_level'|trans }}</label>
                <div class="invalid-feedback">
                    {{ form_errors(form.level) }}
                </div>
            </div>
            <div class="col-md">
                <div class="" id="company_entity_container">
                    {{ form_widget(form.fk_company_entity, {'attr': {'class': 'mdb-select md-form', 'searchable': 'Search here..'}}) }}
                    <label class="mdb-main-label">{{ 'choose_the_company_entity'|trans }}</label>
                    <div class="invalid-feedback">
                       {{ form_errors(form.fk_company_entity) }}
                    </div>
                </div>
            </div>
             <div class="col-md" style="{{("ROLE_MARKET" in user.getRoles())?"":"display:none"}}">
                <div class="">
                    {{ form_widget(form.territories, {'attr': {'class': 'mdb-select md-form', 'searchable': 'Search here..'}}) }}
                    <label class="mdb-main-label">{{ 'choose_the_territory'|trans }}</label>
                    <div class="invalid-feedback">
                       {{ form_errors(form.territories) }}
                    </div>
                </div>
             </div>
        </div>


        <div class="row">
            <div class="md-form col-sm">
                {{ form_widget(form.cancel, {'attr': {'class': 'btn btn-outline-info btn-rounded btn-block z-depth-0 my-4 waves-effect cancel'}}) }}
            </div>

            <div class="md-form col-sm">
                {{ form_widget(form.save, {'attr': {'class': 'btn btn-outline-info btn-rounded btn-block z-depth-0 my-4 waves-effect', type:"submit"}}) }}
            </div>
        </div>
    {{ form_end(form) }}
    </div>
    <div class="tab-pane fade" id="user_permits_tab" role="tabpanel" aria-labelledby="permits_tab_button">
        <div class="table-responsive md-form">
            <table id="table_user_permits" class="table matrixtable">
                <thead>
                    <th></th>
                    <th>{{ 'Create'|trans }}</th>
                    <th>{{ 'Read'|trans }}</th>
                    <th>{{ 'Update'|trans }}</th>
                    <th>{{ 'Delete'|trans }}</th>
                    <th class="column_approve" style="{{ (rol != "ROLE_EUROPE" and rol != "ROLE_MARKET")?'display:none':'' }}">{{ 'Approve'|trans }}</th>
                    <th class="column_validate" style="{{ (rol != "ROLE_MARKET" and rol != "ROLE_PARTNER")?'display:none':'' }}">{{ 'Validate'|trans }}</th>
                </thead>
                <tbody>
                    {% for department in departments %}
                        <tr>
                            <th>{{ department.getName() }}</th>
                            <td>
                                <div class="form-check">
                                    <input type="checkbox" {{ (department.getName in array_departments_roles|keys and "ROLE_CREATE" in array_departments_roles[department.getName])?"checked":"" }} class="form-check-input" id="{{ department.getRowid() }}_create" data-department="{{ department.getRowid() }}" data-role="create">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_create"></label>
                                </div>
                            </td>
                            <td>
                                <div class="form-check">
                                    <input type="checkbox" {{ (department.getName in array_departments_roles|keys and "ROLE_READ" in array_departments_roles[department.getName])?"checked":"" }}  class="form-check-input" id="{{ department.getRowid() }}_read" data-department="{{ department.getRowid() }}" data-role="read">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_read"></label>
                                </div>
                            </td>
                            <td>
                                <div class="form-check">
                                    <input type="checkbox"  {{ (department.getName in array_departments_roles|keys and "ROLE_UPDATE" in array_departments_roles[department.getName])?"checked":"" }} class="form-check-input" id="{{ department.getRowid() }}_update" data-department="{{ department.getRowid() }}" data-role="update">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_update"></label>
                                </div>
                            </td>
                            <td>
                                <div class="form-check">
                                    <input type="checkbox" {{ (department.getName in array_departments_roles|keys and "ROLE_DELETE" in array_departments_roles[department.getName])?"checked":"" }} class="form-check-input" id="{{ department.getRowid() }}_delete" data-department="{{ department.getRowid() }}" data-role="delete">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_delete"></label>
                                </div>
                            </td>
                            <td class="column_approve" style="{{ (rol != "ROLE_EUROPE" and rol != "ROLE_MARKET")?'display:none':'' }}">
                                <div class="form-check">
                                    <input type="checkbox"  {{ (department.getName in array_departments_roles|keys and "ROLE_APPROVE" in array_departments_roles[department.getName])?"checked":"" }}  class="form-check-input" id="{{ department.getRowid() }}_approve" data-department="{{ department.getRowid() }}" data-role="approve">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_approve"></label>
                                </div>
                            </td>
                            <td class="column_validate" style="{{ (rol != "ROLE_MARKET" and rol != "ROLE_PARTNER")?'display:none':'' }}">
                                <div class="form-check">
                                    <input type="checkbox" {{ (department.getName in array_departments_roles|keys and "ROLE_VALIDATE" in array_departments_roles[department.getName])?"checked":"" }}  class="form-check-input" id="{{ department.getRowid() }}_validate" data-department="{{ department.getRowid() }}" data-role="validate">
                                    <label class="form-check-label" for="{{ department.getRowid() }}_validate"></label>
                                </div>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="row">
            <div class="md-form col-sm">
                <button type="button" id="user_cancel_permits" name="user[cancel]" class="btn btn-outline-info btn-rounded btn-block z-depth-0 my-4 waves-effect cancel">Cancel</button>
            </div>

            <div class="md-form col-sm">
                <button type="submit" id="user_save_permits" name="user[save]" class="btn btn-outline-info btn-rounded btn-block z-depth-0 my-4 waves-effect">Save</button>
            </div>
        </div>
    </div>
</div>



{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('js/user/edit.js') }}"></script>
{% endblock %}