프로필 intro 수정기능 추가.

This commit is contained in:
leejinho 2020-01-20 13:25:59 +09:00
parent 7cc2160145
commit f606f89ded
13 changed files with 162 additions and 55 deletions

View File

@ -16,5 +16,6 @@
(toggleFavorit)="onClickToggleFavorit($event)" (toggleFavorit)="onClickToggleFavorit($event)"
(toggleBuddy)="onClickToggleBuddy($event)" (toggleBuddy)="onClickToggleBuddy($event)"
(uploadProfileImage)="onUploadProfileImage($event)" (uploadProfileImage)="onUploadProfileImage($event)"
(updateIntro)="onUpdateIntro($event)"
> >
</ucap-profile-profile> </ucap-profile-profile>

View File

@ -28,7 +28,7 @@ import {
} from '@ucap-webmessenger/ui'; } from '@ucap-webmessenger/ui';
import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
import { map, take, finalize, catchError } from 'rxjs/operators'; import { map, take, finalize, catchError, tap } from 'rxjs/operators';
import { Subscription, of } from 'rxjs'; import { Subscription, of } from 'rxjs';
import { import {
SelectGroupDialogComponent, SelectGroupDialogComponent,
@ -54,6 +54,7 @@ import { SmsUtils } from '@ucap-webmessenger/daesang';
import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native'; import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native';
import { environment } from '../../../../../environments/environment'; import { environment } from '../../../../../environments/environment';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { UserInfoUpdateType } from '@ucap-webmessenger/protocol-info';
export interface ProfileDialogData { export interface ProfileDialogData {
userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN;
@ -70,6 +71,7 @@ export interface ProfileDialogResult {}
export class ProfileDialogComponent implements OnInit, OnDestroy { export class ProfileDialogComponent implements OnInit, OnDestroy {
userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN; userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN;
loginRes: LoginResponse; loginRes: LoginResponse;
loginResSubscription: Subscription;
sessionVerinfo: VersionInfo2Response; sessionVerinfo: VersionInfo2Response;
environmentsInfo: EnvironmentsInfo; environmentsInfo: EnvironmentsInfo;
authInfo: AuthResponse; authInfo: AuthResponse;
@ -99,9 +101,6 @@ export class ProfileDialogComponent implements OnInit, OnDestroy {
this.sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>( this.sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>(
KEY_VER_INFO KEY_VER_INFO
); );
this.loginRes = this.sessionStorageService.get<LoginResponse>(
KEY_LOGIN_RES_INFO
);
this.environmentsInfo = this.sessionStorageService.get<EnvironmentsInfo>( this.environmentsInfo = this.sessionStorageService.get<EnvironmentsInfo>(
KEY_ENVIRONMENTS_INFO KEY_ENVIRONMENTS_INFO
); );
@ -114,7 +113,24 @@ export class ProfileDialogComponent implements OnInit, OnDestroy {
} }
ngOnInit() { ngOnInit() {
this.isMe = this.loginRes.userSeq === this.data.userInfo.seq; this.loginResSubscription = this.store
.pipe(
select(AppStore.AccountSelector.AuthenticationSelector.loginRes),
tap(loginRes => {
this.loginRes = loginRes;
if (loginRes.userSeq === this.data.userInfo.seq) {
this.isMe = true;
this.userInfo = {
...this.userInfo,
intro: loginRes.userInfo.intro
};
} else {
this.isMe = false;
}
1;
})
)
.subscribe();
this.selectAllBuddy2Subscription = this.store this.selectAllBuddy2Subscription = this.store
.pipe( .pipe(
@ -145,6 +161,9 @@ export class ProfileDialogComponent implements OnInit, OnDestroy {
if (!!this.myDeptUserListSubscription) { if (!!this.myDeptUserListSubscription) {
this.myDeptUserListSubscription.unsubscribe(); this.myDeptUserListSubscription.unsubscribe();
} }
if (!!this.loginResSubscription) {
this.loginResSubscription.unsubscribe();
}
} }
getCheckMyDeptUser() { getCheckMyDeptUser() {
@ -433,4 +452,15 @@ export class ProfileDialogComponent implements OnInit, OnDestroy {
} }
); );
} }
onUpdateIntro(intro: string) {
this.store.dispatch(
AuthenticationStore.infoUser({
req: {
type: UserInfoUpdateType.Intro,
info: intro
}
})
);
}
} }

View File

@ -358,6 +358,7 @@
matInput matInput
#statusMessage1 #statusMessage1
type="text" type="text"
maxlength="5"
[value]="loginRes?.statusMessage1" [value]="loginRes?.statusMessage1"
(click)="$event.stopPropagation()" (click)="$event.stopPropagation()"
@ -383,6 +384,7 @@
matInput matInput
#statusMessage2 #statusMessage2
type="text" type="text"
maxlength="5"
[value]="loginRes?.statusMessage2" [value]="loginRes?.statusMessage2"
(click)="$event.stopPropagation()" (click)="$event.stopPropagation()"
/></span> /></span>
@ -407,6 +409,7 @@
matInput matInput
#statusMessage3 #statusMessage3
type="text" type="text"
maxlength="5"
[value]="loginRes?.statusMessage3" [value]="loginRes?.statusMessage3"
(click)="$event.stopPropagation()" (click)="$event.stopPropagation()"
/></span> /></span>

View File

@ -58,8 +58,11 @@ import { DialogService } from '@ucap-webmessenger/ui';
import { DOCUMENT } from '@angular/common'; import { DOCUMENT } from '@angular/common';
import { MatMenu, MatRadioChange } from '@angular/material'; import { MatMenu, MatRadioChange } from '@angular/material';
import { StatusCode, StatusType } from '@ucap-webmessenger/core'; import { StatusCode, StatusType } from '@ucap-webmessenger/core';
import { StatusInfo } from '@ucap-webmessenger/protocol-status'; import {
import { UserInfoUpdateType } from '@ucap-webmessenger/protocol-info'; StatusInfo,
MessageIndexType,
MessageUpdateRequest
} from '@ucap-webmessenger/protocol-status';
const zoomFactors = [60, 70, 85, 100, 120, 145, 170, 200]; const zoomFactors = [60, 70, 85, 100, 120, 145, 170, 200];
@ -462,29 +465,14 @@ export class TopBarComponent implements OnInit, OnDestroy {
); );
} }
onApplyStatusMessage(index: number, statusMessage: string) { onApplyStatusMessage(index: MessageIndexType, statusMessage: string) {
this.logger.debug('StatusMessage', index, statusMessage); this.logger.debug('StatusMessage', index, statusMessage);
let updateType: UserInfoUpdateType;
switch (index) {
case 1:
updateType = UserInfoUpdateType.StatusMessage1;
break;
case 2:
updateType = UserInfoUpdateType.StatusMessage2;
break;
case 3:
updateType = UserInfoUpdateType.StatusMessage3;
break;
default:
return;
}
this.store.dispatch( this.store.dispatch(
AuthenticationStore.infoUser({ StatusStore.messageUpdate({
req: { type: updateType, info: statusMessage } index,
}) statusMessage
} as MessageUpdateRequest)
); );
} }

View File

@ -9,6 +9,7 @@ import {
UserPasswordSetResponse UserPasswordSetResponse
} from '@ucap-webmessenger/protocol-service'; } from '@ucap-webmessenger/protocol-service';
import { UserRequest, UserResponse } from '@ucap-webmessenger/protocol-info'; import { UserRequest, UserResponse } from '@ucap-webmessenger/protocol-info';
import { MessageUpdateResponse } from '@ucap-webmessenger/protocol-status';
export const webLogin = createAction( export const webLogin = createAction(
'[Account::Authentication] Web Login', '[Account::Authentication] Web Login',
@ -140,3 +141,10 @@ export const infoUserFailure = createAction(
'[Account::Authentication] Info User Failure', '[Account::Authentication] Info User Failure',
props<{ error: any }>() props<{ error: any }>()
); );
export const updateStatusMessageSuccess = createAction(
'[Account::Authentication] Status message update Success',
props<{
res: MessageUpdateResponse;
}>()
);

View File

@ -1,15 +1,16 @@
import { Action, combineReducers, createReducer, on } from '@ngrx/store'; import { createReducer, on } from '@ngrx/store';
import { State, initialState } from './state'; import { initialState } from './state';
import { import {
loginSuccess, loginSuccess,
increaseLoginFailCount, increaseLoginFailCount,
initialLoginFailCount, initialLoginFailCount,
logout,
logoutInitialize, logoutInitialize,
updateLoginRes, updateLoginRes,
infoUserSuccess infoUserSuccess,
updateStatusMessageSuccess
} from './actions'; } from './actions';
import { UserInfoUpdateType } from '@ucap-webmessenger/protocol-info'; import { UserInfoUpdateType } from '@ucap-webmessenger/protocol-info';
import { MessageIndexType } from '@ucap-webmessenger/protocol-status';
export const reducer = createReducer( export const reducer = createReducer(
initialState, initialState,
@ -54,7 +55,11 @@ export const reducer = createReducer(
break; break;
case UserInfoUpdateType.Intro: case UserInfoUpdateType.Intro:
loginRes = { loginRes = {
...loginRes ...loginRes,
userInfo: {
...loginRes.userInfo,
intro: action.res.info
}
}; };
break; break;
case UserInfoUpdateType.TelephoneVisible: case UserInfoUpdateType.TelephoneVisible:
@ -62,22 +67,40 @@ export const reducer = createReducer(
...loginRes ...loginRes
}; };
break; break;
case UserInfoUpdateType.StatusMessage1: default:
break;
}
return {
...state,
loginRes: {
...loginRes
}
};
}),
on(updateStatusMessageSuccess, (state, action) => {
let loginRes = {
...state.loginRes
};
switch (action.res.index) {
case MessageIndexType.First:
loginRes = { loginRes = {
...loginRes, ...loginRes,
statusMessage1: action.res.info statusMessage1: action.res.statusMessage
}; };
break; break;
case UserInfoUpdateType.StatusMessage2: case MessageIndexType.Second:
loginRes = { loginRes = {
...loginRes, ...loginRes,
statusMessage2: action.res.info statusMessage2: action.res.statusMessage
}; };
break; break;
case UserInfoUpdateType.StatusMessage3: case MessageIndexType.Third:
loginRes = { loginRes = {
...loginRes, ...loginRes,
statusMessage3: action.res.info statusMessage3: action.res.statusMessage
}; };
break; break;
default: default:

View File

@ -4,7 +4,8 @@ import {
StatusBulkInfo, StatusBulkInfo,
StatusNotification, StatusNotification,
StatusRequest, StatusRequest,
StatusResponse StatusResponse,
MessageUpdateRequest
} from '@ucap-webmessenger/protocol-status'; } from '@ucap-webmessenger/protocol-status';
export const bulkInfo = createAction( export const bulkInfo = createAction(
@ -46,3 +47,12 @@ export const changeMyIdleCheckTime = createAction(
'[Messenger::Status] Change MyIdleCheckTime', '[Messenger::Status] Change MyIdleCheckTime',
props<{ checkTime: number }>() props<{ checkTime: number }>()
); );
export const messageUpdate = createAction(
'[Messenger::Status] status message update of Others',
props<MessageUpdateRequest>()
);
export const messageUpdateFailure = createAction(
'[Messenger::Status] status message update of Others Failure',
props<{ error: any }>()
);

View File

@ -6,13 +6,16 @@ import { Store } from '@ngrx/store';
import { NGXLogger } from 'ngx-logger'; import { NGXLogger } from 'ngx-logger';
import * as SyncStore from '@app/store/messenger/sync'; import * as SyncStore from '@app/store/messenger/sync';
import * as AuthStore from '@app/store/account/authentication';
import { import {
bulkInfo, bulkInfo,
bulkInfoSuccess, bulkInfoSuccess,
bulkInfoFailure, bulkInfoFailure,
status, status,
statusFailure, statusFailure,
statusSuccess statusSuccess,
messageUpdate,
messageUpdateFailure
} from './actions'; } from './actions';
import { tap, switchMap, map, catchError, exhaustMap } from 'rxjs/operators'; import { tap, switchMap, map, catchError, exhaustMap } from 'rxjs/operators';
import { import {
@ -21,7 +24,8 @@ import {
SSVC_TYPE_STATUS_BULK_INFO_RES, SSVC_TYPE_STATUS_BULK_INFO_RES,
BulkInfoData, BulkInfoData,
StatusBulkInfo, StatusBulkInfo,
StatusResponse StatusResponse,
MessageUpdateResponse
} from '@ucap-webmessenger/protocol-status'; } from '@ucap-webmessenger/protocol-status';
import { of } from 'rxjs'; import { of } from 'rxjs';
@ -102,6 +106,20 @@ export class Effects {
) )
); );
messageUpdate$ = createEffect(() =>
this.actions$.pipe(
ofType(messageUpdate),
exhaustMap(action => {
return this.statusProtocolService.messageUpdate(action).pipe(
map((res: MessageUpdateResponse) => {
return AuthStore.updateStatusMessageSuccess({ res });
}),
catchError(error => of(messageUpdateFailure({ error })))
);
})
)
);
constructor( constructor(
private actions$: Actions, private actions$: Actions,
private store: Store<any>, private store: Store<any>,

View File

@ -1,4 +1,4 @@
import { DeviceType, LocaleCode, StatusCode } from '@ucap-webmessenger/core'; import { StatusCode } from '@ucap-webmessenger/core';
import { import {
ProtocolRequest, ProtocolRequest,
ProtocolResponse, ProtocolResponse,
@ -7,11 +7,9 @@ import {
PacketBodyValue, PacketBodyValue,
ProtocolDecoder, ProtocolDecoder,
ProtocolMessage, ProtocolMessage,
ProtocolNotification,
BodyStringDivider, BodyStringDivider,
decodeProtocolMessage decodeProtocolMessage
} from '@ucap-webmessenger/protocol'; } from '@ucap-webmessenger/protocol';
import { UserInfoUpdateType } from '../types/user-info-update.type';
import { StatusInfo } from '@ucap-webmessenger/protocol-status'; import { StatusInfo } from '@ucap-webmessenger/protocol-status';
export interface StatusRequest extends ProtocolRequest { export interface StatusRequest extends ProtocolRequest {

View File

@ -1,4 +1,4 @@
import { DeviceType, LocaleCode, CallerType } from '@ucap-webmessenger/core'; import { CallerType } from '@ucap-webmessenger/core';
import { import {
ProtocolRequest, ProtocolRequest,
ProtocolResponse, ProtocolResponse,
@ -7,10 +7,8 @@ import {
PacketBodyValue, PacketBodyValue,
ProtocolDecoder, ProtocolDecoder,
ProtocolMessage, ProtocolMessage,
ProtocolNotification,
decodeProtocolMessage decodeProtocolMessage
} from '@ucap-webmessenger/protocol'; } from '@ucap-webmessenger/protocol';
import { UserInfoUpdateType } from '../types/user-info-update.type';
export interface UserOptionResponse extends ProtocolResponse { export interface UserOptionResponse extends ProtocolResponse {
// 타입(s) // 타입(s)
@ -33,18 +31,18 @@ export interface UserOptionUpdateResponse extends ProtocolResponse {
type: CallerType; type: CallerType;
} }
export const encodeUserOptionUpdate: ProtocolEncoder< export const encodeUserOptionUpdate: ProtocolEncoder<UserOptionUpdateRequest> = (
UserOptionUpdateRequest req: UserOptionUpdateRequest
> = (req: UserOptionUpdateRequest) => { ) => {
const bodyList: PacketBody[] = []; const bodyList: PacketBody[] = [];
bodyList.push({ type: PacketBodyValue.String, value: req.type }); bodyList.push({ type: PacketBodyValue.String, value: req.type });
return bodyList; return bodyList;
}; };
export const decodeUserOptionUpdate: ProtocolDecoder< export const decodeUserOptionUpdate: ProtocolDecoder<UserOptionUpdateResponse> = (
UserOptionUpdateResponse message: ProtocolMessage
> = (message: ProtocolMessage) => { ) => {
return decodeProtocolMessage(message, { return decodeProtocolMessage(message, {
type: message.bodyList[0] as CallerType type: message.bodyList[0] as CallerType
} as UserOptionUpdateResponse); } as UserOptionUpdateResponse);

View File

@ -1,4 +1,3 @@
import { DeviceType, LocaleCode } from '@ucap-webmessenger/core';
import { import {
ProtocolRequest, ProtocolRequest,
ProtocolResponse, ProtocolResponse,

View File

@ -63,7 +63,32 @@
<span class="grade">{{ userInfo | ucapTranslate: 'grade' }}</span> <span class="grade">{{ userInfo | ucapTranslate: 'grade' }}</span>
</mat-card-subtitle> </mat-card-subtitle>
<div class="intro">{{ userInfo.intro }}</div> <div class="intro">
<ng-container *ngIf="!isMe">
{{ userInfo.intro }}
</ng-container>
<ng-container *ngIf="!!isMe">
<ucap-inline-edit-input
(apply)="
$event.stopPropagation(); onApplyIntroMessage(introMessage.value)
"
(edit)="$event.stopPropagation()"
(cancel)="$event.stopPropagation()"
class="form-eidt"
>
<span ucapInlineEditInput="view">{{ userInfo.intro }}</span>
<span ucapInlineEditInput="edit"
><input
matInput
#introMessage
type="text"
maxlength="20"
[value]="userInfo.intro"
(click)="$event.stopPropagation()"
/></span>
</ucap-inline-edit-input>
</ng-container>
</div>
<div *ngIf="!isMe" class="profile-option"> <div *ngIf="!isMe" class="profile-option">
<span *ngIf="isBuddy" class="btn-favorite"> <span *ngIf="isBuddy" class="btn-favorite">

View File

@ -66,6 +66,8 @@ export class ProfileComponent implements OnInit {
@Output() @Output()
uploadProfileImage = new EventEmitter<FileUploadItem>(); uploadProfileImage = new EventEmitter<FileUploadItem>();
@Output()
updateIntro = new EventEmitter<string>();
@ViewChild('profileImageFileInput', { static: false }) @ViewChild('profileImageFileInput', { static: false })
profileImageFileInput: ElementRef<HTMLInputElement>; profileImageFileInput: ElementRef<HTMLInputElement>;
@ -129,6 +131,10 @@ export class ProfileComponent implements OnInit {
}); });
} }
onApplyIntroMessage(intro: string) {
this.updateIntro.emit(intro);
}
onChangeFileInput() { onChangeFileInput() {
this.profileImageFileUploadItem = FileUploadItem.fromFiles( this.profileImageFileUploadItem = FileUploadItem.fromFiles(
this.profileImageFileInput.nativeElement.files this.profileImageFileInput.nativeElement.files