settings is modified

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/settings/messenger-settings.dialog.component.html

@@ -13,10 +13,11 @@
 
           <ucap-settings-general
             class="setting-category general"
-            (selectTheme)="onSelectTheme($event)"
+            [setting]="appUserInfo.settings.general"
+            (changed)="onChangedGeneralSetting($event)"
           ></ucap-settings-general>
         </mat-tab>
-        <mat-tab>
+        <!-- <mat-tab>
           <ng-template mat-tab-label>
             <span class="mdi mdi-lock"></span>
             개인정보취급방침
@@ -24,17 +25,19 @@
           <ucap-settings-privacy
             class="setting-category"
           ></ucap-settings-privacy>
-        </mat-tab>
+        </mat-tab> -->
-        <mat-tab>
+        <!-- <mat-tab>
           <ng-template mat-tab-label>
             <span class="mdi mdi-bell"></span>
             알림
           </ng-template>
           <ucap-settings-notification
+            [setting]="appUserInfo.settings.notification"
+            (changed)="onChangedNotificationSetting($event)"
             class="setting-category"
           ></ucap-settings-notification>
-        </mat-tab>
+        </mat-tab> -->
-        <mat-tab>
+        <!-- <mat-tab>
           <ng-template mat-tab-label>
             <span class="mdi mdi-headset"></span>
             장치
@@ -56,7 +59,7 @@
             통화
           </ng-template>
           <ucap-settings-call class="setting-category"></ucap-settings-call>
-        </mat-tab>
+        </mat-tab> -->
       </mat-tab-group>
 
       <!-- <div class="left-side-tabs-body">

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/settings/messenger-settings.dialog.component.ts

@@ -1,7 +1,10 @@
 import { Component, OnInit, Inject, Renderer2 } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 import { KEY_LOGIN_RES_INFO, KEY_VER_INFO } from '@app/types';
-import { SessionStorageService } from '@ucap-webmessenger/web-storage';
+import {
+  SessionStorageService,
+  LocalStorageService
+} from '@ucap-webmessenger/web-storage';
 
 import { Store } from '@ngrx/store';
 
@@ -10,6 +13,13 @@ import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
 import { map } from 'rxjs/operators';
 import { DOCUMENT } from '@angular/common';
+import { AppUserInfo, KEY_APP_USER_INFO } from '@app/types/app-user-info.type';
+import { environment } from '../../../../../environments/environment';
+import {
+  GeneralSetting,
+  Settings,
+  NotificationSetting
+} from '@ucap-webmessenger/ui-settings';
 
 export interface MessengerSettingsDialogData {}
 
@@ -23,6 +33,7 @@ export interface MessengerSettingsDialogResult {}
 export class MessengerSettingsDialogComponent implements OnInit {
   loginRes: LoginResponse;
   sessionVerinfo: VersionInfo2Response;
+  appUserInfo: AppUserInfo;
 
   constructor(
     public dialogRef: MatDialogRef<
@@ -32,10 +43,16 @@ export class MessengerSettingsDialogComponent implements OnInit {
     @Inject(MAT_DIALOG_DATA) public data: MessengerSettingsDialogData,
     private dialogService: DialogService,
     private sessionStorageService: SessionStorageService,
+    private localStorageService: LocalStorageService,
     private store: Store<any>,
     @Inject(DOCUMENT) private document: Document,
     private renderer2: Renderer2
   ) {
+    this.appUserInfo = this.localStorageService.encGet<AppUserInfo>(
+      KEY_APP_USER_INFO,
+      environment.customConfig.appKey
+    );
+
     this.sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>(
       KEY_VER_INFO
     );
@@ -46,11 +63,32 @@ export class MessengerSettingsDialogComponent implements OnInit {
 
   ngOnInit() {}
 
-  onSelectTheme(theme: string): void {
+  onChangedGeneralSetting(setting: GeneralSetting) {
-    this.renderer2.setAttribute(this.document.body, 'class', theme);
+    if (this.appUserInfo.settings.general.appTheme !== setting.appTheme) {
+      this.renderer2.setAttribute(
+        this.document.body,
+        'class',
+        setting.appTheme
+      );
+    }
+    this.applySettings({ ...this.appUserInfo.settings, general: setting });
+  }
+
+  onChangedNotificationSetting(setting: NotificationSetting) {
+    this.applySettings({ ...this.appUserInfo.settings, notification: setting });
   }
 
   onClickChoice(choice: boolean): void {
     this.dialogRef.close({});
   }
+
+  private applySettings(settings: Settings) {
+    this.appUserInfo.settings = settings;
+
+    this.localStorageService.encSet<AppUserInfo>(
+      KEY_APP_USER_INFO,
+      this.appUserInfo,
+      environment.customConfig.appKey
+    );
+  }
 }

projects/ucap-webmessenger-app/src/app/services/authentication.service.ts

@@ -50,20 +50,31 @@ export class AppAuthenticationService {
       loginPw: encLoginPw
     });
 
-    if (rememberMe || autoLogin) {
+    let appUserInfo = this.localStorageService.encGet<AppUserInfo>(
-      this.localStorageService.encSet<AppUserInfo>(
+      KEY_APP_USER_INFO,
-        KEY_APP_USER_INFO,
+      environment.customConfig.appKey
-        {
+    );
-          ...loginInfo,
+
-          loginPw: autoLogin ? loginInfo.loginPw : undefined,
+    if (!appUserInfo) {
-          rememberMe,
+      appUserInfo = {
-          autoLogin
+        settings: environment.productConfig.defaultSettings
-        },
+      };
-        environment.customConfig.appKey
-      );
-    } else {
-      this.localStorageService.remove(KEY_LOGIN_INFO);
     }
+
+    if (rememberMe || autoLogin) {
+      appUserInfo = {
+        ...appUserInfo,
+        loginPw: autoLogin ? loginInfo.loginPw : undefined,
+        rememberMe,
+        autoLogin
+      };
+    }
+
+    this.localStorageService.encSet<AppUserInfo>(
+      KEY_APP_USER_INFO,
+      appUserInfo,
+      environment.customConfig.appKey
+    );
   }
 
   logout() {

projects/ucap-webmessenger-app/src/app/types/app-user-info.type.ts

@@ -1,4 +1,5 @@
 import { LocaleCode } from '@ucap-webmessenger/core';
+import { Settings } from '@ucap-webmessenger/ui-settings';
 
 export const KEY_APP_USER_INFO = 'ucap::APP_USER_INFO';
 
@@ -10,4 +11,6 @@ export interface AppUserInfo {
   companyCode?: string;
   companyGroupType?: string;
   localeCode?: LocaleCode;
+
+  settings?: Settings;
 }

projects/ucap-webmessenger-app/src/environments/environment.daesang.dev.ts

@@ -33,6 +33,20 @@ export const environment: Environment = {
     updateCheckConfig: {
       deviceType: DeviceType.Renderer,
       intervalHour: 1
+    },
+    defaultSettings: {
+      general: {
+        appTheme: 'theme-default',
+        autoLogin: false,
+        autoStart: true,
+        continueRunWhenClose: true,
+        locale: 'ko',
+        startBackgroudMode: false,
+        timezone: '+9'
+      },
+      notification: {
+        chatMessage: true
+      }
     }
   },
 

projects/ucap-webmessenger-app/src/environments/environment.daesang.prod.ts

@@ -33,6 +33,20 @@ export const environment: Environment = {
     updateCheckConfig: {
       deviceType: DeviceType.Renderer,
       intervalHour: 1
+    },
+    defaultSettings: {
+      general: {
+        appTheme: 'theme-default',
+        autoLogin: false,
+        autoStart: true,
+        continueRunWhenClose: true,
+        locale: 'ko',
+        startBackgroudMode: false,
+        timezone: '+9'
+      },
+      notification: {
+        chatMessage: true
+      }
     }
   },
 

projects/ucap-webmessenger-app/src/environments/environment.dev.ts

@@ -33,6 +33,20 @@ export const environment: Environment = {
     updateCheckConfig: {
       deviceType: DeviceType.Renderer,
       intervalHour: 1
+    },
+    defaultSettings: {
+      general: {
+        appTheme: 'theme-default',
+        autoLogin: false,
+        autoStart: true,
+        continueRunWhenClose: true,
+        locale: 'ko',
+        startBackgroudMode: false,
+        timezone: '+9'
+      },
+      notification: {
+        chatMessage: true
+      }
     }
   },
 

projects/ucap-webmessenger-app/src/environments/environment.prod.ts

@@ -33,6 +33,20 @@ export const environment: Environment = {
     updateCheckConfig: {
       deviceType: DeviceType.Renderer,
       intervalHour: 1
+    },
+    defaultSettings: {
+      general: {
+        appTheme: 'theme-default',
+        autoLogin: false,
+        autoStart: true,
+        continueRunWhenClose: true,
+        locale: 'ko',
+        startBackgroudMode: false,
+        timezone: '+9'
+      },
+      notification: {
+        chatMessage: true
+      }
     }
   },
 

projects/ucap-webmessenger-app/src/environments/environment.type.ts

@@ -27,6 +27,7 @@ import {
   UpdateCheckConfig
 } from '@ucap-webmessenger/native';
 import { DeviceType } from '@ucap-webmessenger/core';
+import { Settings } from '@ucap-webmessenger/ui-settings';
 
 export type UCapRuntime = 'browser' | 'electron';
 
@@ -55,6 +56,7 @@ export interface Environment {
       deviceType: DeviceType;
       intervalHour: number;
     };
+    defaultSettings: Settings;
   };
 
   customConfig?: any;

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.html

@@ -13,6 +13,7 @@
     </ul>-->
     <mat-list-item class="theme-select">
       <mat-tab-group
+        #themeTabGroup
         mat-stretch-tabs
         animationDuration="0ms"
         (selectedTabChange)="onSelectedTabChange($event)"
@@ -38,20 +39,36 @@
 
     <h1 mat-subheader>응용 프로그램</h1>
     <mat-list-item>
-      <mat-checkbox>응용 프로그램 자동 시작</mat-checkbox>
+      <mat-checkbox
+        [checked]="setting.autoStart"
+        (change)="onChangeAutoStart($event)"
+        >응용 프로그램 자동 시작</mat-checkbox
+      >
     </mat-list-item>
     <mat-list-item>
-      <mat-checkbox>백그라운드에서 응용 프로그램 열기</mat-checkbox>
+      <mat-checkbox
+        [checked]="setting.startBackgroudMode"
+        (change)="onChangeStartBackgroudMode($event)"
+        >백그라운드에서 응용 프로그램 열기</mat-checkbox
+      >
     </mat-list-item>
     <mat-list-item>
-      <mat-checkbox>닫을 시 응용 프로그램을 계속 실행</mat-checkbox>
+      <mat-checkbox
+        [checked]="setting.continueRunWhenClose"
+        (change)="onChangeContinueRunWhenClose($event)"
+        >닫을 시 응용 프로그램을 계속 실행</mat-checkbox
+      >
     </mat-list-item>
 
     <mat-divider></mat-divider>
 
     <h1 mat-subheader>로그인</h1>
     <mat-list-item>
-      <mat-checkbox>실행 시 자동 로그인</mat-checkbox>
+      <mat-checkbox
+        [checked]="setting.autoLogin"
+        (change)="onChangeAutoLogin($event)"
+        >실행 시 자동 로그인</mat-checkbox
+      >
     </mat-list-item>
 
     <mat-divider></mat-divider>
@@ -59,11 +76,14 @@
     <h1 mat-subheader>언어</h1>
     <mat-list-item>
       <mat-form-field fxFlexFill>
-        <mat-select>
+        <mat-select
-          <mat-option value="ko-KR">
+          [value]="setting.locale"
+          (selectionChange)="onSelectionChangeLocale($event)"
+        >
+          <mat-option value="ko">
             한국어 (대한민국)
           </mat-option>
-          <mat-option value="en-US">
+          <mat-option value="en">
             영어 (미국)
           </mat-option>
         </mat-select>
@@ -75,7 +95,10 @@
     <h1 mat-subheader>시간대</h1>
     <mat-list-item>
       <mat-form-field fxFlexFill>
-        <mat-select>
+        <mat-select
+          [value]="setting.timezone"
+          (selectionChange)="onSelectionChangeTimezone($event)"
+        >
           <mat-option value="ko-KR">
             한국어 (대한민국)
           </mat-option>

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.ts

@@ -3,10 +3,17 @@ import {
   OnInit,
   ChangeDetectorRef,
   Output,
-  EventEmitter
+  EventEmitter,
+  Input,
+  ViewChild
 } from '@angular/core';
-import { FormGroup, FormBuilder } from '@angular/forms';
+import {
-import { MatTabChangeEvent } from '@angular/material';
+  MatTabChangeEvent,
+  MatTabGroup,
+  MatCheckboxChange,
+  MatSelectChange
+} from '@angular/material';
+import { GeneralSetting } from '../models/settings';
 
 @Component({
   selector: 'ucap-settings-general',
@@ -14,17 +21,32 @@ import { MatTabChangeEvent } from '@angular/material';
   styleUrls: ['./general.component.scss']
 })
 export class GeneralComponent implements OnInit {
-  loginForm: FormGroup;
+  @Input()
+  setting: GeneralSetting;
 
   @Output()
-  selectTheme = new EventEmitter<string>();
+  changed = new EventEmitter<GeneralSetting>();
 
-  constructor(
+  @ViewChild('themeTabGroup', { static: true })
-    private formBuilder: FormBuilder,
+  themeTabGroup: MatTabGroup;
-    private changeDetectorRef: ChangeDetectorRef
-  ) {}
 
-  ngOnInit() {}
+  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';
@@ -39,8 +61,32 @@ export class GeneralComponent implements OnInit {
         break;
     }
 
-    this.selectTheme.emit(theme);
+    this.emit({ ...this.setting, appTheme: theme });
   }
 
-  onClickLogin() {}
+  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);
+  }
 }

projects/ucap-webmessenger-ui-settings/src/lib/components/notification.component.ts

@@ -1,5 +1,6 @@
-import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
+import { Component, OnInit, ChangeDetectorRef, Input } from '@angular/core';
 import { FormGroup, FormBuilder } from '@angular/forms';
+import { NotificationSetting } from '../models/settings';
 
 @Component({
   selector: 'ucap-settings-notification',
@@ -7,6 +8,9 @@ import { FormGroup, FormBuilder } from '@angular/forms';
   styleUrls: ['./notification.component.scss']
 })
 export class NotificationComponent implements OnInit {
+  @Input()
+  setting: NotificationSetting;
+
   loginForm: FormGroup;
 
   constructor(

projects/ucap-webmessenger-ui-settings/src/lib/models/settings.ts

@@ -0,0 +1,18 @@
+export interface GeneralSetting {
+  appTheme: string;
+  autoStart: boolean;
+  startBackgroudMode: boolean;
+  continueRunWhenClose: boolean;
+  autoLogin: boolean;
+  locale: string;
+  timezone: string;
+}
+
+export interface NotificationSetting {
+  chatMessage: boolean;
+}
+
+export interface Settings {
+  general: GeneralSetting;
+  notification: NotificationSetting;
+}

projects/ucap-webmessenger-ui-settings/src/public-api.ts

@@ -3,5 +3,6 @@
  */
 
 export * from './lib/components/general.component';
+export * from './lib/models/settings';
 
 export * from './lib/ucap-ui-settings.module';