Added device types/icons and stats page

This commit is contained in:
2025-06-03 09:05:25 +00:00
parent a04612005f
commit 0e5cc1316d
7 changed files with 129 additions and 9 deletions
+6
View File
@@ -18,6 +18,12 @@
</div>
<form action="/add_device" method="POST" class="flex flex-col space-y-4">
<input type="text" name="device_name" placeholder="Device Name" class="border p-3 rounded-lg bg-gray-800 text-gray-100 border-gray-600" required>
<label for="device_type" class="block mb-2">Device Type</label>
<select id="device_type" name="device_type" class="border p-2 rounded w-full mb-4 bg-gray-800 text-gray-100 border-gray-600" required>
{% for dtype in device_types %}
<option value="{{ dtype[0] }}">{{ dtype[1] }}</option>
{% endfor %}
</select>
<button type="submit" class="bg-gradient-to-r from-gray-500 to-gray-600 hover:from-gray-600 hover:to-gray-500 text-white px-4 py-2 rounded-lg">Add Device</button>
</form>
</div>
+8
View File
@@ -15,6 +15,14 @@
<div class="flex items-center mb-8 relative justify-between gap-4">
<a href="javascript:window.history.back()" class="bg-gradient-to-r from-gray-500 to-gray-600 hover:from-gray-600 hover:to-gray-500 text-white flex items-center justify-center rounded-full w-11 h-11 shrink-0"><i class="fas fa-arrow-left"></i></a>
<h1 class="text-3xl font-bold text-center flex-1 min-w-0 truncate">{{ device.name }}</h1>
<form action="/update_device_type" method="POST" class="hidden md:inline ml-2">
<input type="hidden" name="device_id" value="{{ device.id }}">
<select name="device_type_id" class="border p-2 rounded bg-gray-800 text-gray-100 border-gray-600" onchange="this.form.submit()">
{% for dtype in device_types %}
<option value="{{ dtype[0] }}" {% if device.device_type_id == dtype[0] %}selected{% endif %}>{{ dtype[1] }}</option>
{% endfor %}
</select>
</form>
<div class="flex items-center shrink-0">
<form action="/rename_device" method="POST" class="inline">
<input type="hidden" name="device_id" value="{{ device.id }}">
+37
View File
@@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Device Type Statistics</title>
<link rel="icon" type="image/png" href="/static/logo.png">
<link href="/static/css/output.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet">
</head>
<body class="bg-gray-900 text-gray-100 min-h-screen flex flex-col">
{% include 'header.html' %}
<div class="flex-1 flex items-center justify-center mx-4">
<div class="container py-8 max-w-2xl pt-20">
<h1 class="text-3xl font-bold mb-8 text-center">Device Type Statistics</h1>
<div class="bg-gray-800 rounded-lg shadow-md p-6">
<table class="w-full table-auto">
<thead>
<tr class="bg-gray-700">
<th class="px-4 py-2 text-left">Type</th>
<th class="px-4 py-2 text-center">Count</th>
</tr>
</thead>
<tbody>
{% for name, icon_class, count in stats %}
<tr class="border-b border-gray-700">
<td class="px-4 py-3 flex items-center gap-2"><i class="fas {{ icon_class }} text-blue-300"></i> {{ name }}</td>
<td class="px-4 py-3 text-center font-bold">{{ count }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
+1 -1
View File
@@ -31,7 +31,7 @@
{% for device in devices %}
<li class="my-2">
<a href="/device/{{ device.id }}" class="flex items-center justify-between bg-gray-900 hover:bg-gray-700 text-gray-200 hover:text-white font-semibold rounded-lg px-4 py-2 shadow transition-colors duration-150">
<span><i class="fas fa-server mr-2"></i>{{ device.name }}</span>
<span><i class="fas {{ device.icon_class or 'fa-server' }} mr-2"></i>{{ device.name }}</span>
{% set ips = device_ips.get(device.id, []) %}
<span class="flex flex-row flex-wrap justify-end items-center ml-4 text-xs text-blue-300 font-normal align-middle">
{% if ips|length > 0 %}
+2
View File
@@ -11,6 +11,7 @@
<a href="/devices" class="text-gray-200 hover:text-blue-400 font-medium">Devices</a>
<a href="/admin" class="text-gray-200 hover:text-blue-400 font-medium">Admin</a>
<a href="/audit" class="text-gray-200 hover:text-blue-400 font-medium">Audit Log</a>
<a href="/device_type_stats" class="text-gray-200 hover:text-blue-400 font-medium">Stats</a>
{% if current_user_name %}
<a href="/logout" class="text-gray-200 hover:text-blue-400 font-medium">Logout</a>
{% endif %}
@@ -25,6 +26,7 @@
<a href="/devices" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Devices</a>
<a href="/admin" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Admin</a>
<a href="/audit" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Audit Log</a>
<a href="/device_type_stats" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Stats</a>
{% if current_user_name %}
<a href="/logout" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Logout</a>
{% endif %}