mirror of
https://github.com/lucheng0127/virtuallan.git
synced 2025-09-26 20:51:11 +08:00
Add endpoint monitor index page
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
port: 6123
|
port: 6123
|
||||||
ip: 192.168.123.254/24
|
ip: 192.168.123.254/24
|
||||||
bridge: br0
|
bridge: br0
|
||||||
log-level: debug
|
log-level: info
|
||||||
web:
|
web:
|
||||||
enable: true
|
enable: true
|
||||||
port: 8000
|
port: 8000
|
@@ -45,8 +45,12 @@ func (svc *webServe) Serve() {
|
|||||||
gin.DefaultWriter = io.Discard
|
gin.DefaultWriter = io.Discard
|
||||||
|
|
||||||
router := gin.Default()
|
router := gin.Default()
|
||||||
|
router.LoadHTMLFiles("./static/index.html")
|
||||||
|
|
||||||
router.GET("/endpoints", listEpEntries)
|
router.GET("/endpoints", listEpEntries)
|
||||||
|
router.GET("/", func(c *gin.Context) {
|
||||||
|
c.HTML(http.StatusOK, "index.html", nil)
|
||||||
|
})
|
||||||
|
|
||||||
router.Run(fmt.Sprintf(":%d", svc.port))
|
router.Run(fmt.Sprintf(":%d", svc.port))
|
||||||
}
|
}
|
||||||
|
80
static/index.html
Normal file
80
static/index.html
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<style>
|
||||||
|
table, th, td {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
td, th {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body onload="convert();">
|
||||||
|
<h3> VirtualLan Endpoints: </h3>
|
||||||
|
<div id="container"></div>
|
||||||
|
<script>
|
||||||
|
|
||||||
|
setInterval(convert, 5000)
|
||||||
|
|
||||||
|
// Function to convert JSON data to HTML table
|
||||||
|
function convert() {
|
||||||
|
|
||||||
|
// Sample JSON data
|
||||||
|
let jsonData = []
|
||||||
|
fetch("/endpoints")
|
||||||
|
.then(res => res.json())
|
||||||
|
.then(out =>
|
||||||
|
{
|
||||||
|
jsonData = out
|
||||||
|
|
||||||
|
// Get the container element where the table will be inserted
|
||||||
|
let container = document.getElementById("container");
|
||||||
|
|
||||||
|
// Create the table element
|
||||||
|
if (document.contains(document.getElementById("table"))) {
|
||||||
|
document.getElementById("table").remove();
|
||||||
|
}
|
||||||
|
let table = document.createElement("table");
|
||||||
|
table.setAttribute("id", "table")
|
||||||
|
|
||||||
|
// Get the keys (column names) of the first object in the JSON data
|
||||||
|
if (jsonData) {
|
||||||
|
let cols = Object.keys(jsonData[0]);
|
||||||
|
|
||||||
|
// Create the header element
|
||||||
|
let thead = document.createElement("thead");
|
||||||
|
let tr = document.createElement("tr");
|
||||||
|
|
||||||
|
// Loop through the column names and create header cells
|
||||||
|
cols.forEach((item) => {
|
||||||
|
let th = document.createElement("th");
|
||||||
|
th.innerText = item; // Set the column name as the text of the header cell
|
||||||
|
tr.appendChild(th); // Append the header cell to the header row
|
||||||
|
});
|
||||||
|
thead.appendChild(tr); // Append the header row to the header
|
||||||
|
table.append(tr) // Append the header to the table
|
||||||
|
|
||||||
|
// Loop through the JSON data and create table rows
|
||||||
|
jsonData.forEach((item) => {
|
||||||
|
let tr = document.createElement("tr");
|
||||||
|
|
||||||
|
// Get the values of the current object in the JSON data
|
||||||
|
let vals = Object.values(item);
|
||||||
|
|
||||||
|
// Loop through the values and create table cells
|
||||||
|
vals.forEach((elem) => {
|
||||||
|
let td = document.createElement("td");
|
||||||
|
td.innerText = elem; // Set the value as the text of the table cell
|
||||||
|
tr.appendChild(td); // Append the table cell to the table row
|
||||||
|
});
|
||||||
|
table.appendChild(tr); // Append the table row to the table
|
||||||
|
});
|
||||||
|
container.appendChild(table) // Append the table to the container element
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(err => { throw err });
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
Reference in New Issue
Block a user