ucap/next-ucap-messenger
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

setting of notification is implemented

Browse Source
This commit is contained in:
병준 박 2019-12-20 19:53:08 +09:00
parent 2203e94a4e
commit fb802e0bf3
11 changed files with 143 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -26,7 +26,7 @@
class="setting-category"
></ucap-settings-privacy>
</mat-tab> -->
<!-- <mat-tab>
<mat-tab>
<ng-template mat-tab-label>
<span class="mdi mdi-bell"></span>
알림
@ -36,7 +36,7 @@
(changed)="onChangedNotificationSetting($event)"
class="setting-category"
></ucap-settings-notification>
</mat-tab> -->
</mat-tab>
<!-- <mat-tab>
<ng-template mat-tab-label>
<span class="mdi mdi-headset"></span>

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

@ -48,7 +48,11 @@ export const environment: Environment = {
timezone: 'Asia/Seoul'
},
notification: {
chatMessage: true
use: true,
method: 'SOUND_ALERT',
alertExposureTime: 5,
receiveForMobile: false,
receiveForMessage: false
}
},
CommonSetting: {

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

@ -48,7 +48,11 @@ export const environment: Environment = {
timezone: 'Asia/Seoul'
},
notification: {
chatMessage: true
use: true,
method: 'SOUND_ALERT',
alertExposureTime: 5,
receiveForMobile: false,
receiveForMessage: false
}
},
CommonSetting: {

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

@ -48,7 +48,11 @@ export const environment: Environment = {
timezone: 'Asia/Seoul'
},
notification: {
chatMessage: true
use: true,
method: 'SOUND_ALERT',
alertExposureTime: 5,
receiveForMobile: false,
receiveForMessage: false
}
},
CommonSetting: {

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

@ -48,7 +48,11 @@ export const environment: Environment = {
timezone: 'Asia/Seoul'
},
notification: {
chatMessage: true
use: true,
method: 'SOUND_ALERT',
alertExposureTime: 5,
receiveForMobile: false,
receiveForMessage: false
}
},
CommonSetting: {

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

@ -114,12 +114,15 @@ export class GeneralComponent implements OnInit, OnDestroy {
onChangeAutoStart(event: MatCheckboxChange) {
this.emit({ ...this.setting, autoLaunch: event.checked });
}
onChangeStartupHideWindow(event: MatCheckboxChange) {
this.emit({ ...this.setting, startupHideWindow: event.checked });
}
onChangeContinueRunWhenClose(event: MatCheckboxChange) {
this.emit({ ...this.setting, continueRunWhenClose: event.checked });
}
onChangeAutoLogin(event: MatCheckboxChange) {
this.emit({ ...this.setting, autoLogin: event.checked });
}

112
projects/ucap-webmessenger-ui-settings/src/lib/components/notification.component.html
View File

@ -2,37 +2,54 @@
<mat-list>
<h1 mat-subheader>메시지</h1>
<mat-list-item>
<span class="item-title">채팅 메시지</span>
<span class="item-title">알림 받기</span>
</mat-list-item>
<mat-list-item>
<span class="item-input" fullWidth>
<mat-radio-group
aria-label="Select an option"
[value]="setting.use ? 'true' : 'false'"
(change)="onChangeUse($event)"
>
<mat-radio-button value="true">알림 받음</mat-radio-button>
<mat-radio-button value="false">알림 받지 않음</mat-radio-button>
</mat-radio-group>
</span>
</mat-list-item>
<mat-list-item>
<span class="item-title">알림 방법</span>
<span class="item-input">
<mat-form-field>
<mat-select>
<mat-option value="bannerAndEmail">
배너 및 전자 메일
<mat-select
[value]="setting.method"
(selectionChange)="onSelectionChangeMethod($event)"
>
<mat-option value="SOUND">
소리
</mat-option>
<mat-option value="banner">
배너
<mat-option value="ALERT">
알림창
</mat-option>
<mat-option value="off">
끔
<mat-option value="SOUND_ALERT">
소리 + 알림창
</mat-option>
</mat-select>
</mat-form-field>
</span>
</mat-list-item>
<mat-list-item>
<span class="item-title">내가 시작한 대화에 답장</span>
<span class="item-title">알림창 설정</span>
<span class="item-input">
<mat-form-field>
<mat-select>
<mat-option value="bannerAndEmail">
배너 및 전자 메일
</mat-option>
<mat-option value="banner">
배너
</mat-option>
<mat-option value="off">
끔
</mat-option>
<mat-select
value="{{ setting.alertExposureTime }}"
(selectionChange)="onSelectionChangeAlertExposureTime($event)"
>
<mat-option value="5">5</mat-option>
<mat-option value="10">10</mat-option>
<mat-option value="15">15</mat-option>
<mat-option value="20">20</mat-option>
</mat-select>
</mat-form-field>
</span>
@ -40,41 +57,34 @@
<mat-divider></mat-divider>
<h1 mat-subheader>기타</h1>
<h1 mat-subheader>모바일</h1>
<mat-list-item>
<span class="item-title">알림 소리</span>
<span class="item-input">
<mat-form-field>
<mat-select>
<mat-option value="bannerAndEmail">
모두
</mat-option>
<mat-option value="banner">
통화, 채팅
</mat-option>
<mat-option value="off">
끔
</mat-option>
</mat-select>
</mat-form-field>
</span>
<span class="item-title">모바일 알림</span>
</mat-list-item>
<mat-list-item>
<span class="item-title">부재 중 활동 전자 메일</span>
<span class="item-input">
<mat-form-field>
<mat-select>
<mat-option value="bannerAndEmail">
배너 및 전자 메일
</mat-option>
<mat-option value="banner">
배너
</mat-option>
<mat-option value="off">
끔
</mat-option>
</mat-select>
</mat-form-field>
<span class="item-input" fullWidth>
<mat-checkbox
[checked]="setting.receiveForMobile"
(change)="onChangeReceiveForMobile($event)"
>항상 모바일 알림을 받음</mat-checkbox
>
<br />(해제 시 PC버전이 부재중인 경우에만 모바일 알림을 받음)
</span>
</mat-list-item>
<mat-divider></mat-divider>
<h1 mat-subheader>쪽지</h1>
<mat-list-item>
<span class="item-title">쪽지 알림</span>
</mat-list-item>
<mat-list-item>
<span class="item-input" fullWidth>
<mat-checkbox
[checked]="setting.receiveForMessage"
(change)="onChangeReceiveForMessage($event)"
>쪽지 수신 시 팝업보기</mat-checkbox
>
<br />(해제 시 쪽지 알림만 받음)
</span>
</mat-list-item>
</mat-list>

4
projects/ucap-webmessenger-ui-settings/src/lib/components/notification.component.scss
View File

@ -5,3 +5,7 @@
.item-input {
width: 20rem;
}
.item-input[fullWidth] {
width: 100%;
}

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

@ -1,6 +1,18 @@
import { Component, OnInit, ChangeDetectorRef, Input } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
import {
Component,
OnInit,
ChangeDetectorRef,
Input,
Output,
EventEmitter
} from '@angular/core';
import { NotificationSetting } from '../models/settings';
import {
MatRadioChange,
MatSelectChange,
MatCheckboxChange
} from '@angular/material';
import { NGXLogger } from 'ngx-logger';
@Component({
selector: 'ucap-settings-notification',
@ -11,14 +23,40 @@ export class NotificationComponent implements OnInit {
@Input()
setting: NotificationSetting;
loginForm: FormGroup;
@Output()
changed = new EventEmitter<NotificationSetting>();
constructor(
private formBuilder: FormBuilder,
private changeDetectorRef: ChangeDetectorRef
private changeDetectorRef: ChangeDetectorRef,
private logger: NGXLogger
) {}
ngOnInit() {}
onClickLogin() {}
ngOnInit() {
this.logger.debug('setting', this.setting);
}
onChangeUse(event: MatRadioChange) {
this.emit({ ...this.setting, use: 'true' === event.value ? true : false });
}
onSelectionChangeMethod(event: MatSelectChange) {
this.emit({ ...this.setting, method: event.value });
}
onSelectionChangeAlertExposureTime(event: MatSelectChange) {
this.emit({ ...this.setting, alertExposureTime: event.value });
}
onChangeReceiveForMobile(event: MatCheckboxChange) {
this.emit({ ...this.setting, receiveForMobile: event.checked });
}
onChangeReceiveForMessage(event: MatCheckboxChange) {
this.emit({ ...this.setting, receiveForMessage: event.checked });
}
private emit(setting: NotificationSetting) {
this.setting = setting;
this.changed.emit(this.setting);
}
}

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

@ -10,7 +10,11 @@ export interface GeneralSetting {
}
export interface NotificationSetting {
chatMessage: boolean;
use: boolean;
method: 'SOUND' | 'ALERT' | 'SOUND_ALERT';
alertExposureTime: number;
receiveForMobile: boolean;
receiveForMessage: boolean;
}
export interface Settings {

4
projects/ucap-webmessenger-ui-settings/src/lib/ucap-ui-settings.module.ts
View File

@ -10,6 +10,7 @@ import { MatListModule } from '@angular/material/list';
import { MatSelectModule } from '@angular/material/select';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatTabsModule } from '@angular/material/tabs';
import { MatRadioModule } from '@angular/material/radio';
import { CallComponent } from './components/call.component';
import { DeviceComponent } from './components/device.component';
@ -38,7 +39,8 @@ const SERVICES = [];
MatListModule,
MatSelectModule,
MatSlideToggleModule,
MatTabsModule
MatTabsModule,
MatRadioModule
],
exports: [...COMPONENTS],
declarations: [...COMPONENTS]