chris/webinterface
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change admin.html

Browse Source
This commit is contained in:
Christian Rute 2024-10-29 22:24:31 +01:00
parent 003c621efc
commit 8d1ec4245f
3 changed files with 45 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
client/admin.html
View File

@ -7,11 +7,23 @@
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<h1>Admin-Bereich</h1>
<button id="loadUserListBtn">Benutzerliste laden</button>
<div id="user-list"></div>
<button id="logoutBtn">Abmelden</button>
<button onclick="toWelcome()">Zur Willkommensseite</button>
<!-- Header für Admin-Bereich -->
<header class="header">
<h1 class="header-title">Admin-Bereich</h1>
<div class="header-buttons">
<button id="loadUserListBtn" class="header-btn">Benutzerliste laden</button>
<button onclick="toWelcome()" class="header-btn">Zur Willkommensseite</button>
<button id="logoutBtn" class="header-btn">Abmelden</button>
</div>
</header>
<!-- Hauptbereich für Benutzerliste -->
<main>
<div id="user-list" class="user-list"></div>
</main>
<script src="js/main.js"></script>
</body>
</html>

21
client/css/styles.css
View File

@ -147,4 +147,25 @@ main {
flex-grow: 1;
}
/* Benutzerliste Styling */
.user-list {
padding: 20px;
background-color: #f8f9fa;
border-radius: 8px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
/* Titel im Header */
.header-title {
font-size: 1.5rem;
color: #333;
margin: 0;
flex-grow: 1;
text-align: left;
padding: 0.5rem;
}
.button-delete {
color: red;
}

10
client/js/main.js
View File

@ -101,10 +101,14 @@ async function loadUserList() {
users.forEach(user => {
const userDiv = document.createElement('div');
userDiv.style.display = 'flex';
userDiv.style.alignItems = 'center';
userDiv.setAttribute('id', `user-list-element`);
userDiv.innerHTML = `
<p>Benutzername: ${user.username} - Email: ${user.email}</p>
<button onclick="deleteUser('${user._id}')">Benutzer löschen</button>
`;
<p style="flex: 0 0 25%;">Benutzername: ${user.username}</p>
<p style="flex: 0 0 25%;">Email: ${user.email}</p>
<button id="button-delete" onclick="deleteUser('${user._id}')" style="flex: 0 0 50%;">Benutzer löschen</button>
`;
userList.appendChild(userDiv);
});
} else {