49 lines
2.4 KiB
Plaintext
49 lines
2.4 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="nl">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Racks — Mek-Tech Consulting</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
<link rel="stylesheet" href="/css/dynamic.css">
|
|
<link rel="icon" href="/img/favicon.svg" type="image/svg+xml">
|
|
</head>
|
|
<body>
|
|
<nav class="navbar"><div class="nav-inner"><a href="/" class="nav-brand"><img src="/img/logo.svg" class="nav-logo" alt="Mek-Tech"></a><div style="display:flex;align-items:center;gap:.4rem"><a href="/" class="nav-icon-btn" title="Dashboard"><i data-lucide="layout-dashboard" style="width:15px;height:15px"></i> Dashboard</a><button class="theme-toggle" id="themeToggle" onclick="toggleTheme()"></button><a href="/auth/logout" class="nav-icon-btn" style="color:var(--red)"><i data-lucide="log-out" style="width:15px;height:15px"></i> Uitloggen</a></div></div></nav>
|
|
|
|
<div class="container">
|
|
<a href="javascript:history.back()" class="back-link"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"/></svg> Terug</a>
|
|
<div class="page-header">
|
|
<h1>Server Racks</h1>
|
|
<a href="/racks/new" class="btn btn-primary">+ Nieuwe rack</a>
|
|
</div>
|
|
|
|
<% if (racks.length === 0) { %>
|
|
<div class="empty-state"><p>Nog geen racks. <a href="/racks/new" class="link">Voeg je eerste rack toe</a>.</p></div>
|
|
<% } else { %>
|
|
<div class="rack-grid">
|
|
<% racks.forEach(function(r) { %>
|
|
<a href="/racks/<%= r.id %>" class="rack-card">
|
|
<div class="rack-card-visual">
|
|
<div class="rack-mini">
|
|
<% var filled = Math.min(r.device_count, 20); %>
|
|
<% for(var i = 0; i < 20; i++) { %>
|
|
<div class="rack-mini-u <%= i < filled ? 'filled' : '' %>"></div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
<div class="rack-card-body">
|
|
<h4><%= r.name %></h4>
|
|
<p class="client-meta"><%= r.client_name %></p>
|
|
<% if (r.location) { %><p class="client-meta"><%= r.location %></p><% } %>
|
|
<p class="client-meta"><%= r.device_count %> device(s) / <%= r.total_units %>U</p>
|
|
</div>
|
|
</a>
|
|
<% }) %>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
<script src="/js/theme.js"></script></body>
|
|
</html>
|