<div class="row">
    <div class="col-sm-8 col-md-9">
        <ol class="breadcrumb">
            <li><a href="{% url 'ipam:prefix_list' %}">Prefixes</a></li>
            {% if prefix.vrf %}
                <li><a href="{% url 'ipam:vrf' pk=prefix.vrf.pk %}">{{ prefix.vrf }}</a></li>
            {% endif %}
            <li>{{ prefix }}</li>
        </ol>
    </div>
    <div class="col-sm-4 col-md-3">
        <form action="{% url 'ipam:prefix_list' %}" method="get">
            <div class="input-group">
                <input type="text" name="q" class="form-control" placeholder="Search prefixes" />
                <span class="input-group-btn">
                    <button type="submit" class="btn btn-primary">
                        <span class="fa fa-search" aria-hidden="true"></span>
                    </button>
                </span>
            </div>
        </form>
    </div>
</div>
<div class="pull-right">
    {% if perms.ipam.add_prefix and active_tab == 'prefixes' and first_available_prefix %}
        <a href="{% url 'ipam:prefix_add' %}?prefix={{ first_available_prefix }}&vrf={{ prefix.vrf.pk }}&site={{ prefix.site.pk }}&tenant_group={{ prefix.tenant.group.pk }}&tenant={{ prefix.tenant.pk }}" class="btn btn-success">
            <i class="fa fa-plus" aria-hidden="true"></i> Add Child Prefix
        </a>
    {% endif %}
    {% if perms.ipam.add_ipaddress and active_tab == 'ip-addresses' and first_available_ip %}
		<a href="{% url 'ipam:ipaddress_add' %}?address={{ first_available_ip }}&vrf={{ prefix.vrf.pk }}&tenant_group={{ prefix.tenant.group.pk }}&tenant={{ prefix.tenant.pk }}" class="btn btn-success">
			<span class="fa fa-plus" aria-hidden="true"></span>
			Add an IP Address
		</a>
    {% endif %}
    {% if perms.ipam.change_prefix %}
		<a href="{% url 'ipam:prefix_edit' pk=prefix.pk %}" class="btn btn-warning">
			<span class="fa fa-pencil" aria-hidden="true"></span>
			Edit this prefix
		</a>
    {% endif %}
    {% if perms.ipam.delete_prefix %}
		<a href="{% url 'ipam:prefix_delete' pk=prefix.pk %}" class="btn btn-danger">
			<span class="fa fa-trash" aria-hidden="true"></span>
			Delete this prefix
		</a>
    {% endif %}
</div>
<h1>{{ prefix }}</h1>
{% include 'inc/created_updated.html' with obj=prefix %}
<ul class="nav nav-tabs" style="margin-bottom: 20px">
    <li role="presentation"{% if active_tab == 'prefix' %} class="active"{% endif %}><a href="{% url 'ipam:prefix' pk=prefix.pk %}">Prefix</a></li>
    <li role="presentation"{% if active_tab == 'prefixes' %} class="active"{% endif %}><a href="{% url 'ipam:prefix_prefixes' pk=prefix.pk %}">Child Prefixes <span class="badge">{{ prefix.get_child_prefixes.count }}</span></a></li>
    <li role="presentation"{% if active_tab == 'ip-addresses' %} class="active"{% endif %}><a href="{% url 'ipam:prefix_ipaddresses' pk=prefix.pk %}">IP Addresses <span class="badge">{{ prefix.get_child_ips.count }}</span></a></li>
</ul>
