142 lines
6.2 KiB
HTML
142 lines
6.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{{.title}}</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
|
|
<link href="/static/style.css" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
<div class="container mt-4">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<h1 class="text-center mb-4">
|
|
<i class="fas fa-power-off text-primary"></i>
|
|
{{.title}}
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Neuen PC hinzufügen -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-plus-circle"></i> Neuen PC hinzufügen
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<form id="addPCForm">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="pcName" class="form-label">PC-Name</label>
|
|
<input type="text" class="form-control" id="pcName" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="macAddress" class="form-label">MAC-Adresse</label>
|
|
<input type="text" class="form-control" id="macAddress"
|
|
placeholder="XX:XX:XX:XX:XX:XX" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-save"></i> PC hinzufügen
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PC-Liste -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-desktop"></i> Gespeicherte PCs
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div id="pcList" class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>MAC-Adresse</th>
|
|
<th>Erstellt am</th>
|
|
<th>Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="pcTableBody">
|
|
<!-- PCs werden hier dynamisch eingefügt -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div id="noPCs" class="text-center text-muted" style="display: none;">
|
|
<i class="fas fa-info-circle fa-2x mb-2"></i>
|
|
<p>Noch keine PCs hinzugefügt.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit PC Modal -->
|
|
<div class="modal fade" id="editPCModal" tabindex="-1" aria-labelledby="editPCModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="editPCModalLabel">
|
|
<i class="fas fa-edit"></i> PC bearbeiten
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="editPCForm">
|
|
<input type="hidden" id="editPCId">
|
|
<div class="mb-3">
|
|
<label for="editPCName" class="form-label">PC-Name</label>
|
|
<input type="text" class="form-control" id="editPCName" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="editMACAddress" class="form-label">MAC-Adresse</label>
|
|
<input type="text" class="form-control" id="editMACAddress"
|
|
placeholder="XX:XX:XX:XX:XX:XX" required>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
|
<button type="button" class="btn btn-primary" id="saveEditBtn">
|
|
<i class="fas fa-save"></i> Speichern
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Toast für Benachrichtigungen -->
|
|
<div class="toast-container position-fixed bottom-0 end-0 p-3">
|
|
<div id="notificationToast" class="toast" role="alert">
|
|
<div class="toast-header">
|
|
<strong class="me-auto" id="toastTitle">Benachrichtigung</strong>
|
|
<button type="button" class="btn-close" data-bs-dismiss="toast"></button>
|
|
</div>
|
|
<div class="toast-body" id="toastMessage">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="/static/script.js"></script>
|
|
</body>
|
|
</html>
|