{% extends "_base.html" %}
{% load static %}
{% load filters %}

{% block styles %}
{{ block.super }}
{% include "includes/datepicker.css.html" %}
{% endblock styles %}

{% block ui_active_tab %}'visits'{% endblock ui_active_tab %}
{% block page_header %}New visit{% endblock page_header %}
{% block page_description %}{% endblock page_description %}

{% block title %}{{ block.super }} - Add new visit{% endblock %}

{% block breadcrumb %}
{% include "visits/breadcrumb.html" %}
{% endblock breadcrumb %}

{% block maincontent %}

{% block content %}
<div class="box box-info">
    <div class="box-header with-border">
        <a href="{% url 'web.views.visits' %}" class="btn btn-block btn-default">Cancel</a>
    </div>

    <form method="post" action="" class="form-horizontal">
        {% csrf_token %}

        <div class="box-body">
            <div class="col-sm-6">
                {% for field in form %}
                <div class="form-group {% if field.errors %}has-error{% endif %}  {% if field|is_checkbox %}multi-checkboxes{% endif %}">
                    <label class="col-sm-4 control-label">
                        {{ field.label }}
                    </label>
                    <div class="col-sm-8">
                        {{ field|add_class:'form-control' }}
                    </div>

                    {% if field.errors %}
                    <span class="help-block">
  							{{ field.errors }}
  						</span>
                    {% endif %}
                </div>
                {% endfor %}
            </div>
        </div><!-- /.box-body -->

        <div class="box-footer">
            <div class="col-sm-6">
                <button type="submit" class="btn btn-block btn-success">Add</button>
            </div>
            <div class="col-sm-6">
                <a href="{% url 'web.views.visits' %}" class="btn btn-block btn-default">Cancel</a>
            </div>
        </div><!-- /.box-footer -->
    </form>
</div>

{% endblock %}


{% endblock maincontent %}

{% block scripts %}
{{ block.super }}

<script src="{% static 'js/visit.js' %}"></script>
<script>
    var default_visit_duration_in_months = parseInt("{{default_visit_duration}}");
    visit_dates_behaviour($("[name='datetime_begin']"), $("[name='datetime_end']"), default_visit_duration_in_months);
</script>

{% include "includes/datepicker.js.html" %}
{% endblock scripts %}