import { Component, OnInit, ChangeDetectorRef, Output, EventEmitter, Input, ViewChild } from '@angular/core'; import { MatTabChangeEvent, MatTabGroup, MatCheckboxChange, MatSelectChange } from '@angular/material'; import { GeneralSetting } from '../models/settings'; @Component({ selector: 'ucap-settings-general', templateUrl: './general.component.html', styleUrls: ['./general.component.scss'] }) export class GeneralComponent implements OnInit { @Input() setting: GeneralSetting; @Output() changed = new EventEmitter(); @ViewChild('themeTabGroup', { static: true }) themeTabGroup: MatTabGroup; constructor(private changeDetectorRef: ChangeDetectorRef) {} ngOnInit() { let themeIndex; switch (this.setting.appTheme) { case 'theme-default': themeIndex = 0; break; case 'theme-lgRed': themeIndex = 1; break; default: themeIndex = 0; break; } this.themeTabGroup.selectedIndex = themeIndex; } onSelectedTabChange(e: MatTabChangeEvent) { let theme = 'theme-default'; switch (e.index) { case 0: theme = 'theme-default'; break; case 1: theme = 'theme-lgRed'; break; default: break; } this.emit({ ...this.setting, appTheme: theme }); } onChangeAutoStart(event: MatCheckboxChange) { this.emit({ ...this.setting, autoStart: event.checked }); } onChangeStartBackgroudMode(event: MatCheckboxChange) { this.emit({ ...this.setting, startBackgroudMode: event.checked }); } onChangeContinueRunWhenClose(event: MatCheckboxChange) { this.emit({ ...this.setting, continueRunWhenClose: event.checked }); } onChangeAutoLogin(event: MatCheckboxChange) { this.emit({ ...this.setting, autoLogin: event.checked }); } onSelectionChangeLocale(event: MatSelectChange) { this.emit({ ...this.setting, locale: event.value }); } onSelectionChangeTimezone(event: MatSelectChange) { this.emit({ ...this.setting, timezone: event.value }); } private emit(setting: GeneralSetting) { this.setting = setting; this.changed.emit(this.setting); } }