login/logout
This commit is contained in:
Roland Schneider
parent
ce76bf75c9
commit
5e5a4fc505
@ -1,6 +1,6 @@
|
||||
<button
|
||||
[disabled]="disabled()"
|
||||
|
||||
[aria-disabled]="disabled()"
|
||||
role="button"
|
||||
[ngClass]="{
|
||||
'btn': true,
|
||||
'btn-primary': variant() === 'primary',
|
||||
@ -27,7 +27,9 @@
|
||||
'btn-block': block(),
|
||||
'no-animation': noAnimation(),
|
||||
'loading': loading(),
|
||||
'btn-responsive': responsive()
|
||||
'btn-responsive': responsive(),
|
||||
|
||||
'btn-disabled': disabled()
|
||||
}"
|
||||
[class]="customClass() || ''"
|
||||
(click)="onClick($event)"
|
||||
|
||||
@ -1,22 +1,27 @@
|
||||
|
||||
<div class="drawer lg:drawer-open">
|
||||
<input id="my-drawer-2" type="checkbox" class="drawer-toggle" />
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="drawer-content flex flex-col h-screen">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="navbar bg-base-200 p-4 shadow-md z-10">
|
||||
<div class="flex-1">
|
||||
<a class="btn btn-ghost text-xl">DV Booking</a>
|
||||
<label for="my-drawer-2" class="btn btn-square btn-ghost drawer-button lg:hidden">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
|
||||
class="inline-block w-6 h-6 stroke-current">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
||||
</svg>
|
||||
</label>
|
||||
<a class="btn btn-ghost text-xl">daisyUI</a>
|
||||
</div>
|
||||
@if (loggedIn()) {
|
||||
<div class="flex-none">
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar">
|
||||
<div class="w-10 rounded-full">
|
||||
<img
|
||||
alt="Tailwind CSS Navbar component"
|
||||
src="sample-profile-photo.webp" />
|
||||
src="https://img.daisyui.com/images/stock/photo-1534528741775-53994a69daeb.webp" />
|
||||
</div>
|
||||
</div>
|
||||
<ul
|
||||
@ -33,8 +38,10 @@
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Main Content -->
|
||||
<main class="flex-1 p-6 bg-base-100 overflow-y-auto">
|
||||
<ng-content></ng-content>
|
||||
@ -53,9 +60,24 @@
|
||||
<ul class="menu p-4 w-80 min-h-full bg-base-300 text-base-content">
|
||||
<!-- Sidebar content here -->
|
||||
<li class="text-lg font-bold p-4">My App</li>
|
||||
<li><a><svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>Dashboard</a></li>
|
||||
<li><a><svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>Analytics</a></li>
|
||||
<li><a><svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" /></svg>Reports</a></li>
|
||||
<li><a>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
|
||||
</svg>
|
||||
Dashboard</a></li>
|
||||
<li><a>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
Analytics</a></li>
|
||||
<li><a>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
||||
</svg>
|
||||
Reports</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
<rs-daisy-admin-layout-rs1 (clickEvent)="logout()" [loggedIn]="true">
|
||||
<rs-daisy-admin-layout-rs1 (clickEvent)="logout()" [loggedIn]="loggedIn()">
|
||||
<router-outlet />
|
||||
</rs-daisy-admin-layout-rs1>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, signal } from '@angular/core';
|
||||
import { Component, inject, signal } from '@angular/core';
|
||||
import { Router, RouterOutlet } from '@angular/router';
|
||||
import { MainMenu } from './components/main-menu/main-menu';
|
||||
import { AuthService } from './auth/auth.service';
|
||||
@ -16,6 +16,7 @@ import { AdminLayoutRs1 } from '../../projects/rschneider/ng-daisyui/src/lib/lay
|
||||
export class App {
|
||||
protected readonly title = signal('admin');
|
||||
|
||||
|
||||
constructor(private authService: AuthService, private router: Router) {}
|
||||
|
||||
logout(): void {
|
||||
@ -33,4 +34,8 @@ export class App {
|
||||
});
|
||||
}
|
||||
|
||||
loggedIn(){
|
||||
return this.authService.isLoggedIn()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -1,15 +1,17 @@
|
||||
<div>
|
||||
<h2>Login</h2>
|
||||
<div class="bg-base-200 rounded-2xl p-4">
|
||||
<h2 class="">Login</h2>
|
||||
<form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
|
||||
<div>
|
||||
<label for="username">Username:</label>
|
||||
<input id="username" formControlName="username" />
|
||||
<div class="pt-4">
|
||||
<label class="label pe-2" for="username">Username:</label>
|
||||
<input id="username" class="input " formControlName="username" />
|
||||
</div>
|
||||
<div>
|
||||
<label for="password">Password:</label>
|
||||
<input id="password" type="password" formControlName="password" />
|
||||
<div class="pt-4">
|
||||
<label class="label pe-2" for="password">Password:</label>
|
||||
<input id="password" class="input " type="password" formControlName="password" />
|
||||
</div>
|
||||
<div class="button-container pt-4">
|
||||
<rs-daisy-button type="submit" [disabled]="loginForm.invalid">Log In</rs-daisy-button>
|
||||
</div>
|
||||
<button type="submit" [disabled]="loginForm.invalid">Log In</button>
|
||||
</form>
|
||||
<p *ngIf="errorMessage">{{ errorMessage }}</p>
|
||||
</div>
|
||||
|
||||
@ -3,12 +3,14 @@ import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angula
|
||||
import { Router } from '@angular/router';
|
||||
import { AuthService } from '../../auth/auth.service';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import {Button} from '@rschneider/ng-daisyui';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-login',
|
||||
templateUrl: './login.component.html',
|
||||
standalone: true,
|
||||
imports: [ReactiveFormsModule, CommonModule],
|
||||
imports: [ReactiveFormsModule, CommonModule, Button],
|
||||
})
|
||||
export class LoginComponent {
|
||||
loginForm: FormGroup;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user