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

{% 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-edit' pk=pk %}" method="POST" enctype="multipart/form-data" novalidate>
                {% csrf_token %}
                
                <input type="hidden" name="next" value="{% url 'projects:detail' pk=pk %}">
                <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>Название заказа <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>Подробно опишите задание <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">{{ 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">
                                {% for file in form.files.field.queryset.all %}
                                    <li class="existing-file-widget">
                                        <input type="checkbox" name="{{ form.files.html_name }}" value="{{ file.pk }}" checked style='display: none'>
                                        <p class="file-upload-label">{{ file.file.name|basename }} {{ file.file.size|filesizeformat }}</p>
                                        <div class="existing-file-remove-btn"></div>
                                    </li>
                                {% endfor %}
                                
                                <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">Тип работы <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-selection-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="titleF1 disTab">
                            <div class="col-lg-12">Специализация проекта <span id="{% random_ident %}" class="-validation-error" style="color: red">{{ form.specialization.errors.as_text }}</span></div>
                            <!--<div class="col-lg-3"></div>
                            <div class="col-lg-3"></div>
                            <div class="col-lg-3"></div>-->
                        </div>
                        <div class="polsF1 disTab -spec-select-container">
                            <div class="col-lg-3">
                                <input type="hidden" class="-spec-select -spec-select-level-1" style="width: 100%">
                            </div>
                            
                            <div class="col-lg-3">
                                <input type="hidden" class="-spec-select -spec-select-level-2" style="width: 100%">
                            </div>
                            
                            <div class="col-lg-3">
                                <input type="hidden" class="-spec-select -spec-select-level-3" style="width: 100%">
                            </div>
                            
                            <div class="col-lg-3">
                                <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 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>или по договоренности</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 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">Выбор объекта<br><span id="{% random_ident %}" class="-validation-error" style="color: red">{{ form.realty.errors.as_text }}</span></div>
                                <div class="col-lg-3">Наименование<br><span id="{% random_ident %}" class="-validation-error" style="color: red">{{ realty_form.name.errors.as_text }}</span></div>
                                <div class="col-lg-3">Классификация здания<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">Вид строительства<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">
                                    <select
                                        id="realtyBuildingClassificationId"
                                        class="selectpicker"
                                        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 id="{% random_ident %}" class="-validation-error" style="color: red">{{ realty_form.location.errors.as_text }}</span></div>
                            </div>
                            <div class="polsF1 polsF2 disTab">
                                <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>
                                
                                <input type="hidden" id="chosenLocationId" name="{{ realty_form.location.html_name }}" value="{{ realty_form.location.value }}">
                                
                                <div class="col-lg-3 make-new">
                                    <label>
                                        <input
                                            type="checkbox"
                                            {% if form.cro.value %}checked{% endif %}
                                            name="{{ form.cro.html_name }}">
                                        
                                        <span></span>
                                    </label>
                                    
                                    <p>Требуется допуск СРО</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') {
                            console.log('Success')
                            $form.trigger('reset')
                            $('.-error').text('')
                            $modal.modal('hide')
                            $.jGrowl('Предложение успешно отправлено')
                        } else if (res.status === 'error') {
                            console.log('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
        }())
        
        
        
        // Load specialization choices by work type ---------------------------
        
        
        ;(function() {
            var $radiosContainer = $('.-project-work-type-selection-container').first()
            var $radios = $radiosContainer.find('input[type=radio][name={{ form.work_type.html_name }}]')
            var $specSelectContainer = $('.-spec-select-container').first()
            var $specSelects = $specSelectContainer.find('.-spec-select')
            
            $radios.on('change', function($evt) {
                var $that = $(this)
                var workTypeId = $that.val()
                reinitSpecializationsByWorkType($specSelects, workTypeId)
            })
        }())
    </script>
{% endblock %}