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

앨범함 이미지 썸네일 처리 로직 수정.

Browse Source 
파일함 나에게 전달, 전달, 삭제 기능 구현.
This commit is contained in:
leejinho 2019-12-09 13:42:40 +09:00
parent 6a3ca4da7b
commit e927163f95
7 changed files with 133 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts
View File

@ -87,10 +87,7 @@ import {
import {
CONST,
FileUtil,
StickerFilesInfo,
StickerUtil,
StickerInfo,
StickerMap
StickerFilesInfo
} from '@ucap-webmessenger/core';
import { PerfectScrollbarComponent } from 'ngx-perfect-scrollbar';
import { StatusCode } from '@ucap-webmessenger/api';

20
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.html
View File

@ -99,25 +99,21 @@
>
<span class="mdi mdi-spin mdi-loading mdi-48px"></span>
</div>
<img
#thumbImg
[src]="getThumbnailUrl(fileInfo)"
[matTooltip]="fileInfo.info.name"
(error)="onErrorThumbnail(thumbImg, fileInfo)"
/>
<!-- <div
<div
*ngIf="
!!fileInfo.eventInfo &&
!!fileInfo.eventInfo.sentMessageJson &&
!!fileInfo.eventInfo.sentMessageJson.thumbUrl;
!!fileInfo.info &&
!!fileInfo.info.sentMessageJson &&
!!fileInfo.info.sentMessageJson.thumbUrl;
then thumb;
else icon
"
></div>
<ng-template #thumb>
<img
[src]="fileInfo.eventInfo.sentMessageJson.thumbUrl"
#thumbImg
[src]="fileInfo.info.sentMessageJson.thumbUrl"
[matTooltip]="fileInfo.info.name"
(error)="onErrorThumbnail(thumbImg, fileInfo)"
/>
</ng-template>
<ng-template #icon>
@ -130,7 +126,7 @@
>
<div class="ico"></div>
</div>
</ng-template> -->
</ng-template>
</dt>
<dd>
<span class="checkbox">

27
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.ts
View File

@ -28,7 +28,6 @@ import { _MODULE_CONFIG } from 'projects/ucap-webmessenger-api-common/src/lib/co
export interface FileInfoTotal {
info: FileInfo;
checkInfo: FileDownloadInfo[];
eventInfo?: Info<FileEventJson>;
fileDownloadItem: FileDownloadItem;
}
@ -89,14 +88,11 @@ export class AlbumBoxComponent implements OnInit, OnDestroy {
select(
AppStore.MessengerSelector.EventSelector.selectAllFileInfoCheckList
)
),
this.store.pipe(
select(AppStore.MessengerSelector.EventSelector.selectAllInfoList)
)
])
.pipe(
tap(() => (this.fileInfoTotal = [])),
tap(([roomInfo, fileInfoList, fileInfoCheckList, eventList]) => {
tap(([roomInfo, fileInfoList, fileInfoCheckList]) => {
this.fileInfoList = fileInfoList.filter(fileInfo => {
if (
fileInfo.roomSeq === roomInfo.roomSeq &&
@ -110,17 +106,11 @@ export class AlbumBoxComponent implements OnInit, OnDestroy {
});
this.fileInfoList.map(fileInfo => {
const events = eventList.filter(
event => event.seq === fileInfo.eventSeq
);
this.fileInfoTotal.push({
info: fileInfo,
checkInfo: fileInfoCheckList.filter(
checkInfo => checkInfo.seq === fileInfo.seq
),
eventInfo:
events.length > 0 ? (events[0] as Info<FileEventJson>) : null,
fileDownloadItem: new FileDownloadItem()
});
});
@ -153,21 +143,6 @@ export class AlbumBoxComponent implements OnInit, OnDestroy {
);
}
getThumbnailUrl(fileInfo: FileInfoTotal): string {
if (
!!fileInfo.eventInfo &&
!!fileInfo.eventInfo.sentMessageJson &&
!!fileInfo.eventInfo.sentMessageJson.thumbUrl
) {
return fileInfo.eventInfo.sentMessageJson.thumbUrl;
} else {
return `${this.thumbBaseUrl}${fileInfo.info.url.replace(
'/AttFile/',
'/WebFile/'
)}.thumb.jpg`;
}
}
onErrorThumbnail(el: HTMLElement, fileInfo: FileInfoTotal): void {
const iconEl = document.createElement('div');
iconEl.setAttribute(

3
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html
View File

@ -103,6 +103,7 @@
stroke-width="1.5"
stroke-linecap="butt"
stroke-linejoin="round"
(click)="onClickForwardMe(selectedFile)"
>
<path
d="M5.52 19c.64-2.2 1.84-3 3.22-3h6.52c1.38 0 2.58.8 3.22 3"
@ -122,6 +123,7 @@
stroke-width="1.5"
stroke-linecap="butt"
stroke-linejoin="round"
(click)="onClickForward(selectedFile)"
>
<g fill="none" fill-rule="evenodd">
<path
@ -141,6 +143,7 @@
stroke-width="1.5"
stroke-linecap="butt"
stroke-linejoin="round"
(click)="onClickDelete(selectedFile)"
>
<path d="M20 11.08V8l-6-6H6a2 2 0 0 0-2 2v16c0 1.1.9 2 2 2h6" />
<path d="M14 3v5h5M15.88 20.12l4.24-4.24M15.88 15.88l4.24 4.24" />

105
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.ts
View File

@ -9,6 +9,7 @@ import { Subscription, combineLatest } from 'rxjs';
import { Store, select } from '@ngrx/store';
import * as AppStore from '@app/store';
import * as EventStore from '@app/store/messenger/event';
import { tap, map, take, finalize } from 'rxjs/operators';
import { FileUtil, MimeUtil, DeviceType } from '@ucap-webmessenger/core';
import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
@ -17,8 +18,22 @@ import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type';
import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native';
import { NGXLogger } from 'ngx-logger';
import { FileDownloadItem } from '@ucap-webmessenger/api';
import { SnackBarService } from '@ucap-webmessenger/ui';
import {
SnackBarService,
DialogService,
ConfirmDialogComponent,
ConfirmDialogResult,
ConfirmDialogData
} from '@ucap-webmessenger/ui';
import { CommonApiService } from '@ucap-webmessenger/api-common';
import { EventType } from '@ucap-webmessenger/protocol-event';
import {
CreateChatDialogComponent,
CreateChatDialogResult,
CreateChatDialogData
} from '../../dialogs/chat/create-chat.dialog.component';
import { UserSelectDialogType } from '@app/types';
import { RoomInfo } from '@ucap-webmessenger/protocol-room';
export interface FileInfoTotal {
info: FileInfo;
@ -38,6 +53,7 @@ export class FileBoxComponent implements OnInit, OnDestroy {
fileInfoTotal: FileInfoTotal[];
fileInfoList: FileInfo[];
fileInfoListSubscription: Subscription;
roomInfo: RoomInfo;
selectedFile: FileInfoTotal;
selectedFileList: FileInfoTotal[] = [];
@ -55,6 +71,7 @@ export class FileBoxComponent implements OnInit, OnDestroy {
private commonApiService: CommonApiService,
private snackBarService: SnackBarService,
@Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService,
private dialogService: DialogService,
private logger: NGXLogger
) {
this.loginRes = this.sessionStorageService.get<LoginResponse>(
@ -77,6 +94,8 @@ export class FileBoxComponent implements OnInit, OnDestroy {
.pipe(
tap(() => (this.fileInfoTotal = [])),
tap(([roomInfo, fileInfoList, fileInfoCheckList]) => {
this.roomInfo = roomInfo;
this.fileInfoList = fileInfoList.filter(fileInfo => {
if (
fileInfo.roomSeq === roomInfo.roomSeq &&
@ -294,4 +313,88 @@ export class FileBoxComponent implements OnInit, OnDestroy {
this.logger.error(reason);
});
}
onClickForwardMe(fileInfo: FileInfoTotal) {
this.store.dispatch(
EventStore.forward({
senderSeq: this.loginRes.userSeq,
req: {
roomSeq: '-999',
eventType: EventType.File,
sentMessage: fileInfo.info.sentMessage
},
trgtUserSeqs: [this.loginRes.talkWithMeBotSeq]
})
);
}
async onClickForward(fileInfo: FileInfoTotal) {
const result = await this.dialogService.open<
CreateChatDialogComponent,
CreateChatDialogData,
CreateChatDialogResult
>(CreateChatDialogComponent, {
width: '600px',
data: {
type: UserSelectDialogType.MessageForward,
title: 'MessageForward',
ignoreRoom: [this.roomInfo]
}
});
if (!!result && !!result.choice && result.choice) {
const userSeqs: number[] = [];
let roomSeq = '';
if (!!result.selectedUserList && result.selectedUserList.length > 0) {
result.selectedUserList.map(user => userSeqs.push(user.seq));
}
if (!!result.selectedRoom) {
roomSeq = result.selectedRoom.roomSeq;
}
if (userSeqs.length > 0 || roomSeq.trim().length > 0) {
this.store.dispatch(
EventStore.forward({
senderSeq: this.loginRes.userSeq,
req: {
roomSeq: '-999',
eventType: EventType.File,
sentMessage: fileInfo.info.sentMessage
},
trgtUserSeqs: userSeqs,
trgtRoomSeq: roomSeq
})
);
}
}
}
async onClickDelete(fileInfo: FileInfoTotal) {
const result = await this.dialogService.open<
ConfirmDialogComponent,
ConfirmDialogData,
ConfirmDialogResult
>(ConfirmDialogComponent, {
width: '400px',
data: {
title: 'Delete',
html: `선택한 파일(메시지)를 삭제하시겠습니까?<br/>삭제된 파일(메시지)는 내 대화방에서만 적용되며 상대방의 대화방에서는 삭제되지 않습니다.`
}
});
if (!!result && !!result.choice && result.choice) {
this.store.dispatch(
EventStore.del({
roomSeq: this.roomInfo.roomSeq,
eventSeq: fileInfo.info.eventSeq
})
);
this.fileInfoTotal = this.fileInfoTotal.filter(
fInfo => fInfo.info.seq !== fileInfo.info.seq
);
this.onSelectedIndexChange(this.currentTabIndex);
}
}
}

5
projects/ucap-webmessenger-protocol-file/src/lib/models/file-info.ts
View File

@ -1,4 +1,5 @@
import { FileType } from '../types/file.type';
import { FileEventJson } from '@ucap-webmessenger/protocol-event';
export interface FileInfo {
// 대화방SEQ
@ -23,4 +24,8 @@ export interface FileInfo {
receivedUserCount: number;
// 수신자수
receiverCount: number;
// 발신내용
sentMessage: string;
// 발신내용 For Json
sentMessageJson?: FileEventJson;
}

12
projects/ucap-webmessenger-protocol-file/src/lib/protocols/info.ts
View File

@ -13,6 +13,11 @@ import {
import { FileType } from '../types/file.type';
import { FileInfo } from '../models/file-info';
import { FileDownloadInfo } from '../models/file-download-info';
import {
decodeEventJson,
EventType,
FileEventJson
} from '@ucap-webmessenger/protocol-event';
export interface InfoRequest extends ProtocolRequest {
// 대화방SEQ(s)
@ -65,7 +70,12 @@ export const decodeInfoData: ProtocolDecoder<InfoData> = (
size: info[7],
sendDate: info[8],
receivedUserCount: Number(info[9]),
receiverCount: Number(info[10])
receiverCount: Number(info[10]),
sentMessage: info[11],
sentMessageJson: decodeEventJson(
EventType.File,
info[11]
) as FileEventJson
});
});