{% extends '_base.html' %}
{% load form_helpers %}

{% block content %}
<h1>Add {{ component_name|title }}</h1>
<form action="." method="post" class="form form-horizontal">
    {% csrf_token %}
    {% if request.POST.return_url %}
        <input type="hidden" name="return_url" value="{{ request.POST.return_url }}" />
    {% endif %}
    {% for field in form.hidden_fields %}
        {{ field }}
    {% endfor %}
    <div class="row">
        <div class="col-md-7">
            <div class="panel panel-default">
                <div class="panel-heading"><strong>Selected Devices</strong></div>
                <table class="panel-body table table-hover">
                    <tr>
                        <th>Device</th>
                        <th>Type</th>
                        <th>Role</th>
                    </tr>
                    {% for device in selected_devices %}
                        <tr>
                            <td><a href="{% url 'dcim:device' pk=device.pk %}">{{ device }}</a></td>
                            <td>{{ device.device_type.full_name }}</td>
                            <td>{{ device.device_role }}</td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
        </div>
        <div class="col-md-5">
            {% if form.non_field_errors %}
                <div class="panel panel-danger">
                    <div class="panel-heading"><strong>Errors</strong></div>
                    <div class="panel-body">
                        {{ form.non_field_errors }}
                    </div>
                </div>
            {% endif %}
            <div class="panel panel-default">
                <div class="panel-heading"><strong>{{ component_name|title }} to Add</strong></div>
                <div class="panel-body">
                    {% for field in form.visible_fields %}
                        {% render_field field %}
                    {% endfor %}
                </div>
            </div>
		    <div class="form-group text-right">
                <div class="col-md-12">
                    <button type="submit" name="_create" class="btn btn-primary">Create</button>
                    <a href="{{ return_url }}" class="btn btn-default">Cancel</a>
                </div>
		    </div>
        </div>
    </div>
</form>
{% endblock %}
