|
|
@ -1,11 +1,13 @@ |
|
|
import {RouterEvents, SubscriptionService} from '@abp/ng.core'; |
|
|
import { RouterEvents, SubscriptionService } from '@abp/ng.core'; |
|
|
import { ChangeDetectorRef, Injectable } from '@angular/core'; |
|
|
import { ChangeDetectorRef, inject, Injectable } from '@angular/core'; |
|
|
import { fromEvent } from 'rxjs'; |
|
|
import { fromEvent } from 'rxjs'; |
|
|
import { debounceTime } from 'rxjs/operators'; |
|
|
import { debounceTime } from 'rxjs/operators'; |
|
|
import { eThemeBasicComponents } from '../enums'; |
|
|
import { eThemeBasicComponents } from '../enums'; |
|
|
|
|
|
import { DOCUMENT } from '@angular/common'; |
|
|
|
|
|
|
|
|
@Injectable() |
|
|
@Injectable() |
|
|
export class LayoutService { |
|
|
export class LayoutService { |
|
|
|
|
|
document = inject(DOCUMENT); |
|
|
isCollapsed = true; |
|
|
isCollapsed = true; |
|
|
|
|
|
|
|
|
smallScreen!: boolean; // do not set true or false
|
|
|
smallScreen!: boolean; // do not set true or false
|
|
|
@ -16,16 +18,18 @@ export class LayoutService { |
|
|
|
|
|
|
|
|
navItemsComponentKey = eThemeBasicComponents.NavItems; |
|
|
navItemsComponentKey = eThemeBasicComponents.NavItems; |
|
|
|
|
|
|
|
|
constructor(private subscription: SubscriptionService, |
|
|
constructor( |
|
|
private cdRef: ChangeDetectorRef, |
|
|
private subscription: SubscriptionService, |
|
|
routerEvents:RouterEvents) { |
|
|
private cdRef: ChangeDetectorRef, |
|
|
subscription.addOne(routerEvents.getNavigationEvents("End"),() => { |
|
|
routerEvents: RouterEvents, |
|
|
|
|
|
) { |
|
|
|
|
|
subscription.addOne(routerEvents.getNavigationEvents('End'), () => { |
|
|
this.isCollapsed = true; |
|
|
this.isCollapsed = true; |
|
|
}) |
|
|
}); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
private checkWindowWidth() { |
|
|
private checkWindowWidth() { |
|
|
const isSmallScreen = window.innerWidth < 992; |
|
|
const isSmallScreen = this.document.defaultView.innerWidth < 992; |
|
|
if (isSmallScreen && this.smallScreen === false) { |
|
|
if (isSmallScreen && this.smallScreen === false) { |
|
|
this.isCollapsed = false; |
|
|
this.isCollapsed = false; |
|
|
setTimeout(() => { |
|
|
setTimeout(() => { |
|
|
@ -39,7 +43,7 @@ export class LayoutService { |
|
|
subscribeWindowSize() { |
|
|
subscribeWindowSize() { |
|
|
this.checkWindowWidth(); |
|
|
this.checkWindowWidth(); |
|
|
|
|
|
|
|
|
const resize$ = fromEvent(window, 'resize').pipe(debounceTime(150)); |
|
|
const resize$ = fromEvent(this.document.defaultView, 'resize').pipe(debounceTime(150)); |
|
|
this.subscription.addOne(resize$, () => this.checkWindowWidth()); |
|
|
this.subscription.addOne(resize$, () => this.checkWindowWidth()); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|