div TODOs
This commit is contained in:
@@ -1,99 +1,35 @@
|
||||
/**
|
||||
* app/assets/js/dashboard.js
|
||||
*
|
||||
* Dashboard-Modul
|
||||
* - Zentrale Übersicht aller Grundfunktionen
|
||||
* - Einstiegspunkt für das Tool
|
||||
* - Kann später Status, Warnungen, Statistiken anzeigen
|
||||
*/
|
||||
|
||||
window.Dashboard = (function () {
|
||||
|
||||
// =========================
|
||||
// Interne Daten
|
||||
// =========================
|
||||
|
||||
const modules = [
|
||||
{
|
||||
id: 'device_types',
|
||||
label: 'Gerätetypen',
|
||||
description: 'Gerätetypen, Port-Definitionen, Module',
|
||||
url: '/app/device_types/list.php',
|
||||
icon: '🔌'
|
||||
},
|
||||
{
|
||||
id: 'devices',
|
||||
label: 'Geräte',
|
||||
description: 'Physische Geräte in Racks und Räumen',
|
||||
url: '/app/devices/list.php',
|
||||
icon: '🖥️'
|
||||
},
|
||||
{
|
||||
id: 'connections',
|
||||
label: 'Verbindungen',
|
||||
description: 'Kabel, Ports, VLANs, Protokolle',
|
||||
url: '/app/connections/list.php',
|
||||
icon: '🧵'
|
||||
},
|
||||
{
|
||||
id: 'floors',
|
||||
label: 'Standorte & Stockwerke',
|
||||
description: 'Gebäude, Etagen, Räume, Dosen',
|
||||
url: '/app/floors/list.php',
|
||||
icon: '🏢'
|
||||
},
|
||||
{
|
||||
id: 'racks',
|
||||
label: 'Serverschränke',
|
||||
description: 'Racks, Positionierung, Höheneinheiten',
|
||||
url: '/app/racks/list.php',
|
||||
icon: '🗄️'
|
||||
},
|
||||
{
|
||||
id: 'network_view',
|
||||
label: 'Netzwerk-Ansicht',
|
||||
description: 'Grafische Netzwerkdarstellung',
|
||||
url: '/network.php',
|
||||
icon: '🌐'
|
||||
},
|
||||
{
|
||||
id: 'svg_editor',
|
||||
label: 'SVG-Port-Editor',
|
||||
description: 'Ports auf Gerätetypen definieren',
|
||||
url: '/svg-editor.php',
|
||||
icon: '✏️'
|
||||
}
|
||||
{ id: 'device_types', label: 'Geraetetypen', description: 'Geraetetypen und Port-Definitionen', url: '?module=device_types&action=list', icon: 'DT' },
|
||||
{ id: 'devices', label: 'Geraete', description: 'Physische Geraete in Racks und Raeumen', url: '?module=devices&action=list', icon: 'DV' },
|
||||
{ id: 'connections', label: 'Verbindungen', description: 'Kabel, Ports und VLANs', url: '?module=connections&action=list', icon: 'CN' },
|
||||
{ id: 'floors', label: 'Stockwerke', description: 'Standorte, Gebaeude und Etagen', url: '?module=floors&action=list', icon: 'FL' },
|
||||
{ id: 'racks', label: 'Racks', description: 'Racks und Positionierung', url: '?module=racks&action=list', icon: 'RK' },
|
||||
{ id: 'infra', label: 'Infrastruktur', description: 'Patchpanels und Wandbuchsen', url: '?module=floor_infrastructure&action=list', icon: 'IF' }
|
||||
];
|
||||
|
||||
// =========================
|
||||
// Public API
|
||||
// =========================
|
||||
|
||||
function init() {
|
||||
console.log('Dashboard initialized');
|
||||
const container = document.querySelector('#dashboard-modules');
|
||||
if (container) {
|
||||
renderModules(container);
|
||||
}
|
||||
|
||||
// TODO: Dashboard-Container ermitteln
|
||||
// const container = document.querySelector('#dashboard');
|
||||
|
||||
// TODO: Module rendern
|
||||
// renderModules(container);
|
||||
|
||||
// TODO: Optional: Status-Daten laden (Counts, Warnings)
|
||||
loadStats();
|
||||
showWarnings();
|
||||
renderRecentChanges();
|
||||
}
|
||||
|
||||
// =========================
|
||||
// Render Functions
|
||||
// =========================
|
||||
|
||||
function renderModules(container) {
|
||||
if (!container) return;
|
||||
|
||||
container.innerHTML = '';
|
||||
|
||||
modules.forEach(module => {
|
||||
const el = document.createElement('div');
|
||||
modules.forEach((module) => {
|
||||
const el = document.createElement('a');
|
||||
el.className = 'dashboard-tile';
|
||||
|
||||
el.href = module.url;
|
||||
el.innerHTML = `
|
||||
<div class="dashboard-icon">${module.icon}</div>
|
||||
<div class="dashboard-content">
|
||||
@@ -101,30 +37,54 @@ window.Dashboard = (function () {
|
||||
<p>${module.description}</p>
|
||||
</div>
|
||||
`;
|
||||
|
||||
el.addEventListener('click', () => {
|
||||
window.location.href = module.url;
|
||||
});
|
||||
|
||||
container.appendChild(el);
|
||||
});
|
||||
}
|
||||
|
||||
// =========================
|
||||
// Optional Erweiterungen
|
||||
// =========================
|
||||
function loadStats() {
|
||||
const stats = {
|
||||
devices: countRows('.device-list tbody tr'),
|
||||
connections: countRows('.connection-list tbody tr'),
|
||||
outlets: countRows('.infra-table tbody tr')
|
||||
};
|
||||
|
||||
// TODO: loadStats() → Anzahl Geräte, offene Ports, unverbundene Dosen
|
||||
// TODO: showWarnings() → unverbundene Ports, VLAN-Konflikte
|
||||
// TODO: RecentChanges() → letzte Änderungen
|
||||
const target = document.querySelector('[data-dashboard-stats]');
|
||||
if (!target) {
|
||||
return;
|
||||
}
|
||||
|
||||
// =========================
|
||||
// Expose Public Methods
|
||||
// =========================
|
||||
target.textContent = `Geraete: ${stats.devices} | Verbindungen: ${stats.connections} | Infrastruktur-Eintraege: ${stats.outlets}`;
|
||||
}
|
||||
|
||||
return {
|
||||
init,
|
||||
// renderModules // optional öffentlich machen
|
||||
};
|
||||
function showWarnings() {
|
||||
const target = document.querySelector('[data-dashboard-warnings]');
|
||||
if (!target) {
|
||||
return;
|
||||
}
|
||||
|
||||
const warnings = [];
|
||||
if (countRows('.device-list tbody tr') === 0) {
|
||||
warnings.push('Noch keine Geraete vorhanden');
|
||||
}
|
||||
if (countRows('.connection-list tbody tr') === 0) {
|
||||
warnings.push('Noch keine Verbindungen vorhanden');
|
||||
}
|
||||
|
||||
target.textContent = warnings.length ? warnings.join(' | ') : 'Keine offenen Warnungen erkannt';
|
||||
}
|
||||
|
||||
function renderRecentChanges() {
|
||||
const target = document.querySelector('[data-dashboard-recent]');
|
||||
if (!target) {
|
||||
return;
|
||||
}
|
||||
|
||||
target.textContent = 'Letzte Aenderungen werden serverseitig noch nicht protokolliert.';
|
||||
}
|
||||
|
||||
function countRows(selector) {
|
||||
return document.querySelectorAll(selector).length;
|
||||
}
|
||||
|
||||
return { init };
|
||||
})();
|
||||
|
||||
Reference in New Issue
Block a user