{% extends 'VGMWOBundle::layout.html.twig' %}
{% block jumbotron_content %}
    <div class="jumbotron" style="padding-top: 10px; padding-bottom: 5px;"  id="jumbotron">
        <div class="container-fluid">
            <div class="col-md-12 text-center" style="padding-left: 0px;">
                <H3 style="margin: 0px;"><strong>Create departments</strong></H3>
            </div>
        </div>
    </div>
{% endblock %}
{% block content %}
    <div class="container" style="min-height: 500px;">
        <div class="col-md-12 text-right">
            <div class="col-ms-2 pull-right">
                <a href="{{ path('vgm_departments') }}">
                    <span class="glyphicon glyphicon-list"></span>
                    Main list
                </a>
            </div>
        </div>
        {{ form_start(form) }}
            {{ form_errors(form) }}
            <div class="container-fluid">
                <div class="col-lg-12">
                    <label class="form-label">Department name:</label>
                    {{ form_widget(form.name, { 'attr': {
                    'tabindex' : 1,
                    'class': 'form-control for-desktop',
                    'placeholder': 'Department Name'} }) }}
                </div>
                <div class="col-lg-12">
                    <label class="form-label" style="margin-top: 10px;">Department description:</label>
                    {{ form_widget(form.description, { 'attr': {
                    'tabindex' : 3,
                    'class': 'form-control for-desktop',
                    'placeholder': 'Department Description'} }) }}
                </div>
                <div class="col-lg-12">
                    <div  style="margin-top: 10px;">
                        <strong style="text-decoration: underline">Units</strong>
                    </div>
                    {% for unit in form.units %}
                        <div>
                            {{ form_widget(unit, { 'attr': {
                            'tabindex' : loop.index + 1 } }) }}
                            {{ form_label(unit) }}
                        </div>
                    {% endfor %}
                </div>
                <div class="col-lg-12">
                    <div  style="margin-top: 10px;">
                        <strong style="text-decoration: underline">Supervisors</strong>
                    </div>
                    {% for sup in form.supervisors %}
                        <div>
                            {{ form_widget(sup, { 'attr': {
                            'tabindex' : loop.index + 1 } }) }}
                            {{ form_label(sup) }}
                        </div>
                    {% endfor %}
                </div>
                <div class="col-lg-12 container-fluid text-right" style="margin-top: 10px;">
                    <button class="btn btn-primary"
                            type="submit">
                        Create
                    </button>
                    <a class="btn btn-warning"
                       href="{{ path('vgm_departments') }}">
                        Cancel
                    </a>
                </div>
            </div>

        {{ form_rest(form) }}
        {{ form_end(form) }}
    </div>
{% endblock %}
