78 lines
3.5 KiB
Plaintext
78 lines
3.5 KiB
Plaintext
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
|
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
|
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Tableau de bord | RJLResaka</title>
|
|
<meta name="description" content="Tableau de bord RJLResaka avec liste des utilisateurs disponibles pour chatter.">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/app.css">
|
|
</head>
|
|
<body class="dashboard-body">
|
|
<main class="dashboard-shell">
|
|
<section class="sidebar glass">
|
|
<div class="sidebar-top">
|
|
<span class="hero-badge">Connecté</span>
|
|
<a class="ghost-link" href="${pageContext.request.contextPath}/logout">Déconnexion</a>
|
|
</div>
|
|
<div class="profile-card">
|
|
<div class="avatar" style="background:${sessionScope.authUser.avatarColor}">${sessionScope.authUser.initials}</div>
|
|
<div>
|
|
<h1>${sessionScope.authUser.fullName}</h1>
|
|
<p>@${sessionScope.authUser.username}</p>
|
|
<small>${sessionScope.authUser.email}</small>
|
|
</div>
|
|
</div>
|
|
<div class="panel-note">
|
|
<strong>Étape livrée :</strong>
|
|
Authentification complète + liste des utilisateurs.<br>
|
|
La prochaine étape branchera les conversations privées, l'upload d'images/fichiers et les réactions.
|
|
</div>
|
|
</section>
|
|
|
|
<section class="content-panel glass">
|
|
<div class="content-head">
|
|
<div>
|
|
<span class="section-kicker">Utilisateurs</span>
|
|
<h2>Choisissez une personne à qui parler</h2>
|
|
</div>
|
|
<span class="pill">${fn:length(users)} compte(s)</span>
|
|
</div>
|
|
|
|
<c:if test="${not empty error}">
|
|
<div class="alert error">${error}</div>
|
|
</c:if>
|
|
|
|
<div class="user-grid">
|
|
<c:forEach items="${users}" var="item">
|
|
<article class="user-card">
|
|
<div class="avatar large" style="background:${item.avatarColor}">${item.initials}</div>
|
|
<h3>${item.fullName}</h3>
|
|
<p>@${item.username}</p>
|
|
<small>${item.email}</small>
|
|
<button class="button secondary" type="button" disabled>Chat disponible à l'étape suivante</button>
|
|
</article>
|
|
</c:forEach>
|
|
|
|
<c:if test="${empty users}">
|
|
<article class="empty-card">
|
|
<h3>Aucun autre utilisateur pour le moment</h3>
|
|
<p>Créez un deuxième compte pour tester le chat privé ensuite.</p>
|
|
</article>
|
|
</c:if>
|
|
</div>
|
|
|
|
<c:if test="${not empty debugMessage}">
|
|
<p class="debug-note">Détail technique: ${debugMessage}</p>
|
|
</c:if>
|
|
</section>
|
|
</main>
|
|
<script src="${pageContext.request.contextPath}/assets/js/app.js"></script>
|
|
</body>
|
|
</html>
|