Cleaned up IP addresses list under device/VM interfaces

This commit is contained in:
Jeremy Stretch 2018-07-03 17:05:04 -04:00
parent 49ecf5aa8a
commit 9eb9715e05
3 changed files with 80 additions and 50 deletions

View File

@ -366,6 +366,10 @@ table.component-list td.subtable td {
padding-bottom: 6px;
padding-top: 6px;
}
table.interface-ips th {
font-size: 80%;
font-weight: normal;
}
/* Reports */
table.reports td.method {

View File

@ -762,9 +762,9 @@ $(".interface-toggle").click(function() {
$('button.toggle-ips').click(function() {
var selected = $(this).attr('selected');
if (selected) {
$('#interfaces_table tr.ipaddress').hide();
$('#interfaces_table tr.ipaddresses').hide();
} else {
$('#interfaces_table tr.ipaddress').show();
$('#interfaces_table tr.ipaddresses').show();
}
$(this).attr('selected', !selected);
$(this).children('span').toggleClass('glyphicon-check glyphicon-unchecked');

View File

@ -131,56 +131,82 @@
{% endif %}
</td>
</tr>
{% for ip in iface.ip_addresses.all %}
<tr class="ipaddress">
{# Placeholder #}
{% if perms.dcim.change_interface or perms.dcim.delete_interface %}
<td></td>
{% endif %}
{# IP address #}
<td colspan="2">
<a href="{% url 'ipam:ipaddress' pk=ip.pk %}">{{ ip }}</a>
</td>
{# Primary, status, role #}
<td>
{% if device.primary_ip4 == ip or device.primary_ip6 == ip %}
<span class="label label-success">Primary</span>
{% with ipaddresses=iface.ip_addresses.all %}
{% if ipaddresses %}
<tr class="ipaddresses">
{# Placeholder #}
{% if perms.dcim.change_interface or perms.dcim.delete_interface %}
<td></td>
{% endif %}
<span class="label label-{{ ip.get_status_class }}">{{ ip.get_status_display }}</span>
{% if ip.role %}
<span class="label label-{{ ip.get_role_class }}">{{ ip.get_role_display }}</span>
{% endif %}
</td>
{# VRF #}
<td colspan="2">
{% if ip.vrf %}
<a href="{% url 'ipam:vrf' pk=ip.vrf.pk %}" title="{{ ip.vrf.rd }}">{{ ip.vrf.name }}</a>
{% else %}
<span class="text-muted">Global</span>
{% endif %}
</td>
{# IP addresses table #}
<td colspan="8" style="padding: 0">
<table class="table table-condensed interface-ips">
<thead>
<tr class="text-muted">
<th class="col-md-3">IP Address</th>
<th class="col-md-2">Status/Role</th>
<th class="col-md-3">VRF</th>
<th class="col-md-3">Description</th>
<th class="col-md-1"></th>
</tr>
</thead>
{% for ip in iface.ip_addresses.all %}
<tr>
{# Description #}
<td colspan="2">
{{ ip.description }}
</td>
{# IP address #}
<td>
<a href="{% url 'ipam:ipaddress' pk=ip.pk %}">{{ ip }}</a>
</td>
{# Buttons #}
<td class="text-right text-nowrap">
{% if perms.ipam.change_ipaddress %}
<a href="{% url 'ipam:ipaddress_edit' pk=ip.pk %}?return_url={{ device.get_absolute_url }}" class="btn btn-info btn-xs">
<i class="glyphicon glyphicon-pencil" aria-hidden="true" title="Edit IP address"></i>
</a>
{% endif %}
{% if perms.ipam.delete_ipaddress %}
<a href="{% url 'ipam:ipaddress_delete' pk=ip.pk %}?return_url={{ device.get_absolute_url }}" class="btn btn-danger btn-xs">
<i class="glyphicon glyphicon-trash" aria-hidden="true" title="Delete IP address"></i>
</a>
{% endif %}
</td>
</tr>
{% endfor %}
{# Primary/status/role #}
<td>
{% if device.primary_ip4 == ip or device.primary_ip6 == ip %}
<span class="label label-success">Primary</span>
{% endif %}
<span class="label label-{{ ip.get_status_class }}">{{ ip.get_status_display }}</span>
{% if ip.role %}
<span class="label label-{{ ip.get_role_class }}">{{ ip.get_role_display }}</span>
{% endif %}
</td>
{# VRF #}
<td>
{% if ip.vrf %}
<a href="{% url 'ipam:vrf' pk=ip.vrf.pk %}" title="{{ ip.vrf.rd }}">{{ ip.vrf.name }}</a>
{% else %}
<span class="text-muted">Global</span>
{% endif %}
</td>
{# Description #}
<td>
{% if ip.description %}
{{ ip.description }}
{% else %}
<span class="text-muted">&mdash;</span>
{% endif %}
</td>
{# Buttons #}
<td class="text-right text-nowrap">
{% if perms.ipam.change_ipaddress %}
<a href="{% url 'ipam:ipaddress_edit' pk=ip.pk %}?return_url={{ device.get_absolute_url }}" class="btn btn-info btn-xs">
<i class="glyphicon glyphicon-pencil" aria-hidden="true" title="Edit IP address"></i>
</a>
{% endif %}
{% if perms.ipam.delete_ipaddress %}
<a href="{% url 'ipam:ipaddress_delete' pk=ip.pk %}?return_url={{ device.get_absolute_url }}" class="btn btn-danger btn-xs">
<i class="glyphicon glyphicon-trash" aria-hidden="true" title="Delete IP address"></i>
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
</td>
</tr>
{% endif %}
{% endwith %}