80 lines
3.1 KiB
HTML
80 lines
3.1 KiB
HTML
<div class="app-container">
|
|
<div class="background-decorations">
|
|
<div class="blob blob-1"></div>
|
|
<div class="blob blob-2"></div>
|
|
</div>
|
|
|
|
<main class="main-card">
|
|
<header class="card-header">
|
|
<div class="logo-wrapper">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="logo-icon">
|
|
<path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
|
|
<polyline points="9 22 9 12 15 12 15 22"/>
|
|
</svg>
|
|
</div>
|
|
<h1>LMNP Organizer</h1>
|
|
<p class="subtitle">Votre assistant de gestion et fiscalité immobilière</p>
|
|
</header>
|
|
|
|
<section class="card-body">
|
|
@if (!isLoggedIn) {
|
|
<div class="auth-state locked">
|
|
<div class="shield-icon">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<rect width="18" height="11" x="3" y="11" rx="2" ry="2"/>
|
|
<path d="M7 11V7a5 5 0 0 1 10 0v4"/>
|
|
</svg>
|
|
</div>
|
|
<h2>Connexion Sécurisée Requise</h2>
|
|
<p>Connectez-vous avec Keycloak / voidAuth pour accéder à votre espace de gestion locative.</p>
|
|
<button (click)="login()" class="btn btn-primary btn-glow">
|
|
<span>Se connecter avec OIDC</span>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="btn-arrow">
|
|
<path d="M5 12h14"/>
|
|
<path d="m12 5 7 7-7 7"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
} @else {
|
|
<div class="auth-state unlocked">
|
|
<div class="user-profile">
|
|
<div class="avatar">
|
|
{{ username.charAt(0).toUpperCase() }}
|
|
</div>
|
|
<div class="user-details">
|
|
<h3>{{ username }}</h3>
|
|
<p class="user-email">{{ email }}</p>
|
|
<span class="badge badge-success">Connecté</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="api-demo-section">
|
|
<h4>Vérification API Sécurisée</h4>
|
|
<p>Testez la transmission et la validation du jeton JWT auprès du backend Java 25.</p>
|
|
<div class="api-actions">
|
|
<button (click)="callHelloApi()" class="btn btn-secondary">
|
|
Appeler /api/hello
|
|
</button>
|
|
</div>
|
|
|
|
@if (helloMessage()) {
|
|
<div class="api-response-wrapper">
|
|
<span class="response-label">Réponse du backend :</span>
|
|
<code class="api-response-code">{{ helloMessage() }}</code>
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
<button (click)="logout()" class="btn btn-outline">
|
|
Se déconnecter
|
|
</button>
|
|
</div>
|
|
}
|
|
</section>
|
|
|
|
<footer class="card-footer">
|
|
<p>LMNP Organizer © 2026. Sécurisé avec OpenID Connect et Spring Boot 4.</p>
|
|
</footer>
|
|
</main>
|
|
</div>
|