mirror/netbox-community-netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00
Code Activity

migrate napalm/lldp to typescript

Browse Source
This commit is contained in:
checktheroads
2021-04-20 01:18:24 -07:00
parent f83fb57d38
commit f3eb0df081
17 changed files with 340 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
netbox/templates/base.html
View File

@@ -15,19 +15,19 @@
name="viewport"
content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"
/>
</head>
<body>
{% block layout %}{% endblock %}
<script
type="text/javascript"
src="{% static 'netbox.js' %}"
onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'">
</script>
<script type="text/javascript">
var netbox_api_path = "/{{ settings.BASE_PATH }}api/";
var netbox_csrf_token = "{{ csrf_token }}";
</script>
{% block head %}{% endblock %}
</head>
<body>
{% block layout %}{% endblock %}
{% block javascript %}{% endblock %}
{% include './messages.html' %}
<div id="netbox-data" style="display: none!important; visibility: hidden!important">
{% block data %}{% endblock %}
</div>
</body>
</html>

71
netbox/templates/dcim/device/lldp_neighbors.html
View File

@@ -1,11 +1,23 @@
{% extends 'dcim/device/base.html' %}
{% load static %}
{% block title %}{{ object }} - LLDP Neighbors{% endblock %}
{% block head %}
<script type="text/javascript" src="{% static 'lldp.js' %}" onerror="window.location='{% url 'media_failure' %}?filename=lldp.js'"></script>
{% endblock %}
{% block content %}
{% include 'inc/ajax_loader.html' %}
<div class="card">
<h5 class="card-header">LLDP Neighbors</h5>
<div class="card-overlay">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div class="card-header">
<h5 class="d-inline">LLDP Neighbors</h5>
{% comment %} <div id="spinner-container" class="float-end"></div> {% endcomment %}
</div>
<div class="card-body">
<table class="table table-hover">
<thead>
@@ -20,7 +32,7 @@
<tbody>
{% for iface in interfaces %}
<tr id="{{ iface.name }}">
<td>{{ iface }}</td>
<td class="font-monospace">{{ iface }}</td>
{% if iface.connected_endpoint.device %}
<td class="configured_device" data="{{ iface.connected_endpoint.device }}" data-chassis="{{ iface.connected_endpoint.device.virtual_chassis.name }}">
<a href="{% url 'dcim:device' pk=iface.connected_endpoint.device.pk %}">{{ iface.connected_endpoint.device }}</a>
@@ -36,7 +48,7 @@
</td>
{% endwith %}
{% else %}
<td colspan="2">None</td>
<td class="text-muted" colspan="2">None</td>
{% endif %}
<td class="device"></td>
<td class="interface"></td>
@@ -48,53 +60,6 @@
</div>
{% endblock %}
{% block javascript %}
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: "{% url 'dcim-api:device-napalm' pk=object.pk %}?method=get_lldp_neighbors_detail",
dataType: 'json',
success: function(json) {
$.each(json['get_lldp_neighbors_detail'], function(iface, neighbors) {
var neighbor = neighbors[0];
var row = $('#' + iface.split(".")[0].replace(/([\/:])/g, "\\$1"));
// Glean configured hostnames/interfaces from the DOM
var configured_device = row.children('td.configured_device').attr('data');
var configured_chassis = row.children('td.configured_device').attr('data-chassis');
var configured_interface = row.children('td.configured_interface').attr('data');
var configured_interface_short = null;
if (configured_interface) {
// Match long-form IOS names against short ones (e.g. Gi0/1 == GigabitEthernet0/1).
configured_interface_short = configured_interface.replace(/^([A-Z][a-z])[^0-9]*([0-9\/]+)$/, "$1$2");
}
// Clean up hostnames/interfaces learned via LLDP
var neighbor_host = neighbor['remote_system_name'] || ""; // sanitize hostname if it's null to avoid breaking the split func
var neighbor_port = neighbor['remote_port'] || ""; // sanitize port if it's null to avoid breaking the split func
var lldp_device = neighbor_host.split(".")[0]; // Strip off any trailing domain name
var lldp_interface = neighbor_port.split(".")[0]; // Strip off any trailing subinterface ID
// Add LLDP neighbors to table
row.children('td.device').html(lldp_device);
row.children('td.interface').html(lldp_interface);
// Apply colors to rows
if (!configured_device && lldp_device) {
row.addClass('info');
} else if ((configured_device == lldp_device || configured_chassis == lldp_device) && configured_interface == lldp_interface) {
row.addClass('success');
} else if ((configured_device == lldp_device || configured_chassis == lldp_device) && configured_interface_short == lldp_interface) {
row.addClass('success');
} else {
row.addClass('danger');
}
});
},
error: function(xhr) {
alert(xhr.responseText);
}
});
});
</script>
{% block data %}
<span data-object-url="{% url 'dcim-api:device-napalm' pk=object.pk %}?method=get_lldp_neighbors_detail"></span>
{% endblock %}

9
netbox/templates/layout.html
View File

@@ -1,5 +1,8 @@
{% extends 'base.html' %} {% load search_options %} {% block layout %}
{% extends 'base.html' %}
{% load search_options %}
{% block head %}{% endblock %}
{% block layout %}
<div class="container-fluid">
<div class="row">
<nav
@@ -56,4 +59,6 @@
</main>
</div>
</div>
{% endblock %} {%block javascript %} {%endblock%}
{% endblock %}
{% block javascript %}{% endblock %}
{% block data %}{% endblock %}