{% extends 'partials/base.html' %}
{% load i18n %}

{% block head_css %}
  <style>
    .-error, .errorlist {
      color: red
    }
  </style>
{% endblock %}


{% block content %}
  {% include 'partials/modals/project_work_type_suggestion.html' %}
  {% include 'partials/header.html' %}

  <div class="container mainScore">
    <div class="row">
      <div class="col-lg-12 allProjects">
        <p class="titleScore">Новый заказ</p>
      </div>

      <form action="{% url 'projects:customer-project-create' %}" method="POST" enctype="multipart/form-data" novalidate
            class="-spec-work-type-combo-container">
        {% csrf_token %}

        <input type="hidden" id="extraFields" name="extra_fields" value="">

        <div class="chatBlock new-rass new-rass2 disTab">
          <div class="col-lg-9">
            <p class="new-pp new-pp3">Формирование заказа</p>

            {% if form.non_field_errors %}
              <div class="new-pp3" style="color: red; margin-top: 70px">{{ form.non_field_errors }}</div>
            {% endif %}

            <div class="textAreaBlock2 text-nn box-sizing disTab">
              <p class="titleResF1">Название заказа <span data-tooltip data-placement="{% tooltip_placement pk=4 %}"
                                                          title="{% tooltip pk=4 %}"
                                                          class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
                <span id="{% random_ident %}" class="-validation-error"
                      style="color: red">{{ form.name.errors.as_text }}</span></p>
              <input type="text" class="box-sizing" name="{{ form.name.html_name }}" value="{{ form.name.value }}">
            </div>

            <div class="textAreaBlock2 text-nn box-sizing disTab">
              <p class="titleResF1">Подробно опишите задание <span data-tooltip
                                                                   data-placement="{% tooltip_placement pk=5 %}"
                                                                   title="{% tooltip pk=5 %}"
                                                                   class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
                <span id="{% random_ident %}" class="-validation-error"
                      style="color: red">{{ form.text.errors.as_text }}</span></p>
              <textarea name="{{ form.text.html_name }}" id="text-new"
                        style="margin-top:0;">{{ form.text.value }}</textarea>
            </div>
          </div>
          <div class="col-lg-3 wrChat1">
            <div class="messageBlock box-sizing disTab">
              <p>Дополнительно</p>
            </div>
            <div id="fileUploadContainer" class="col-lg-12 documentsChat">
              <div class="upload">
                <p id="fileUploadAddBtn" style="margin: 0">+ добавить файл (до 100 файлов)</p>
              </div>

              <ul class="list-new-new">
                <li class="file-upload-widget" style="display: none">
                  <input type="file" name="new_files" class="file-upload-input"
                         style="position: absolute; top: -1000px; left: -1000px">
                  <p class="file-upload-label"></p>
                  <div class="file-upload-remove-btn"></div>
                </li>
              </ul>
            </div>

            <p class="type-work">{% trans 'project_stage0' %} <span data-tooltip
                                                                    data-placement="{% tooltip_placement pk=6 %}"
                                                                    title="{% tooltip pk=6 %}"
                                                                    class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
              <span id="{% random_ident %}" class="-validation-error"
                    style="color: red">{{ form.work_type.errors.as_text }}</span></p>
            <div class="mail-block type-work-inset -project-work-type-radios-container">
              {% for id, text in form.work_type.field.choices %}
                <div class="inset-mb">
                  <label>
                    <input
                        type="radio"
                        value="{{ id }}"
                        {% if form.work_type.value|int == id %}checked{% endif %}
                        name="{{ form.work_type.html_name }}">

{#                    <span></span>#}
                  </label>

                  <p>{{ text }}</p>
                </div>
              {% endfor %}
            </div>
            <div class="textAreaBlock2 box-sizing disTab">
              <a href="#" onclick="return false" data-toggle="modal" data-target="#projectWorkTypeSuggestionModal"
                 class="new-link new-lw">+ Добавить раздел</a>
            </div>
          </div>
        </div>
        <div class="col-lg-12 new-filter">
          <div class="filter clearfix">
            <div class="polsF1 disTab">
              <div class="col-lg-3 -single-spec-select">
                <div class="-bold">{% trans 'project_stage1' %} <span data-tooltip
                                                                      data-placement="{% tooltip_placement pk=7 %}"
                                                                      data-placement="{% tooltip_placement pk=7 %}"
                                                                      title="{% tooltip pk=7 %}"
                                                                      class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
                  <span id="{% random_ident %}" class="-validation-error"
                        style="color: red">{{ form.specialization.errors.as_text }}</span></div>
                <input type="hidden" class="-spec-select -spec-select-level-1" style="width: 100%">
              </div>

              <div class="col-lg-3 -single-spec-select">
                <div class="-bold"><span class="-dynamic-label">{% trans 'project_stage2' %}</span></div>
                <input type="hidden" class="-spec-select -spec-select-level-2" style="width: 100%">
              </div>

              <div class="col-lg-3 -single-spec-select">
                <div class="-bold">{% trans 'project_stage3' %}</div>
                <input type="hidden" class="-spec-select -spec-select-level-3" style="width: 100%">
              </div>

              <div class="col-lg-3 -single-spec-select">
                <div class="-bold">{% trans 'project_stage4' %}</div>
                <input type="hidden" class="-spec-select -spec-select-level-4" style="width: 100%">
              </div>

              <input type="hidden" name="{{ form.specialization.html_name }}" value="{{ form.specialization.value }}"
                     class="-chosen-spec-id">
            </div>
            <div class="titleF1 titleF2 disTab">
              <div class="col-lg-12">Бюджет <span data-tooltip data-placement="{% tooltip_placement pk=8 %}"
                                                  title="{% tooltip pk=8 %}"
                                                  class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
                <span id="{% random_ident %}" class="-validation-error"
                      style="color: red">{{ form.budget.errors.as_text }}</span></div>
              <!--<div class="col-lg-8"></div>-->
            </div>
            <div class="searchF1 polsF1 polsFF">
              <div class="col-lg-4">
                <input type="text" class="box-sizing surr" name="{{ form.budget.html_name }}"
                       value="{{ form.budget.value }}">
                {{ form.currency }}
              </div>
              <div class="col-lg-3">
                {{ form.term_type }}
              </div>
              <div class="col-lg-5 dog-new">
                <label>
                  <input
                      type="checkbox"
                      {% if form.budget_by_agreement.value %}checked{% endif %}
                      name="{{ form.budget_by_agreement.html_name }}">

                  <span></span>
                </label>

                <p>или по договоренности <span data-tooltip data-placement="{% tooltip_placement pk=9 %}"
                                               title="{% tooltip pk=9 %}"
                                               class="-green-glyphicon glyphicon glyphicon-question-sign"></span></p>
              </div>
            </div>
            <div class="searchF1 polsF1 polsFF make-new">
              <label>
                <input
                    type="checkbox"
                    {% if form.price_and_term_required.value %}checked{% endif %}
                    name="{{ form.price_and_term_required.html_name }}">

                <span></span>
              </label>

              <p>Сделать для исполнителей обязательным для заполнения поля цена и срок</p>
            </div>
            <div class="titleF1 titleF2 disTab">
              <div class="col-lg-12">Способ оплаты <span id="{% random_ident %}" class="-validation-error"
                                                         style="color: red">{{ form.deal_type.errors.as_text }}</span>
              </div>
            </div>
            <div class="searchF1 polsF1 polsFF radio-afer">
              <div class="col-lg-6">
                <label>
                  <input
                      type="radio"
                      name="{{ form.deal_type.html_name }}"
                      {% if form.deal_type.value == 'secure_deal' %}checked{% endif %}
                      value="secure_deal">

{#                  <span></span>#}
                </label>

                <p class="text-afer">
                  Безопасная сделка (с резервированием бюджета)
                </p>

                <p class="des-afer">
                  {% tooltip pk=10 as tooltip10 %}{{ tooltip10|linebreaksbr }}
                </p>
              </div>

              <div class="col-lg-6">
                <label>
                  <input
                      type="radio"
                      name="{{ form.deal_type.html_name }}"
                      {% if form.deal_type.value == 'direct_payment' %}checked{% endif %}
                      value="direct_payment">

{#                  <span></span>#}
                </label>

                <p class="text-afer">
                  Прямая оплата Исполнителю на его кошелек/счет
                </p>

                <p class="des-afer">
                  {% tooltip pk=11 as tooltip11 %}{{ tooltip11|linebreaksbr }}
                </p>
              </div>
            </div>


            <div class="resSearchF1">
              <div class="col-lg-3">
                <p class="titleResF1">Расширенный поиск</p>
                <button data-tooltip data-placement="{% tooltip_placement pk=12 %}" title="{% tooltip pk=12 %}"
                        class="resButtonF1">
                  <span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
                </button>
              </div>
              <div class="col-lg-9">
                <div class="borderS1"></div>
              </div>
            </div>

            <div class="slideRes disTab activeSlide">
              <div class="titleF1 disTab">
                <div class="col-lg-3">Выбор объекта <span data-tooltip data-placement="{% tooltip_placement pk=13 %}"
                                                          title="{% tooltip pk=13 %}"
                                                          class="-green-glyphicon glyphicon glyphicon-question-sign"></span><br><span
                    id="{% random_ident %}" class="-validation-error"
                    style="color: red">{{ form.realty.errors.as_text }}</span></div>
                <div class="col-lg-3">Наименование <span data-tooltip data-placement="{% tooltip_placement pk=14 %}"
                                                         title="{% tooltip pk=14 %}"
                                                         class="-green-glyphicon glyphicon glyphicon-question-sign"></span><br><span
                    id="{% random_ident %}" class="-validation-error"
                    style="color: red">{{ realty_form.name.errors.as_text }}</span></div>
                <div class="col-lg-3">Классификация здания <span data-tooltip
                                                                 data-placement="{% tooltip_placement pk=15 %}"
                                                                 title="{% tooltip pk=15 %}"
                                                                 class="-green-glyphicon glyphicon glyphicon-question-sign"></span><br><span
                    id="{% random_ident %}" class="-validation-error"
                    style="color: red">{{ realty_form.building_classification.errors.as_text }}</span></div>
                <div class="col-lg-3">Вид строительства <span data-tooltip
                                                              data-placement="{% tooltip_placement pk=16 %}"
                                                              title="{% tooltip pk=16 %}"
                                                              class="-green-glyphicon glyphicon glyphicon-question-sign"></span><br><span
                    id="{% random_ident %}" class="-validation-error"
                    style="color: red">{{ realty_form.construction_type.errors.as_text }}</span></div>
              </div>

              <div class="polsF1 polsF2 disTab">
                <div class="col-lg-3">
                  <select
                      class="selectpicker"
                      id="realtyId"
                      name="{{ form.realty.html_name }}">
                    <option value="" {% if not form.realty.value %}selected="selected"{% endif %}>Создать новый</option>

                    {% for r in form.realty.field.queryset %}
                      <option value="{{ r.pk }}"
                              {% if form.realty.value|int == r.pk %}selected="selected"{% endif %}>{{ r.name }}</option>
                    {% endfor %}
                  </select>
                </div>
                <div class="col-lg-3">
                  <input
                      type="text"
                      id="realtyName"
                      name="{{ realty_form.name.html_name }}"
                      class="box-sizing surr surr2"
                      value="{{ realty_form.name.value }}">
                </div>
                <div class="col-lg-3">
                  {{ realty_form.building_classification }}
                  {#                                    <select#}
                  {#                                        id="realtyBuildingClassificationId"#}
                  {#                                       #}
                  {#                                        name="{{ realty_form.building_classification.html_name }}">#}
                  {#                                            {% for c in realty_form.building_classification.field.queryset %}#}
                  {#                                                <option value="{{ c.pk }}" {% if realty_form.building_classification.value|int == c.pk %}selected="selected"{% endif %}>{{ c.name }}</option>#}
                  {#                                            {% endfor %}#}
                  {#                                    </select>#}
                </div>
                <div class="col-lg-3">
                  <select
                      id="realtyConstructionTypeId"
                      class="selectpicker"
                      name="{{ realty_form.construction_type.html_name }}">
                    {% for t in realty_form.construction_type.field.queryset %}
                      <option value="{{ t.pk }}"
                              {% if realty_form.construction_type.value|int == t.pk %}selected="selected"{% endif %}>{{ t.name }}</option>
                    {% endfor %}
                  </select>
                </div>
              </div>
              <div class="titleF1 disTab">
                <div class="col-lg-12">Местоположение <span data-tooltip data-placement="{% tooltip_placement pk=18 %}"
                                                            title="{% tooltip pk=18 %}"
                                                            class="-green-glyphicon glyphicon glyphicon-question-sign"></span>
                  <span id="{% random_ident %}" class="-validation-error"
                        style="color: red">{{ realty_form.location.errors.as_text }}</span></div>
              </div>
              <div class="polsF1 polsF2 disTab">
                <div>
                  <div class="col-lg-3">
                    <input type="hidden" class="-location-select -location-select-country" style="width: 100%">
                  </div>

                  <div class="col-lg-3">
                    <input type="hidden" class="-location-select -location-select-region" style="width: 100%">
                  </div>

                  <div class="col-lg-3">
                    <input type="hidden" class="-location-select -location-select-city" style="width: 100%">
                  </div>
                </div>

                <input type="hidden" id="chosenLocationId" name="{{ realty_form.location.html_name }}"
                       value="{{ realty_form.location.value }}">

                <div class="col-lg-3 make-new">
                  <label>{{ form.cro }}<span></span></label>
                  <p>Требуется допуск (СРО) <span data-tooltip data-placement="{% tooltip_placement pk=17 %}"
                                                  title="{% tooltip pk=17 %}"
                                                  class="-green-glyphicon glyphicon glyphicon-question-sign"></span></p>
                </div>
              </div>
            </div>


            <div class="searchF1 polsF1 polsFF links-filter">
              <input class="btn-submit-link" type="submit" value="Разместить проект">
            </div>
          </div>
        </div>
      </form>

      {% include 'partials/footer.html' %}
    </div>
  </div>
{% endblock %}


{% block js_block %}
  <script>
    // Project work type suggestion modal ---------------------------------


    ;
    (function () {
      var $modal = $('#projectWorkTypeSuggestionModal')
      var $form = $modal.find('.-project-work-type-suggestion-form').first()
      var workTypeSuggestionUrl = '/projects/suggest-work-type/'

      $modal.find('.-action-button').first().on('click', function ($evt) {
        $.post(workTypeSuggestionUrl, $form.serialize())
            .then(function (res) {
              if (res.status === 'success') {
                $form.trigger('reset')
                $('.-error').text('')
                $modal.modal('hide')
                $.jGrowl('Предложение успешно отправлено')
              } else if (res.status === 'error') {
                _.flow(
                    _.toPairs,

                    _.each(function (pair) {
                      var cssSelector = pair[0]
                      var errors = pair[1]

                      $(cssSelector).first().text(_.join(' ', errors))
                    })
                )(res.form_errors)
              }
            })
      })
    }())



    // Scroll to first form validation error ---------------------------


    ;
    (function () {
      var hash = $('.-validation-error').filter(function (i, el) {
        return $(el).text()
      }).first().attr('id')

      if (hash)
        window.location.hash = hash
    }())
  </script>
{% endblock %}