{% extends 'partials/base.html' %}
{% load staticfiles %}
{% block head_css %}
    <link rel='stylesheet' href='{% static "lib/proekton-components/css/fonts.css" %}'>
    <link rel='stylesheet' href='{% static "lib/proekton-components/css/selected-container.css" %}'>
    <link rel='stylesheet' href='{% static "lib/proekton-components/css/editable-container.css" %}'>
    <link rel='stylesheet' href='{% static "lib/proekton-components/css/select-box.css" %}'>
    <link rel='stylesheet' href='{% static "css/project_filter.css" %}'>{#  other  #}
    <link rel='stylesheet' href='{% static "css/font-awesome.min.css" %}'>
    <link rel='stylesheet' href='{% static "css/user_profile_edit.css" %}'>
    <link rel='stylesheet' href='{% static "css/custom-checkboxes.css" %}'>
{% endblock %}
{% load thumbnail %}
{% load thumbnail %}

{% block content %}
    {% include 'partials/header.html' %}
    {#    <form method="POST" enctype="multipart/form-data" novalidate>#}
    {#                            {% csrf_token %}#}
    {##}
    {#                            {% if request.user.is_customer %}#}
    {#                                <input type="hidden" name="next"#}
    {#                                       value="{% url 'users:customer-profile-open-projects' pk=pk %}">#}
    {#                            {% elif request.user.is_contractor %}#}
    {#                                <input type="hidden" name="next" value="{% url 'users:contractor-profile' pk=pk %}">#}
    {#                            {% endif %}#}

    <div class="container mainScore">
        <div class="row mainContent">
            <div class="col-lg-12">
                <div class="row row-eq-height">
                    <div class="col-lg-3">
                        <div class="avatar" style="float: none">
                            <div class="avatarInset -position-relative-parent">
                                <a href="#" onclick="return false" class="btn close -live-image-delete"
                                   style="display: none">&times;</a>
                                {#                        {% thumbnail request.user.avatar "235x224" crop="center" as avatar %}#}
                                {#                            {% if request.user.avatar %}#}
                                {#                                <img src="{{ avatar.url }}" alt="profile-image" class="-avatar-image">#}
                                {#                            {% else %}#}
                                <img src="{% static 'img/avatar_default.png' %}" alt="profile-image"
                                     class="-avatar-image">
                                {#                            {% endif %}#}
                                {#                        {% endthumbnail %}#}
                            </div>
                        </div> <!-- avatar -->
                        <div style="margin-top: 15px">
                            <div class="upload-new">
                                <input type="file" name="image" class="-live-image-upload">

                                <p>Загрузить фотографию</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-9">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="bottom-line">
                                    <span class="header">
                                        Параметры заполнения прифиля влияют на фильтр поиска специалистов, ранжирования в списке
                                        <i class="fa fa-question-circle-o" aria-hidden="true" title=""></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-12" style="padding-bottom: 10px">
                                <span class="header">
                                    Личная информация <i class="fa fa-question-circle-o" aria-hidden="true"
                                                         title=""></i>
                                </span>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-4">
                                <input name="first_name" class="simple-input" placeholder="Фамилия">
                            </div>
                            <div class="col-lg-4">
                                <input name="last_name" class="simple-input" placeholder="Имя">
                            </div>
                            <div class="col-lg-4">
                                <input name="patronym" class="simple-input" placeholder="Отчество">
                            </div>
                            <div class="col-lg-4">
                                <div class="vertical-child" id="sb-location-1">
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="vertical-child" id="sb-location-2">
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="vertical-child" id="sb-location-3">
                                </div>
                            </div>
                            <div class="col-lg-4">
                                <div class="selected-container vertical-child no-margin" id="selected-location">
                                    <div class="header">&nbsp;</div>
                                    <input type="hidden" name="location"
                                           value="{{ location }}">
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- top -->

                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-lg-offset-3 col-lg-9">
                                <div class="top-line">
                                <span class="header">
                                    Мой опыт работы в проектировании / дизайне / сопровождении проектной документации
                                    <i class="fa fa-question-circle-o" aria-hidden="true" title=""></i>
                                </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="" id="select-box-1">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-3">
                                <div class="vertical-child" id="select-box-2">
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="vertical-child" id="select-box-3">
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="vertical-child" id="select-box-4">
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="vertical-child" id="select-box-5">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="selected-container horizontal" id="selected-spec">
                                    <input type="hidden" name="specialization"
                                           value="{{ specialization }}">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-3">
                                <div class="vertical-child" id="sb-building-classification">
                                </div>
                                <div class="vertical-child" id="sb-building-sub-classification">
                                </div>
                                <div class="selected-container" id="selected-building-classification">
                                    <input type="hidden" name="building_classification"
                                           value="{{ building_classification }}">
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="vertical-child" id="sb-construction-type">
                                </div>
                                <div class="selected-container" id="selected-construction-type">
                                    <input type="hidden" name="construction_type"
                                           value="{{ construction_type }}">
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="select-box-header vertical-child">
                                    <span style="width: 180px" class="header">Требуется допуск (СРО)</span>
                                    <i class="fa fa-question-circle-o" aria-hidden="true"
                                       title="bla-bla-bla..."></i>
                                </div>

                                <div class="custom-check">
                                    <div class="checked"></div>
                                    <div style="display: none" class="not-checked"></div>
                                    <input name="cro" type="checkbox" hidden {% if cro %} checked{% endif %}>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- center -->
                <div class="row">
                    <div class="col-lg-12">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="top-line" style="padding-top: 15px">
                                <div class="btn-group toggle" role="group" aria-label="...">
                                    <a href="{% url 'users:user-profile-edit' pk=pk %}" role="button"
                                       class="btn btn-default">Общая информация</a>
                                    <a href="{% url 'users:user-financial-info-edit' pk=pk %}"
                                       class="btn btn-default" role="button">Финансовая информация</a>
                                </div>
                                    </div>
                            </div>
                        </div>
                        <div class="row info">
                            <div class="col-lg-3">
                                <div class="header"> Дата рождения</div>
                                <div class="birth_edit_dat">
                                    {{ form.date_of_birth }}
                                </div>
                            </div>
                            <div class="col-lg-3">
                                <div class="header">Пол</div>
                                <div class="checkbox">
                                    <label class="rad">

                                        <input type="radio" name="gender" value="male" id="male">
                                        <i></i>Мужской
                                    </label>
                                    <label class="rad">

                                        <input type="radio" name="gender" value="female" id="female">
                                        <i></i>Женский
                                    </label>
                                </div>

                            </div>
                            <div class="col-lg-3">
                                <div class="header">Статус</div>
                                {{ form.contractor_status }}
                            </div>
                            <div class="col-lg-3">
                                <div class="header">Skype</div>
                                <input name="skype" class="simple-input" placeholder="skype id">
                            </div>
                            <div class="clearfix visible-lg"></div>
                            <div class="col-lg-3 vertical-child">
                                <div class="header">Сайт</div>
                                <input name="site" class="simple-input" placeholder="example.com">
                            </div>
                            <div class="col-lg-3 vertical-child">
                                <div class="header">Телефон</div>
                                <input name="phone-1" class="simple-input" placeholder="+7 909 999 00 00">
                            </div>
                            <div class="col-lg-3 vertical-child">
                                <div class="header">Второй телефон</div>
                                <input name="phone-2" class="simple-input" placeholder="+7 909 999 00 00">
                            </div>
                            <div class="col-lg-3 vertical-child" style="text-align: center">
                                <div class="header">&nbsp;</div>
                                <a href="#" class="btn btn-simple">СОХРАНИТЬ</a>
                            </div>

                        </div>

                    </div>
                </div> <!-- bottom -->
            </div>
        </div>
        <div class="row">
            {% include 'partials/footer.html' %}
        </div>

    </div>

{% endblock %}
{% block js_block %}
    {{ block.super }}
    <script src='{% static "lib/proekton-components/js/build/init_user_profile.js" %}'></script>
        <script src='{% static "projects-filter.js" %}'></script>
{% endblock %}