toggle-settings-button.component.ts 1022 B

1234567891011121314151617181920212223242526272829303132333435363738
  1. import { Component } from '@angular/core';
  2. import { NbSidebarService } from '@nebular/theme';
  3. import { StateService } from '../../../@core/utils';
  4. @Component({
  5. selector: 'ngx-toggle-settings-button',
  6. styleUrls: ['./toggle-settings-button.component.scss'],
  7. template: `
  8. <button class="toggle-settings"
  9. (click)="toggleSettings()"
  10. [class.expanded]="expanded"
  11. [class.sidebar-end]="sidebarEnd"
  12. [class.was-expanded]="wasExpanded"
  13. >
  14. <i class="nb-gear"></i>
  15. </button>
  16. `,
  17. })
  18. export class ToggleSettingsButtonComponent {
  19. sidebarEnd = false;
  20. expanded = false;
  21. wasExpanded = false;
  22. constructor(private sidebarService: NbSidebarService, protected stateService: StateService) {
  23. this.stateService.onSidebarState()
  24. .subscribe(({id}) => {
  25. this.sidebarEnd = id === 'end';
  26. });
  27. }
  28. toggleSettings() {
  29. this.sidebarService.toggle(false, 'settings-sidebar');
  30. this.expanded = !this.expanded;
  31. this.wasExpanded = true;
  32. }
  33. }