Files
RadMac/app/templates/index.html
2025-04-02 14:52:23 -04:00

74 lines
1.9 KiB
HTML

{% extends 'base.html' %}
{% block title %}RadMac{% endblock %}
{% block content %}
<h1 class="page-title">RadMac</h1>
<div class="stats-cards">
<div class="card neutral">
<strong>Total MAC Addresses</strong>
<p>{{ total_users }}</p>
</div>
<div class="card neutral">
<strong>Total VLAN Groups</strong>
<p>{{ total_groups }}</p>
</div>
</div>
<h2>Recent Access-Accept</h2>
<ul class="event-list green">
{% for entry in latest_accept %}
<li>
<strong>{{ entry.mac_address }}</strong>
{% if entry.description %} ({{ entry.description }}){% endif %}
— {{ entry.ago }}
</li>
{% endfor %}
</ul>
<h2>Recent Access-Reject</h2>
<ul class="event-list red">
{% for entry in latest_reject %}
<li>
<strong>{{ entry.mac_address }}</strong>
{% if entry.description %} ({{ entry.description }}){% endif %}
— {{ entry.ago }}
</li>
{% endfor %}
</ul>
<hr>
<h2>MAC Vendor Lookup</h2>
<form id="mac-lookup-form" method="POST" action="/lookup_mac">
<input type="text" name="mac" id="mac-input" placeholder="Enter MAC address" required>
<button type="submit">🔍 Lookup</button>
</form>
<pre id="mac-result" class="debug-output"></pre>
<script>
document.getElementById('mac-lookup-form').addEventListener('submit', function(e) {
e.preventDefault();
const form = e.target;
const data = new URLSearchParams(new FormData(form));
const resultBox = document.getElementById('mac-result');
resultBox.textContent = "Querying...";
fetch(form.action, {
method: 'POST',
body: data,
})
.then(r => r.json())
.then(data => {
// Update: Use 'output' from the API response
resultBox.textContent = data.output || "No data returned.";
})
.catch(err => {
resultBox.textContent = `Error: ${err}`;
});
});
</script>
{% endblock %}