121 lines
3.8 KiB
TypeScript
121 lines
3.8 KiB
TypeScript
import { CommonModule } from '@angular/common';
|
|
import { Component, signal } from '@angular/core';
|
|
import { Router, RouterModule } from '@angular/router';
|
|
import { ZardAvatarComponent } from '@shared/components/avatar/avatar.component';
|
|
import { ZardBreadcrumbModule } from '@shared/components/breadcrumb/breadcrumb.module';
|
|
import { ZardButtonComponent } from '@shared/components/button/button.component';
|
|
import { ZardDividerComponent } from '@shared/components/divider/divider.component';
|
|
import { LayoutModule } from '@shared/components/layout/layout.module';
|
|
import { ZardMenuModule } from '@shared/components/menu/menu.module';
|
|
import { ZardTooltipModule } from '@shared/components/tooltip/tooltip';
|
|
import { MenuItem } from 'src/app/core/interfaces/menu-item';
|
|
import { Theme } from 'src/app/core/services/theme';
|
|
import { ModeToggle } from '@shared/components/mode-toggle/mode-toggle';
|
|
import { PmuLogo } from '@shared/components/pmu-logo/pmu-logo';
|
|
import { User } from 'src/app/core/interfaces/user';
|
|
import { Auth } from 'src/app/core/services/auth';
|
|
|
|
@Component({
|
|
selector: 'app-layout',
|
|
imports: [
|
|
CommonModule,
|
|
RouterModule,
|
|
LayoutModule,
|
|
ZardButtonComponent,
|
|
ZardBreadcrumbModule,
|
|
ZardMenuModule,
|
|
ZardTooltipModule,
|
|
ZardDividerComponent,
|
|
ZardAvatarComponent,
|
|
ModeToggle,
|
|
PmuLogo,
|
|
],
|
|
templateUrl: './layout.html',
|
|
styleUrl: './layout.css',
|
|
})
|
|
export class Layout {
|
|
sidebarCollapsed = signal(false);
|
|
user = signal<User | null>(null);
|
|
|
|
constructor(public theme: Theme, public auth: Auth, public router: Router) {
|
|
this.user.set(auth.getUser());
|
|
}
|
|
|
|
mainMenuItems: MenuItem[] = [
|
|
{ icon: '🏠', label: 'Tableau de bord', link: '/', exact: true },
|
|
{ icon: '🏟️', label: 'Hippodromes', link: '/hippodromes' },
|
|
{ icon: '📅', label: 'Reunions', link: '/reunions' },
|
|
{ icon: '🏇', label: 'Courses', link: '/courses' },
|
|
{ icon: 'icon-chart-bar', label: 'Résultats des courses', link: '/resultat' },
|
|
{ icon: '💰', label: 'Gains (cagnotte)', link: '/gains' },
|
|
];
|
|
|
|
workspaceMenuItems: MenuItem[] = [
|
|
{
|
|
icon: 'icon-folder',
|
|
label: 'Gestion Agents',
|
|
submenu: [
|
|
{ icon: 'icon-user-plus', label: 'Gestion Agents', link: '/agents' },
|
|
{ icon: 'icon-sliders', label: 'Gestion limites Agents', link: '/limits' },
|
|
],
|
|
},
|
|
{ icon: 'icon-monitor', label: 'Gestion des TPE', link: '/tpes' },
|
|
{
|
|
icon: 'icon-users',
|
|
label: 'Utilisateurs',
|
|
submenu: [
|
|
{ icon: 'icon-users', label: 'Liste des utilisateurs', link: '/users' },
|
|
{ icon: 'icon-shield', label: 'Rôles & Permissions', link: '/roles' },
|
|
],
|
|
},
|
|
];
|
|
|
|
avatar = {
|
|
fallback: 'ZA',
|
|
url: '/assets/images/avatar.svg',
|
|
alt: 'ZadUI',
|
|
};
|
|
|
|
toggleSidebar() {
|
|
this.sidebarCollapsed.update((collapsed) => !collapsed);
|
|
}
|
|
|
|
onCollapsedChange(collapsed: boolean) {
|
|
this.sidebarCollapsed.set(collapsed);
|
|
}
|
|
|
|
toggleTheme() {
|
|
this.theme.toggle();
|
|
}
|
|
|
|
async logout() {
|
|
this.auth.logout();
|
|
await this.router.navigateByUrl('/auth/login');
|
|
}
|
|
|
|
navigate(link: string | undefined) {
|
|
if (link) {
|
|
this.router.navigateByUrl(link);
|
|
}
|
|
}
|
|
|
|
isActive(link: string, exact = false): boolean {
|
|
const current = this.router.url;
|
|
return exact ? current === link : current.startsWith(link);
|
|
}
|
|
|
|
isAnyActive(item: MenuItem): boolean {
|
|
if (item.link && this.isActive(item.link, !!item.exact)) return true;
|
|
if (item.submenu && item.submenu.length) {
|
|
return item.submenu.some((s) => !!s.link && this.isActive(s.link!, !!s.exact));
|
|
}
|
|
return false;
|
|
}
|
|
|
|
isEmoji(icon: string): boolean {
|
|
// simple: emojis are not alphanumeric or typical class names
|
|
// Detect if it contains non-ASCII characters
|
|
return /[^\u0000-\u00ff]/.test(icon);
|
|
}
|
|
}
|