PixelHosting/Router-tools
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add static/js/pages/bgp.js

Browse source
This commit is contained in:
Blackwhitebear8 2025-06-21 14:29:39 +02:00
parent 80afa9347c
commit 1daa300bac
1 changed files with 169 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

169
static/js/pages/bgp.js Normal file
View file

@ -0,0 +1,169 @@
function filterTable(searchInputId,tableId){
const input=document.getElementById(searchInputId);
const filter=input.value.toUpperCase();
const table=document.getElementById(tableId);
const tr=table.getElementsByTagName("tr");
for(let i=1;i<tr.length;i++){
tr[i].style.display="none";
const td=tr[i].getElementsByTagName("td");
for(let j=0;j<td.length;j++){
if(td[j]){
const txtValue=td[j].textContent||td[j].innerText;
if(txtValue.toUpperCase().indexOf(filter)>-1){
tr[i].style.display="";
break;
}
}
}
}
}
function sortTable(tableId,columnIndex,th){
const table=document.getElementById(tableId);
const tbody=table.tBodies[0];
const rows=Array.from(tbody.rows);
const headers=Array.from(th.parentNode.children);
headers.forEach(header=>{
if(header!==th){
header.classList.remove('asc','desc');
header.setAttribute('data-sort-state','none');
}
});
let currentState=th.getAttribute('data-sort-state')||'none';
let newState=currentState==='none'?'asc':currentState==='asc'?'desc':'none';
th.classList.remove('asc','desc');
if(newState!=='none')th.classList.add(newState);
th.setAttribute('data-sort-state',newState);
if(newState==='none'){
rows.sort((a,b)=>parseInt(a.getAttribute('data-index'))-parseInt(b.getAttribute('data-index')));
}else{
rows.sort((a,b)=>{
const aText=a.cells[columnIndex].textContent.trim();
const bText=b.cells[columnIndex].textContent.trim();
const aNum=parseFloat(aText.replace(/[^0-9.-]/g,''));
const bNum=parseFloat(bText.replace(/[^0-9.-]/g,''));
const isNumeric=!isNaN(aNum)&&!isNaN(bNum);
return newState==='asc'
?(isNumeric?aNum-bNum:aText.localeCompare(bText))
:(isNumeric?bNum-aNum:bText.localeCompare(aText));
});
}
rows.forEach(row=>tbody.appendChild(row));
}
async function loadBgpTables(){
const ipv4SummaryEl=document.getElementById("ipv4Summary");
const ipv6SummaryEl=document.getElementById("ipv6Summary");
const ipv4Body=document.getElementById("ipv4TableBody");
const ipv6Body=document.getElementById("ipv6TableBody");
try{
const response=await fetch("/bgp/json");
const data=await response.json();
ipv4SummaryEl.innerHTML=`
<p>BGP Router ID:${data.ipv4_info.router_id},Local AS Number:${data.ipv4_info.local_as} VRF ID:${data.ipv4_info.vrf_id}</p>
<p>BGP Table Version:${data.ipv4_info.table_version}</p>
<p>RIB Entries:${data.ipv4_info.rib_entries},using ${data.ipv4_info.rib_memory}</p>
<p>Peers:${data.ipv4_info.peers},using ${data.ipv4_info.peers_memory}</p>
`;
ipv6SummaryEl.innerHTML=`
<p>BGP Router ID:${data.ipv6_info.router_id},Local AS Number:${data.ipv6_info.local_as} VRF ID:${data.ipv6_info.vrf_id}</p>
<p>BGP Table Version:${data.ipv6_info.table_version}</p>
<p>RIB Entries:${data.ipv6_info.rib_entries},using ${data.ipv6_info.rib_memory}</p>
<p>Peers:${data.ipv6_info.peers},using ${data.ipv6_info.peers_memory}</p>
`;
ipv4Body.innerHTML="";
if(data.ipv4_peers.length===0){
ipv4Body.innerHTML=`<tr><td colspan="12" class="text-center">Geen data beschikbaar.</td></tr>`;
}else{
data.ipv4_peers.forEach((peer,index)=>{
const row=document.createElement("tr");
row.setAttribute("data-index",index);
row.innerHTML=`
<td>${peer.neighbor}</td>
<td>${peer.version}</td>
<td>${peer.as_number}</td>
<td>${peer.msg_received}</td>
<td>${peer.msg_sent}</td>
<td>${peer.table_version}</td>
<td>${peer.in_queue}</td>
<td>${peer.out_queue}</td>
<td>${peer.up_down}</td>
<td>${peer.state_pfx_rcd}</td>
<td>${peer.prefix_sent}</td>
<td>${peer.description}</td>
`;
ipv4Body.appendChild(row);
});
}
ipv6Body.innerHTML="";
if(data.ipv6_peers.length===0){
ipv6Body.innerHTML=`<tr><td colspan="12" class="text-center">Geen data beschikbaar.</td></tr>`;
}else{
data.ipv6_peers.forEach((peer,index)=>{
const row=document.createElement("tr");
row.setAttribute("data-index",index);
row.innerHTML=`
<td>${peer.neighbor}</td>
<td>${peer.version}</td>
<td>${peer.as_number}</td>
<td>${peer.msg_received}</td>
<td>${peer.msg_sent}</td>
<td>${peer.table_version}</td>
<td>${peer.in_queue}</td>
<td>${peer.out_queue}</td>
<td>${peer.up_down}</td>
<td>${peer.state_pfx_rcd}</td>
<td>${peer.prefix_sent}</td>
<td>${peer.description}</td>
`;
ipv6Body.appendChild(row);
});
}
}catch(error){
ipv4SummaryEl.textContent="Fout bij ophalen IPv4 data.";
ipv6SummaryEl.textContent="Fout bij ophalen IPv6 data.";
ipv4Body.innerHTML=`<tr><td colspan="12" class="text-center text-danger">Fout bij ophalen van data.</td></tr>`;
ipv6Body.innerHTML=`<tr><td colspan="12" class="text-center text-danger">Fout bij ophalen van data.</td></tr>`;
}
}
window.addEventListener("DOMContentLoaded",()=>{
loadBgpTables();
});
function refreshBGPTable(){
const searchInput=document.getElementById("ipv4Search");
const searchInput2=document.getElementById("ipv6Search");
const refreshIcon=document.getElementById("refreshIcon");
const refreshIcon2=document.getElementById("refreshIcon2");
const refreshSpinner=document.getElementById("refreshSpinner");
const refreshSpinner2=document.getElementById("refreshSpinner2");
searchInput.value="";
searchInput2.value="";
refreshIcon.classList.add("d-none");
refreshIcon2.classList.add("d-none");
refreshSpinner.classList.remove("d-none");
refreshSpinner2.classList.remove("d-none");
loadBgpTables().then(()=>{
refreshIcon.classList.remove("d-none");
refreshIcon2.classList.remove("d-none");
refreshSpinner.classList.add("d-none");
refreshSpinner2.classList.add("d-none");
});
}