login/logout

admin/projects/rschneider/ng-daisyui/src/lib/components/button/button.html

@@ -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)"

admin/projects/rschneider/ng-daisyui/src/lib/layout/admin-layout-rs1/admin-layout-rs1.html

@@ -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="navbar bg-base-200 p-4 shadow-md z-10">
+      <div class="flex-1">
-        <div class="flex-1">
+        <label for="my-drawer-2" class="btn btn-square btn-ghost drawer-button lg:hidden">
-          <a class="btn btn-ghost text-xl">DV Booking</a>
+          <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
-        </div>
+               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,7 +38,9 @@
             </ul>
           </div>
         </div>
-      </div>
+      }
+    </div>
+
 
     <!-- Main Content -->
     <main class="flex-1 p-6 bg-base-100 overflow-y-auto">
@@ -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>
-      <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>
+        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-      <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>
+          <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>

admin/src/app/app.html

@@ -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>

admin/src/app/app.ts

@@ -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()
+  }
+
 }

admin/src/app/components/login/login.component.html

@@ -1,15 +1,17 @@
-<div>
+<div class="bg-base-200 rounded-2xl p-4">
-  <h2>Login</h2>
+  <h2 class="">Login</h2>
   <form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
-    <div>
+    <div class="pt-4">
-      <label for="username">Username:</label>
+      <label class="label  pe-2" for="username">Username:</label>
-      <input id="username" formControlName="username" />
+      <input id="username" class="input " formControlName="username" />
     </div>
-    <div>
+    <div class="pt-4">
-      <label for="password">Password:</label>
+      <label class="label  pe-2" for="password">Password:</label>
-      <input id="password" type="password" formControlName="password" />
+      <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>

admin/src/app/components/login/login.component.ts

@@ -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;