142 lines
3.4 KiB
TypeScript
142 lines
3.4 KiB
TypeScript
import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
|
|
import { ActivatedRoute, Router } from '@angular/router';
|
|
import { AppService } from '../../app.service';
|
|
import { MENU, NOT_ADMIN, ROLE_ADMIN } from "../../@config/menus";
|
|
|
|
@Component({
|
|
selector: 'app-pages-layouts',
|
|
templateUrl: './layouts.component.html',
|
|
styles: [],
|
|
})
|
|
export class PagesLayoutsComponent implements OnInit {
|
|
|
|
menus = MENU;
|
|
isToggleSidebar = false;
|
|
innerWidth: any;
|
|
auth: any = {};
|
|
isCollapsed: any = [];
|
|
breadcrumb: any = [];
|
|
permissionCheck = false;
|
|
permission: any = [];
|
|
|
|
constructor(
|
|
private app: AppService,
|
|
private router: Router,
|
|
public changeDetectorRef: ChangeDetectorRef,
|
|
) {
|
|
|
|
}
|
|
|
|
async ngOnInit() {
|
|
this.onCollapsed();
|
|
this.getBreadcrumb();
|
|
await this.initAuth();
|
|
this.changeDetectorRef.markForCheck()
|
|
}
|
|
async initAuth() {
|
|
this.auth = this.app.auth();
|
|
// console.log(this.auth)
|
|
// console.log(this.auth.isAdmin)
|
|
this.menus = this.menus.map(r => {
|
|
if (this.auth?.isAdmin) {
|
|
if (r.roles.includes(ROLE_ADMIN)) return {
|
|
...r,
|
|
children: r.children.length ? r.children.filter(c => r.roles.includes(ROLE_ADMIN)) : []
|
|
}
|
|
} else {
|
|
if (r.roles.includes(NOT_ADMIN)) return {
|
|
...r,
|
|
children: r.children.length ? r.children.filter(c => r.roles.includes(NOT_ADMIN)) : []
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
|
|
if (!this.permissionCheck) {
|
|
// const users = await lastValueFrom(this.app.get(`${API.users}/getById/${this.auth.id}`));
|
|
// this.permission = users.permission;
|
|
// this.permissionCheck = true;
|
|
}
|
|
|
|
}
|
|
|
|
roleCheck(perm: string) {
|
|
// if(!environment.production) return true
|
|
// return this.permission.includes(perm)
|
|
return true;
|
|
}
|
|
|
|
getBreadcrumb() {
|
|
this.breadcrumb = [];
|
|
let router: any = this.router.url;
|
|
router = router.split('/');
|
|
this.mapBreadcrumb(router, this.menus)
|
|
this.changeDetectorRef.markForCheck()
|
|
|
|
}
|
|
|
|
mapBreadcrumb(router: any, items: any) {
|
|
items.map((item: any) => {
|
|
this.addItemBreadcrumb(router, item);
|
|
if (item.children) this.mapBreadcrumb(router, item.children);
|
|
|
|
});
|
|
}
|
|
|
|
addItemBreadcrumb(router: any, item: any) {
|
|
|
|
const data = {
|
|
name: item.name,
|
|
link: item.link,
|
|
}
|
|
if (router[2]) {
|
|
if (item.link === router[2]) this.breadcrumb.push(data);
|
|
}
|
|
if (router[3]) {
|
|
if (item.link === `${router[2]}/${router[3]}`) this.breadcrumb.push(data);
|
|
}
|
|
if (router[4]) {
|
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}`) this.breadcrumb.push(data);
|
|
}
|
|
if (router[5]) {
|
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}`) this.breadcrumb.push(data);
|
|
}
|
|
if (router[6]) {
|
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}/${router[6]}`) this.breadcrumb.push(data);
|
|
}
|
|
}
|
|
|
|
onCollapsed() {
|
|
let router: any = this.router.url;
|
|
router = router.split('/');
|
|
this.menus.forEach((item: any, i: number) => {
|
|
// item.collapsed = false;
|
|
if (item.type === 'collapsable') {
|
|
if (router.includes(item.link)) {
|
|
item.collapsed = true;
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
logout() {
|
|
this.app.logout();
|
|
return this.router.navigate(['/auth']);
|
|
}
|
|
|
|
|
|
toggleSidebar() {
|
|
this.isToggleSidebar = !this.isToggleSidebar;
|
|
}
|
|
|
|
closeSidebar() {
|
|
this.isToggleSidebar = false;
|
|
}
|
|
|
|
onDeactivate() {
|
|
this.ngOnInit();
|
|
}
|
|
}
|
|
|