From d71100f66f02027e17fb46d14ae04432a0885cab Mon Sep 17 00:00:00 2001 From: leejh Date: Fri, 8 Nov 2019 13:35:39 +0900 Subject: [PATCH] user profile / added prototype --- .../components/left-side.component.html | 1 + .../components/left-side.component.ts | 11 ++- .../left-sidenav/group.component.html | 2 + .../left-sidenav/group.component.ts | 8 ++ .../components/messages.component.html | 1 + .../components/messages.component.ts | 16 +++- .../app/layouts/messenger/dialogs/index.ts | 3 +- .../messenger/dialogs/profile/index.ts | 3 + .../profile/profile.dialog.component.html | 9 ++ .../profile/profile.dialog.component.scss | 0 .../profile/profile.dialog.component.spec.ts | 27 ++++++ .../profile/profile.dialog.component.ts | 83 +++++++++++++++++++ .../components/main.page.component.html | 34 ++++---- .../components/main.page.component.ts | 28 ++++++- .../lib/components/messages.component.html | 1 + .../src/lib/components/messages.component.ts | 21 +++++ .../src/lib/components/profile.component.html | 76 +++++++++++++++++ .../src/lib/components/profile.component.scss | 3 + .../lib/components/profile.component.spec.ts | 28 +++++++ .../src/lib/components/profile.component.ts | 43 ++++++++++ .../components/user-list-item.component.html | 1 + .../components/user-list-item.component.ts | 14 ++++ .../src/lib/ucap-ui-profile.module.ts | 7 +- 23 files changed, 401 insertions(+), 19 deletions(-) create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/index.ts create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.scss create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.spec.ts create mode 100644 projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts create mode 100644 projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html create mode 100644 projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss create mode 100644 projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.spec.ts create mode 100644 projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.ts diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html index 2fcc7e83..71099332 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html @@ -19,6 +19,7 @@ diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.ts index 9b1c15ce..e9b6a2c0 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.ts @@ -1,5 +1,5 @@ import { UserSelectDialogType } from './../../../types/userselect.dialog.type'; -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Output, EventEmitter } from '@angular/core'; import { NGXLogger } from 'ngx-logger'; import { ucapAnimations, DialogService } from '@ucap-webmessenger/ui'; import { @@ -36,6 +36,11 @@ export enum MainMenu { animations: ucapAnimations }) export class LeftSideComponent implements OnInit { + @Output() + openProfile = new EventEmitter< + UserInfo | UserInfoSS | UserInfoF | UserInfoDN + >(); + badgeChatUnReadCount$: Observable; /** 조직도에서 부서원 선택 */ @@ -122,6 +127,10 @@ export class LeftSideComponent implements OnInit { } } + onClickOpenProfile(userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN) { + this.openProfile.emit(userInfo); + } + onSelectedTabChange(event: MatTabChangeEvent) { this.setFabInitial(event.tab.ariaLabel); } diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html index 3d1272ed..a8921446 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.html @@ -62,6 +62,7 @@ [presence]="getStatusBulkInfo(userInfo) | async" [sessionVerinfo]="sessionVerinfo" (click)="onSelectBuddy(userInfo)" + (openProfile)="onClickOpenProfile($event)" (contextmenu)="onContextMenuProfile($event, userInfo)" > @@ -82,6 +83,7 @@ [presence]="getStatusBulkInfo(userInfo) | async" [sessionVerinfo]="sessionVerinfo" (click)="onSelectBuddy(userInfo)" + (openProfile)="onClickOpenProfile($event)" > diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts index 6f316a82..68d5eb52 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts @@ -66,6 +66,10 @@ import { export class GroupComponent implements OnInit, OnDestroy { @Output() newGroupAndMember = new EventEmitter(); + @Output() + openProfile = new EventEmitter< + UserInfo | UserInfoSS | UserInfoF | UserInfoDN + >(); @ViewChild('groupExpansionPanel', { static: true }) groupExpansionPanel: GroupExpansionPanelComponent; @@ -304,6 +308,10 @@ export class GroupComponent implements OnInit, OnDestroy { } } + onClickOpenProfile(userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN) { + this.openProfile.emit(userInfo); + } + onContextMenuProfile( event: MouseEvent, userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html index a8ee55d2..b04ad574 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html @@ -128,6 +128,7 @@ (save)="onSave($event)" (fileViewer)="onFileViewer($event)" (contextMenu)="onContextMenuMessage($event)" + (openProfile)="onClickOpenProfile($event)" > diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts index 7c0eff23..29bb69cb 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts @@ -4,7 +4,9 @@ import { OnDestroy, ViewChild, ElementRef, - AfterViewInit + AfterViewInit, + Output, + EventEmitter } from '@angular/core'; import { ucapAnimations, @@ -89,6 +91,9 @@ import { animations: ucapAnimations }) export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { + @Output() + openProfile = new EventEmitter(); + @ViewChild('messageBoxContainer', { static: true }) private messageBoxContainer: ElementRef; @@ -889,4 +894,13 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { break; } } + + onClickOpenProfile(userInfo: UserInfo) { + if ( + this.roomInfo.roomType !== RoomType.Allim && + this.roomInfo.roomType !== RoomType.Bot + ) { + this.openProfile.emit(userInfo); + } + } } diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts index 1d7719a2..37c9e76f 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/index.ts @@ -1,4 +1,5 @@ import { DIALOGS as CHAT_DIALOGS } from './chat'; import { DIALOGS as GROUP_DIALOGS } from './group'; +import { DIALOGS as PROFILE_DIALOGS } from './profile'; -export const DIALOGS = [...CHAT_DIALOGS, ...GROUP_DIALOGS]; +export const DIALOGS = [...CHAT_DIALOGS, ...GROUP_DIALOGS, ...PROFILE_DIALOGS]; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/index.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/index.ts new file mode 100644 index 00000000..23042bca --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/index.ts @@ -0,0 +1,3 @@ +import { ProfileDialogComponent } from './profile.dialog.component'; + +export const DIALOGS = [ProfileDialogComponent]; diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html new file mode 100644 index 00000000..e906db4c --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.html @@ -0,0 +1,9 @@ + + diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.scss new file mode 100644 index 00000000..e69de29b diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.spec.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.spec.ts new file mode 100644 index 00000000..6f062a23 --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.spec.ts @@ -0,0 +1,27 @@ +/* tslint:disable:no-unused-variable */ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; +import { DebugElement } from '@angular/core'; + +import { ProfileDialogComponent } from './profile.dialog.component'; + +describe('ProfileDialogComponent', () => { + let component: ProfileDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ProfileDialogComponent] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ProfileDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts new file mode 100644 index 00000000..a2e96594 --- /dev/null +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/profile/profile.dialog.component.ts @@ -0,0 +1,83 @@ +import { Component, OnInit, Inject, ViewChild } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; +import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type'; +import { KEY_VER_INFO } from '@app/types/ver-info.type'; +import { SessionStorageService } from '@ucap-webmessenger/web-storage'; + +import { Store, select } from '@ngrx/store'; +import * as AppStore from '@app/store'; +import * as ChatStore from '@app/store/messenger/chat'; + +import { UserInfo } from '@ucap-webmessenger/protocol-sync'; +import { + UserInfoSS, + UserInfoF, + UserInfoDN +} from '@ucap-webmessenger/protocol-query'; +import { DialogService } from '@ucap-webmessenger/ui'; +import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; +import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; +import { map } from 'rxjs/operators'; + +export interface ProfileDialogData { + userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; +} + +export interface ProfileDialogResult {} + +@Component({ + selector: 'app-profile.dialog', + templateUrl: './profile.dialog.component.html', + styleUrls: ['./profile.dialog.component.scss'] +}) +export class ProfileDialogComponent implements OnInit { + loginRes: LoginResponse; + sessionVerinfo: VersionInfo2Response; + isMe: boolean; + isBuddy: boolean; + isFavorit: boolean; + + constructor( + public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: ProfileDialogData, + private dialogService: DialogService, + private sessionStorageService: SessionStorageService, + private store: Store + ) { + this.sessionVerinfo = this.sessionStorageService.get( + KEY_VER_INFO + ); + this.loginRes = this.sessionStorageService.get( + KEY_LOGIN_RES_INFO + ); + } + + ngOnInit() { + this.isMe = this.loginRes.userSeq === this.data.userInfo.seq; + + this.store.pipe( + select(AppStore.MessengerSelector.SyncSelector.selectAllBuddy2), + map(buddyList => { + const users = buddyList.filter( + buddy => buddy.seq === this.data.userInfo.seq + ); + this.isBuddy = users.length > 0; + if (this.isBuddy) { + this.isFavorit = users[0].isFavorit; + } + }) + ); + } + + onClickChat(userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN) { + if (userInfo.seq === this.loginRes.userSeq) { + this.store.dispatch( + ChatStore.openRoom({ userSeqList: [this.loginRes.talkWithMeBotSeq] }) + ); + } else { + this.store.dispatch(ChatStore.openRoom({ userSeqList: [userInfo.seq] })); + } + + this.dialogRef.close(); + } +} diff --git a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html index d0fa9ea0..72e84557 100644 --- a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html +++ b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html @@ -1,23 +1,29 @@
- +
-
- - - -
- +

Auto-resizing sidenav

 +
+ + + +
+