{% extends "theme::layouts/default" %}

{% block styles %}
    {{ asset_style("visiosoft.module.profile::assets/css/profile.scss") }}
{% endblock %}

{% block content %}

    {% set profile_photo = user.file %}
    {% if profile_photo %}
        {% set profile_photo = file(profile_photo.id).url %}
    {% else %}
        {% set profile_photo = img('visiosoft.module.profile::images/profile-default.png').url %}
    {% endif %}

    <div class="row mt-5">

        {% include "visiosoft.module.profile::profile/partials/navigation" %}

        <div class="col-12 col-md-8">
            <div class="row px-3">

                <!-- User Profile Detail Section-->
                <div class="col-md-12 bg-dark">
                    <div class="row">
                        <div class="col-md-4 p-5">
                            <div class="row">
                                {% if setting_value('visiosoft.module.profile::upload_avatar') %}
                                    <div class="col-md-12 text-center align-middle">
                                        <img src="{{ profile_photo }}" class="img-responsive w-100"
                                             style="max-width: 150px">
                                    </div>
                                {% endif %}
                                <div class="col-md-12 text-center align-middle text-white p-2 text-truncate">
                                    <h3>{{ user.name }}</h3>
                                    <small>{{ auth_user().last_login_at|date("d/m/Y H:i:s") }}</small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- User Profile Detail Section-->


                <!-- User Profile Form Section-->
                <div class="col-md-12 mt-5 bg-light profile-section">
                    <nav>
                        <div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
                            <a class="nav-item nav-link active text-dark" id="nav-profile-tab" data-toggle="tab"
                               href="#nav-profile"
                               role="tab" aria-controls="nav-profile" aria-selected="true">
                                {{ trans('visiosoft.module.profile::field.profile.name') }}
                            </a>
                            <a class="nav-item nav-link text-dark" id="nav-details-tab" data-toggle="tab"
                               href="#nav-details"
                               role="tab" aria-controls="nav-details" aria-selected="false">
                                {{ trans('visiosoft.module.profile::field.details.name') }}
                            </a>
                            <a class="nav-item nav-link text-dark" id="nav-password-tab" data-toggle="tab"
                               href="#nav-password"
                               role="tab" aria-controls="nav-password" aria-selected="false">
                                {{ trans('visiosoft.module.profile::field.password.name') }}
                            </a>
                            {{ addBlock('profile/detail/content-tab')|raw }}
                        </div>
                    </nav>

                    <div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
                        <div class="tab-pane fade show active" id="nav-profile" role="tabpanel"
                             aria-labelledby="nav-profile-tab">
                            <div class="col-12">
                                {% set userForm = form('userProfile').entry(user.id).get() %}
                                {{ userForm.open()|raw }}
                                <div class="form-group">
                                    <label class="control-label font-weight-bold">
                                        {{ trans("visiosoft.module.profile::field.first_name.name") }}
                                    </label>
                                    {{ userForm.fields.first_name.input|raw }}
                                </div>
                                <div class="form-group">
                                    <label class="control-label font-weight-bold">
                                        {{ trans("visiosoft.module.profile::field.last_name.name") }}
                                    </label>
                                    {{ userForm.fields.last_name.input|raw }}
                                </div>
                                <div class="form-group">
                                    <label class="control-label font-weight-bold">
                                        {{ trans("visiosoft.module.profile::field.email.name") }}
                                    </label>
                                    <input value="{{ user.email }}" type="text" disabled class="form-control">
                                </div>
                                <div class="form-group">
                                    {{ userForm.actions|raw }}
                                </div>
                                {{ userForm.close()|raw }}
                                <div class="col-12">
                                    <label class="text-muted">
                                        {{ trans('visiosoft.module.profile::message.disable_account') }}
                                    </label>
                                    <button type="button" class="btn btn-danger float-right"
                                            onclick="window.location.href='/profile/closeAccount'">{{ trans("visiosoft.module.profile::field.disable_account.name") }}</button>

                                </div>

                            </div>
                        </div>

                        <div class="tab-pane fade" id="nav-details" role="tabpanel"
                             aria-labelledby="nav-details-tab">
                            <div class="col-12">
                                {% set profileForm = form('profile').entry(user.id).get() %}

                                {{ profileForm.open()|raw }}

                                {% if setting_value('visiosoft.module.profile::upload_avatar') %}
                                    <div class="form-group">
                                        {{ profileForm.fields.file|raw }}
                                    </div>
                                {% endif %}

                                <div class="form-group required-profile-phone-field">
                                    <label class="control-label font-weight-bold">
                                        {{ profileForm.fields.gsm_phone.label }}
                                    </label>
                                    {{ profileForm.fields.gsm_phone.input|raw }}
                                </div>
                                <div class="form-group required-profile-phone-field">
                                    <label class="control-label font-weight-bold">
                                        {{ profileForm.fields.office_phone.label }}
                                    </label>
                                    {{ profileForm.fields.office_phone.input|raw }}
                                </div>
                                <div class="form-group required-profile-phone-field">
                                    <label class="control-label font-weight-bold">
                                        {{ profileForm.fields.land_phone.label }}
                                    </label>
                                    {{ profileForm.fields.land_phone.input|raw }}
                                </div>
                                <div class=" form-group">
                                    <label class="control-label font-weight-bold">{{ trans("visiosoft.module.profile::field.identification_number.name") }}</label>
                                    {{ profileForm.fields.identification_number.input|raw }}
                                </div>
                                <div class="form-group">
                                    <label class="control-label font-weight-bold">{{ trans("visiosoft.module.profile::field.register_type.name") }}</label>
                                    {{ profileForm.fields.register_type.input|raw }}
                                </div>
                                <div class="form-group">
                                    {{ profileForm.actions|raw }}
                                </div>
                                {{ profileForm.close()|raw }}
                            </div>
                        </div>

                        <div class="tab-pane fade" id="nav-password" role="tabpanel" aria-labelledby="nav-password-tab">
                            {% set passwordForm = form('updatePassword').get() %}

                            {{ passwordForm.open()|raw }}

                            <div class="form-group">
                                <label class="font-weight-bold">{{ trans("visiosoft.module.profile::field.new_password.name") }}</label>
                                {{ passwordForm.fields.new_password.input|raw }}
                            </div>

                            <div class="form-group">
                                <label class="font-weight-bold">{{ trans("visiosoft.module.profile::field.re_new_password.name") }}</label>
                                {{ passwordForm.fields.re_new_password.input|raw }}
                            </div>
                            <div class="form-group">
                                {{ passwordForm.actions|raw }}
                            </div>
                        </div>
                        {{ passwordForm.close|raw }}
                        {{ addBlock('profile/detail/content')|raw }}
                    </div>
                    <!-- User Profile Form Section-->
                </div>
            </div>
        </div>

    </div>
    {{ asset_add("scripts.js", "visiosoft.module.profile::assets/js/profile.js") }}
{% endblock %}