chore: Finished tidying stuff and added help guide
This commit is contained in:
@@ -889,6 +889,11 @@ def register_routes(app):
|
||||
download_name=filename
|
||||
)
|
||||
|
||||
@app.route('/help')
|
||||
@login_required
|
||||
def help():
|
||||
return render_with_user('help.html')
|
||||
|
||||
def get_current_user_name():
|
||||
user_id = session.get('user_id')
|
||||
if not user_id:
|
||||
@@ -935,3 +940,4 @@ def register_routes(app):
|
||||
app.add_url_rule('/rack/<int:rack_id>/remove_device', 'rack_remove_device', rack_remove_device, methods=['POST'])
|
||||
app.add_url_rule('/rack/<int:rack_id>/delete', 'delete_rack', delete_rack, methods=['POST'])
|
||||
app.add_url_rule('/rack/<int:rack_id>/export_csv', 'export_rack_csv', export_rack_csv)
|
||||
app.add_url_rule('/help', 'help', help)
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
{% include 'header.html' %}
|
||||
<div class="flex-1 flex items-center justify-center mx-4">
|
||||
<div class="container py-8 max-w-md pt-20">
|
||||
<h1 class="text-3xl font-bold mb-6 text-center">Admin Panel</h1>
|
||||
<h1 class="text-3xl font-bold mb-6 text-center">Admin</h1>
|
||||
<div class="flex justify-center gap-4 mb-6">
|
||||
<a href="/audit" class="bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg shadow text-center w-40">Audit Log</a>
|
||||
<a href="/users" class="bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg shadow text-center w-40">Users</a>
|
||||
|
||||
@@ -12,7 +12,10 @@
|
||||
{% 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="flex items-center mb-6 relative">
|
||||
<a href="/devices" class="hidden sm:flex absolute left-0 bg-gradient-to-r from-gray-500 to-gray-600 hover:from-gray-600 hover:to-gray-500 text-white items-center justify-center rounded-full w-11 h-11"><i class="fas fa-arrow-left"></i></a>
|
||||
<h1 class="text-3xl font-bold text-center w-full">Device Stats</h1>
|
||||
</div>
|
||||
<div class="bg-gray-800 rounded-lg shadow-md p-6">
|
||||
<table class="w-full table-auto">
|
||||
<thead>
|
||||
|
||||
@@ -14,7 +14,10 @@
|
||||
<div class="flex-1 flex items-center justify-center mx-4">
|
||||
<div class="container py-8 max-w-4xl pt-20">
|
||||
<h1 class="text-3xl font-bold mb-6 text-center">Device Manager</h1>
|
||||
<a href="/add_device" class="block mb-6 text-center 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 New Device</a>
|
||||
<div class="flex flex-row justify-center gap-4 mb-6">
|
||||
<a href="/add_device" class="text-center 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 New Device</a>
|
||||
<a href="/device_type_stats" class="text-center 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">View Device Stats</a>
|
||||
</div>
|
||||
<div class="mb-6">
|
||||
<input type="text" id="search" placeholder="Search devices or IPs..." class="border p-3 rounded-lg bg-gray-800 text-gray-100 border-gray-600 w-full">
|
||||
</div>
|
||||
|
||||
@@ -9,10 +9,10 @@
|
||||
<nav class="hidden md:flex items-center space-x-6" id="main-nav">
|
||||
<a href="/" class="text-gray-200 hover:text-blue-400 font-medium">Home</a>
|
||||
<a href="/devices" class="text-gray-200 hover:text-blue-400 font-medium">Devices</a>
|
||||
<a href="/racks" class="text-gray-200 hover:text-blue-400 font-medium">Racks</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>
|
||||
<a href="/racks" class="text-gray-200 hover:text-blue-400 font-medium">Racks</a>
|
||||
<a href="/help" class="text-gray-200 hover:text-blue-400 font-medium">Help</a>
|
||||
{% if current_user_name %}
|
||||
<a href="/logout" class="text-gray-200 hover:text-blue-400 font-medium">Logout</a>
|
||||
{% endif %}
|
||||
@@ -25,10 +25,10 @@
|
||||
<div class="md:hidden absolute top-16 right-6 bg-gray-800 rounded-lg shadow-lg z-50 w-48 hidden flex-col py-2" id="mobile-nav">
|
||||
<a href="/" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Home</a>
|
||||
<a href="/devices" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Devices</a>
|
||||
<a href="/racks" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Racks</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>
|
||||
<a href="/racks" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Racks</a>
|
||||
<a href="/help" class="block px-6 py-2 text-gray-200 hover:text-blue-400 font-medium">Help</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 %}
|
||||
|
||||
@@ -0,0 +1,71 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Help & User Guide</title>
|
||||
<link rel="icon" type="image/png" href="/static/logo.png">
|
||||
<link href="/static/css/output.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">Help & User Guide</h1>
|
||||
<div class="space-y-10 text-lg">
|
||||
<section>
|
||||
<h2 class="text-2xl font-semibold mb-4 border-b border-gray-700 pb-2">Subnets & Devices</h2>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Managing Subnets</h3>
|
||||
<p>To add or remove subnets, go to the <a href="/admin" class="text-blue-400 underline">Admin</a> page. Click <span class="bg-gray-700 px-2 py-1 rounded">Add Subnet</span> to create a new subnet. Subnets are associated with sites.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Adding a Device</h3>
|
||||
<p>To add a device, visit the <a href="/devices" class="text-blue-400 underline">Devices</a> page and click <span class="bg-gray-700 px-2 py-1 rounded">Add Device</span>.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Assigning IP Addresses</h3>
|
||||
<p>To assign an IP address, you must first add a device. Then, from the <a href="/devices" class="text-blue-400 underline">Devices</a> page, click on a device to view its details and use the <span class="bg-gray-700 px-2 py-1 rounded">Add IP</span> option to assign an IP address from a subnet.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Viewing and Editing Devices</h3>
|
||||
<p>Click on any device in the <a href="/devices" class="text-blue-400 underline">Devices</a> list to view or edit its details, including assigned IPs, device types and a description where necessary.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<h2 class="text-2xl font-semibold mb-4 border-b border-gray-700 pb-2">Racks</h2>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Adding a Rack</h3>
|
||||
<p>To add a new rack, go to the <a href="/racks" class="text-blue-400 underline">Racks</a> page and click the <span class="bg-gray-700 px-2 py-1 rounded">Add Rack</span> button. Fill in the details and submit the form.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Assigning Devices to Racks</h3>
|
||||
<p>After adding a device, you can assign it to a rack from the <a href="/racks" class="text-blue-400 underline">Rack</a> details page. Click on a rack from the <a href="/racks" class="text-blue-400 underline">Racks</a> page, then use the options to add or remove devices within the rack.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Non-Networked Devices</h3>
|
||||
<p>Racks can also contain non-networked devices (such as shelves, patch panels, or other equipment that does not require an IP address). To add a non-networked device, go to a rack details page and use the option to add a device by name without assigning an IP address. These devices will appear in the rack layout but will not be listed on the Devices page.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<h2 class="text-2xl font-semibold mb-4 border-b border-gray-700 pb-2">User Management & Audit</h2>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">User Management & Admin</h3>
|
||||
<p>Users can manage themselves and other users from the <a href="/users" class="text-blue-400 underline">Users</a> page. Use this area to add, remove, or update user accounts.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-1">Audit & History</h3>
|
||||
<p>All changes are logged and can be reviewed on the <a href="/audit" class="text-blue-400 underline">Audit</a> page for accountability and troubleshooting.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
+29
-12
@@ -38,13 +38,14 @@
|
||||
<div class="flex justify-center gap-4 mb-6">
|
||||
</div>
|
||||
<div class="flex flex-col md:flex-row gap-4 mb-6 items-stretch">
|
||||
<div class="flex gap-4">
|
||||
<a href="?side=front" id="front-btn" class="rack-side-btn px-4 py-2 rounded-lg text-white font-semibold bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 {% if current_side == 'front' %}ring-2 ring-blue-400{% endif %}">Front</a>
|
||||
<a href="?side=back" id="back-btn" class="rack-side-btn px-4 py-2 rounded-lg text-white font-semibold bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 {% if current_side == 'back' %}ring-2 ring-blue-400{% endif %}">Back</a>
|
||||
<div class="flex gap-4 w-full flex-wrap justify-center md:justify-start">
|
||||
<a href="?side=front" id="front-btn" class="rack-side-btn px-4 py-2 rounded-lg text-white font-semibold bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 {% if current_side == 'front' %}ring-2 ring-gray-400{% endif %}">Front</a>
|
||||
<a href="?side=back" id="back-btn" class="rack-side-btn px-4 py-2 rounded-lg text-white font-semibold bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 {% if current_side == 'back' %}ring-2 ring-gray-400{% endif %}">Back</a>
|
||||
<button id="show-add-device-form" type="button" class="flex-1 min-w-[12rem] max-w-[16rem] bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg flex-shrink-0 whitespace-nowrap mt-4 md:mt-0"> <i class="fas fa-plus"></i> Add Device</button>
|
||||
<button id="show-nonnet-form" type="button" class="flex-[1.5_1.5_0%] min-w-[16rem] max-w-[28rem] bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg flex-shrink-0 whitespace-nowrap mt-4 md:mt-0"> <i class="fas fa-plus"></i> Add Non-Networked Device</button>
|
||||
</div>
|
||||
<button id="show-nonnet-form" type="button" class="w-full md:w-auto bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg mb-2 md:mb-0 md:ml-auto flex-shrink-0"><i class="fas fa-plus"></i> Add Non-Networked Device</button>
|
||||
</div>
|
||||
<form action="/rack/{{ rack.id }}/add_device" method="POST" class="mb-6 bg-gray-800 rounded-lg p-4">
|
||||
<form id="add-device-form" action="/rack/{{ rack.id }}/add_device" method="POST" class="hidden mb-6 bg-gray-800 rounded-lg p-4">
|
||||
<div class="flex flex-col md:flex-row gap-2 mb-2">
|
||||
<select name="device_id" class="border p-2 rounded bg-gray-900 text-gray-100 border-gray-600 w-full md:flex-1" required>
|
||||
<option value="" disabled selected>Select Device...</option>
|
||||
@@ -60,6 +61,7 @@
|
||||
<option value="back">Back</option>
|
||||
</select>
|
||||
<button type="submit" class="w-full md:w-auto bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg">Add Device</button>
|
||||
<button id="hide-add-device-form" type="button" class="w-full md:w-auto bg-gradient-to-r from-gray-500 to-gray-700 hover:from-gray-600 hover:to-gray-800 text-white px-4 py-2 rounded-lg md:ml-0.5 mt-2 md:mt-0 flex-shrink-0"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<div class="text-xs text-gray-400">To add a multi-U device, repeat for each U position.</div>
|
||||
</form>
|
||||
@@ -77,14 +79,29 @@
|
||||
<div class="text-xs text-gray-400 mt-2">Add a non-networked device.</div>
|
||||
</form>
|
||||
<script>
|
||||
document.getElementById('show-nonnet-form').onclick = function() {
|
||||
document.getElementById('nonnet-form').classList.remove('hidden');
|
||||
this.classList.add('hidden');
|
||||
};
|
||||
document.getElementById('hide-nonnet-form').onclick = function() {
|
||||
document.getElementById('nonnet-form').classList.add('hidden');
|
||||
function showBothAddButtons() {
|
||||
document.getElementById('show-add-device-form').classList.remove('hidden');
|
||||
document.getElementById('show-nonnet-form').classList.remove('hidden');
|
||||
};
|
||||
}
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
showBothAddButtons();
|
||||
document.getElementById('show-nonnet-form').onclick = function() {
|
||||
document.getElementById('nonnet-form').classList.remove('hidden');
|
||||
this.classList.add('hidden');
|
||||
};
|
||||
document.getElementById('hide-nonnet-form').onclick = function() {
|
||||
document.getElementById('nonnet-form').classList.add('hidden');
|
||||
showBothAddButtons();
|
||||
};
|
||||
document.getElementById('show-add-device-form').onclick = function() {
|
||||
document.getElementById('add-device-form').classList.remove('hidden');
|
||||
this.classList.add('hidden');
|
||||
};
|
||||
document.getElementById('hide-add-device-form').onclick = function() {
|
||||
document.getElementById('add-device-form').classList.add('hidden');
|
||||
showBothAddButtons();
|
||||
};
|
||||
});
|
||||
</script>
|
||||
{% if error %}
|
||||
<div class="mb-4 p-3 bg-red-700 text-white rounded-lg text-center font-semibold">{{ error }}</div>
|
||||
|
||||
Reference in New Issue
Block a user