rschneider/dvbooking
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

create admin layout

Browse Source
This commit is contained in:
Roland Schneider 2025-11-18 13:42:58 +01:00
parent e2211e2de7
commit ce76bf75c9
15 changed files with 210 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -29,7 +29,7 @@
'loading': loading(),
'btn-responsive': responsive()
}"
[class]="customClass()"
[class]="customClass() || ''"
(click)="onClick($event)"
>
<ng-content />

0
admin/projects/rschneider/ng-daisyui/src/lib/components/footer/footer.css Normal file
View File

32
admin/projects/rschneider/ng-daisyui/src/lib/components/footer/footer.html Normal file
View File

@ -0,0 +1,32 @@
<footer class="footer sm:footer-horizontal bg-neutral text-neutral-content p-10">
@if (config()) {
@for ( footerNav of config()?.navs; let i = $index; track i){
<nav>
<h6 class="footer-title">{{ footerNav.label }}</h6>
@for ( link of footerNav.links; let j = $index; track j){
<a class="link link-hover" [routerLink]="link.href" >{{link.text}}</a>
}
</nav>
}
}
<nav>
<h6 class="footer-title">Services</h6>
<a class="link link-hover">Branding</a>
<a class="link link-hover">Design</a>
<a class="link link-hover">Marketing</a>
<a class="link link-hover">Advertisement</a>
</nav>
<nav>
<h6 class="footer-title">Company</h6>
<a class="link link-hover">About us</a>
<a class="link link-hover">Contact</a>
<a class="link link-hover">Jobs</a>
<a class="link link-hover">Press kit</a>
</nav>
<nav>
<h6 class="footer-title">Legal</h6>
<a class="link link-hover">Terms of use</a>
<a class="link link-hover">Privacy policy</a>
<a class="link link-hover">Cookie policy</a>
</nav>
</footer>

23
admin/projects/rschneider/ng-daisyui/src/lib/components/footer/footer.spec.ts Normal file
View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { Footer } from './footer';
describe('Footer', () => {
let component: Footer;
let fixture: ComponentFixture<Footer>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [Footer]
})
.compileComponents();
fixture = TestBed.createComponent(Footer);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

17
admin/projects/rschneider/ng-daisyui/src/lib/components/footer/footer.ts Normal file
View File

@ -0,0 +1,17 @@
import { Component, input } from '@angular/core';
import { FooterConfig } from '../../daisy.types';
import { RouterLink } from '@angular/router';
@Component({
selector: 'rs-daisy-footer',
imports: [
RouterLink,
],
templateUrl: './footer.html',
styleUrl: './footer.css',
})
export class Footer {
config = input<FooterConfig>()
}

13
admin/projects/rschneider/ng-daisyui/src/lib/daisy.types.ts Normal file
View File

@ -0,0 +1,13 @@
export interface Link{
href: string;
text: string;
}
export interface FooterNav{
label: string;
links: Link[];
}
export interface FooterConfig{
navs: FooterNav[]
}

0
admin/projects/rschneider/ng-daisyui/src/lib/layout/admin-layout-rs1/admin-layout-rs1.css Normal file
View File

61
admin/projects/rschneider/ng-daisyui/src/lib/layout/admin-layout-rs1/admin-layout-rs1.html Normal file
View File

@ -0,0 +1,61 @@
<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>
</div>
<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" />
</div>
</div>
<ul
tabindex="-1"
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
<li>
<a class="justify-between">
Profile
<span class="badge">New</span>
</a>
</li>
<li><a>Settings</a></li>
<li><a (click)="onClick($event,'logout')">Logout</a></li>
</ul>
</div>
</div>
</div>
<!-- Main Content -->
<main class="flex-1 p-6 bg-base-100 overflow-y-auto">
<ng-content></ng-content>
</main>
<!-- Footer -->
<footer class="bg-base-200 p-4 text-center">
<p>Copyright © 2025 - All right reserved</p>
</footer>
</div>
<!-- Sidebar -->
<div class="drawer-side">
<label for="my-drawer-2" aria-label="close sidebar" class="drawer-overlay"></label>
<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>
</ul>
</div>
</div>

23
admin/projects/rschneider/ng-daisyui/src/lib/layout/admin-layout-rs1/admin-layout-rs1.spec.ts Normal file
View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AdminLayoutRs1 } from './admin-layout-rs1';
describe('AdminLayoutRs1', () => {
let component: AdminLayoutRs1;
let fixture: ComponentFixture<AdminLayoutRs1>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [AdminLayoutRs1]
})
.compileComponents();
fixture = TestBed.createComponent(AdminLayoutRs1);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

28
admin/projects/rschneider/ng-daisyui/src/lib/layout/admin-layout-rs1/admin-layout-rs1.ts Normal file
View File

@ -0,0 +1,28 @@
import { Component, input, output } from '@angular/core';
@Component({
selector: 'rs-daisy-admin-layout-rs1',
imports: [],
templateUrl: './admin-layout-rs1.html',
styleUrl: './admin-layout-rs1.css',
})
export class AdminLayoutRs1 {
readonly loggedIn = input<boolean>(false)
// New Output for the click event
// By default, it emits 'void' (no specific data), but you could specify a type if needed.
readonly clickEvent = output<MouseEvent>();
// Event handler method
onClick(event: MouseEvent, command: string): void {
// Prevent default browser behavior for buttons if needed (e.g., form submission)
// event.preventDefault();
// Emit the click event
this.clickEvent.emit(event);
}
}

3
admin/projects/rschneider/ng-daisyui/src/lib/layout/index.ts Normal file
View File

@ -0,0 +1,3 @@
export * from './admin-layout-rs1/admin-layout-rs1';

3
admin/projects/rschneider/ng-daisyui/src/public-api.ts
View File

@ -4,3 +4,6 @@
export * from './lib/ng-daisyui';
export * from './lib/components/button/button';
export * from './lib/components/footer/footer';
export * from './lib/daisy.types';
export * from './lib/layout/';

BIN
admin/public/sample-profile-photo.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

7
admin/src/app/app.html
View File

@ -1,6 +1,3 @@
<div>
<button (click)="logout()">Logout</button>
<rs-daisy-button variant="primary"(click)="logout()" >Logout</rs-daisy-button>
</div>
<app-main-menu></app-main-menu>
<rs-daisy-admin-layout-rs1 (clickEvent)="logout()" [loggedIn]="true">
<router-outlet />
</rs-daisy-admin-layout-rs1>

5
admin/src/app/app.ts
View File

@ -5,12 +5,13 @@ import { AuthService } from './auth/auth.service';
import { AdminLayout } from './layout/admin-layout/admin-layout';
import { finalize } from 'rxjs/operators';
import {Button} from '@rschneider/ng-daisyui';
import { AdminLayoutRs1 } from '../../projects/rschneider/ng-daisyui/src/lib/layout';
@Component({
selector: 'app-root',
imports: [RouterOutlet, MainMenu, Button],
imports: [RouterOutlet, MainMenu, Button, AdminLayoutRs1],
templateUrl: './app.html',
styleUrl: './app.css'
styleUrl: './app.css',
})
export class App {
protected readonly title = signal('admin');