2019-12-04 16:37:19 +09:00
|
|
|
import { Component, OnInit, ViewChild, OnDestroy, Inject } from '@angular/core';
|
2019-11-12 14:08:14 +09:00
|
|
|
import { MatPaginator, MatTableDataSource, MatSort } from '@angular/material';
|
|
|
|
import {
|
|
|
|
FileInfo,
|
|
|
|
FileDownloadInfo,
|
2019-11-14 08:30:59 +09:00
|
|
|
FileType
|
2019-11-12 14:08:14 +09:00
|
|
|
} from '@ucap-webmessenger/protocol-file';
|
|
|
|
import { Subscription, combineLatest } from 'rxjs';
|
|
|
|
import { Store, select } from '@ngrx/store';
|
|
|
|
|
|
|
|
import * as AppStore from '@app/store';
|
2019-12-09 13:42:40 +09:00
|
|
|
import * as EventStore from '@app/store/messenger/event';
|
2019-12-06 13:35:31 +09:00
|
|
|
import { tap, map, take, finalize } from 'rxjs/operators';
|
|
|
|
import { FileUtil, MimeUtil, DeviceType } from '@ucap-webmessenger/core';
|
2019-11-12 17:10:11 +09:00
|
|
|
import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
|
|
|
|
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
|
|
|
|
import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type';
|
2019-12-04 16:37:19 +09:00
|
|
|
import { NativeService, UCAP_NATIVE_SERVICE } from '@ucap-webmessenger/native';
|
|
|
|
import { NGXLogger } from 'ngx-logger';
|
2019-12-05 17:42:13 +09:00
|
|
|
import { FileDownloadItem } from '@ucap-webmessenger/api';
|
2019-12-09 13:42:40 +09:00
|
|
|
import {
|
|
|
|
SnackBarService,
|
|
|
|
DialogService,
|
|
|
|
ConfirmDialogComponent,
|
|
|
|
ConfirmDialogResult,
|
2019-12-20 16:30:22 +09:00
|
|
|
ConfirmDialogData,
|
|
|
|
DateOptions
|
2019-12-09 13:42:40 +09:00
|
|
|
} from '@ucap-webmessenger/ui';
|
2019-12-06 13:35:31 +09:00
|
|
|
import { CommonApiService } from '@ucap-webmessenger/api-common';
|
2019-12-09 13:42:40 +09:00
|
|
|
import { EventType } from '@ucap-webmessenger/protocol-event';
|
|
|
|
import {
|
|
|
|
CreateChatDialogComponent,
|
|
|
|
CreateChatDialogResult,
|
|
|
|
CreateChatDialogData
|
|
|
|
} from '../../dialogs/chat/create-chat.dialog.component';
|
2020-01-03 17:35:34 +09:00
|
|
|
import {
|
|
|
|
UserSelectDialogType,
|
|
|
|
EnvironmentsInfo,
|
|
|
|
KEY_ENVIRONMENTS_INFO
|
|
|
|
} from '@app/types';
|
2019-12-09 13:42:40 +09:00
|
|
|
import { RoomInfo } from '@ucap-webmessenger/protocol-room';
|
2020-01-06 17:05:36 +09:00
|
|
|
import { TranslateService } from '@ngx-translate/core';
|
2019-11-12 14:08:14 +09:00
|
|
|
|
|
|
|
export interface FileInfoTotal {
|
|
|
|
info: FileInfo;
|
|
|
|
checkInfo: FileDownloadInfo[];
|
2019-12-05 17:42:13 +09:00
|
|
|
fileDownloadItem: FileDownloadItem;
|
2019-11-12 14:08:14 +09:00
|
|
|
}
|
2019-11-11 14:31:26 +09:00
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-layout-chat-right-drawer-file-box',
|
|
|
|
templateUrl: './file-box.component.html',
|
2019-11-14 08:30:59 +09:00
|
|
|
styleUrls: ['./file-box.component.scss']
|
2019-11-11 14:31:26 +09:00
|
|
|
})
|
2019-11-12 14:08:14 +09:00
|
|
|
export class FileBoxComponent implements OnInit, OnDestroy {
|
2019-11-14 08:30:59 +09:00
|
|
|
displayedColumns: string[] = ['check', 'name', 'sendDate'];
|
2019-11-12 14:08:14 +09:00
|
|
|
dataSource = new MatTableDataSource<FileInfoTotal>();
|
|
|
|
|
|
|
|
fileInfoTotal: FileInfoTotal[];
|
|
|
|
fileInfoList: FileInfo[];
|
|
|
|
fileInfoListSubscription: Subscription;
|
2019-12-09 13:42:40 +09:00
|
|
|
roomInfo: RoomInfo;
|
2019-11-12 14:08:14 +09:00
|
|
|
|
|
|
|
selectedFile: FileInfoTotal;
|
|
|
|
selectedFileList: FileInfoTotal[] = [];
|
|
|
|
|
2019-11-12 17:10:11 +09:00
|
|
|
loginRes: LoginResponse;
|
2020-01-03 17:35:34 +09:00
|
|
|
environmentsInfo: EnvironmentsInfo;
|
2019-11-12 17:10:11 +09:00
|
|
|
|
|
|
|
currentTabIndex = 0;
|
|
|
|
|
2019-11-12 14:08:14 +09:00
|
|
|
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
|
|
|
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
|
|
|
|
2019-11-12 17:10:11 +09:00
|
|
|
constructor(
|
|
|
|
private store: Store<any>,
|
2019-12-04 16:37:19 +09:00
|
|
|
private sessionStorageService: SessionStorageService,
|
2019-12-06 13:35:31 +09:00
|
|
|
private commonApiService: CommonApiService,
|
2020-01-06 17:05:36 +09:00
|
|
|
private translateService: TranslateService,
|
2019-12-06 13:35:31 +09:00
|
|
|
private snackBarService: SnackBarService,
|
2019-12-04 16:37:19 +09:00
|
|
|
@Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService,
|
2019-12-09 13:42:40 +09:00
|
|
|
private dialogService: DialogService,
|
2019-12-05 17:42:13 +09:00
|
|
|
private logger: NGXLogger
|
2019-11-12 17:10:11 +09:00
|
|
|
) {
|
|
|
|
this.loginRes = this.sessionStorageService.get<LoginResponse>(
|
|
|
|
KEY_LOGIN_RES_INFO
|
|
|
|
);
|
2020-01-03 17:35:34 +09:00
|
|
|
this.environmentsInfo = this.sessionStorageService.get<EnvironmentsInfo>(
|
|
|
|
KEY_ENVIRONMENTS_INFO
|
|
|
|
);
|
2019-11-12 17:10:11 +09:00
|
|
|
}
|
2019-11-12 14:08:14 +09:00
|
|
|
|
|
|
|
ngOnInit() {
|
|
|
|
this.fileInfoListSubscription = combineLatest([
|
|
|
|
this.store.pipe(select(AppStore.MessengerSelector.RoomSelector.roomInfo)),
|
|
|
|
this.store.pipe(
|
|
|
|
select(AppStore.MessengerSelector.EventSelector.selectAllFileInfoList)
|
|
|
|
),
|
|
|
|
this.store.pipe(
|
|
|
|
select(
|
|
|
|
AppStore.MessengerSelector.EventSelector.selectAllFileInfoCheckList
|
|
|
|
)
|
2019-11-14 08:30:59 +09:00
|
|
|
)
|
2019-11-12 14:08:14 +09:00
|
|
|
])
|
|
|
|
.pipe(
|
|
|
|
tap(() => (this.fileInfoTotal = [])),
|
|
|
|
tap(([roomInfo, fileInfoList, fileInfoCheckList]) => {
|
2019-12-09 13:42:40 +09:00
|
|
|
this.roomInfo = roomInfo;
|
|
|
|
|
2019-11-12 14:08:14 +09:00
|
|
|
this.fileInfoList = fileInfoList.filter(fileInfo => {
|
|
|
|
if (
|
|
|
|
fileInfo.roomSeq === roomInfo.roomSeq &&
|
|
|
|
(fileInfo.type === FileType.File ||
|
|
|
|
fileInfo.type === FileType.Sound)
|
|
|
|
) {
|
|
|
|
return true;
|
|
|
|
} else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
this.fileInfoList.map(fileInfo => {
|
|
|
|
this.fileInfoTotal.push({
|
|
|
|
info: fileInfo,
|
|
|
|
checkInfo: fileInfoCheckList.filter(
|
|
|
|
checkInfo => checkInfo.seq === fileInfo.seq
|
2019-12-05 17:42:13 +09:00
|
|
|
),
|
|
|
|
fileDownloadItem: new FileDownloadItem()
|
2019-11-12 14:08:14 +09:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2019-11-12 17:10:11 +09:00
|
|
|
this.onSelectedIndexChange(this.currentTabIndex);
|
2019-11-12 14:08:14 +09:00
|
|
|
})
|
|
|
|
)
|
|
|
|
.subscribe();
|
|
|
|
|
|
|
|
this.dataSource.sortingDataAccessor = (item, property) => {
|
|
|
|
switch (property) {
|
|
|
|
case 'name':
|
|
|
|
return item.info.name;
|
|
|
|
case 'size':
|
|
|
|
return item.info.size;
|
|
|
|
case 'sendDate':
|
|
|
|
return item.info.sendDate;
|
|
|
|
default:
|
2019-11-14 08:30:59 +09:00
|
|
|
return item.info[property];
|
2019-11-12 14:08:14 +09:00
|
|
|
}
|
|
|
|
};
|
|
|
|
this.dataSource.sort = this.sort;
|
|
|
|
this.dataSource.paginator = this.paginator;
|
|
|
|
}
|
|
|
|
|
|
|
|
ngOnDestroy(): void {
|
|
|
|
if (!!this.fileInfoListSubscription) {
|
|
|
|
this.fileInfoListSubscription.unsubscribe();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
getExtention(name: string): string {
|
|
|
|
return FileUtil.getExtension(name);
|
|
|
|
}
|
|
|
|
|
2019-11-12 17:10:11 +09:00
|
|
|
onSelectedIndexChange(index: number) {
|
|
|
|
this.selectedFile = null;
|
|
|
|
this.currentTabIndex = index;
|
|
|
|
if (this.currentTabIndex === 0) {
|
|
|
|
// Receive
|
|
|
|
this.dataSource.data = this.fileInfoTotal.filter(
|
|
|
|
fileInfo => fileInfo.info.senderSeq !== this.loginRes.userSeq
|
|
|
|
);
|
|
|
|
} else {
|
|
|
|
// send
|
|
|
|
this.dataSource.data = this.fileInfoTotal.filter(
|
|
|
|
fileInfo => fileInfo.info.senderSeq === this.loginRes.userSeq
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-11-12 14:08:14 +09:00
|
|
|
getCheckAllUser() {
|
|
|
|
const data = this.dataSource
|
|
|
|
.sortData(this.dataSource.data, this.sort)
|
|
|
|
.filter((u, i) => i >= this.paginator.pageSize * this.paginator.pageIndex)
|
|
|
|
.filter((u, i) => i < this.paginator.pageSize);
|
2019-11-21 15:35:06 +09:00
|
|
|
|
|
|
|
if (data.length === 0) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
2019-11-12 14:08:14 +09:00
|
|
|
if (
|
|
|
|
data.filter(
|
|
|
|
dInfo =>
|
|
|
|
this.selectedFileList.filter(
|
|
|
|
fileInfo => fileInfo.info.seq === dInfo.info.seq
|
|
|
|
).length === 0
|
|
|
|
).length > 0
|
|
|
|
) {
|
|
|
|
return false;
|
|
|
|
} else {
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
onCheckAllkUser(value: boolean) {
|
|
|
|
const data = this.dataSource
|
|
|
|
.sortData(this.dataSource.data, this.sort)
|
|
|
|
.filter((u, i) => i >= this.paginator.pageSize * this.paginator.pageIndex)
|
|
|
|
.filter((u, i) => i < this.paginator.pageSize);
|
2019-11-11 14:31:26 +09:00
|
|
|
|
2019-11-12 14:08:14 +09:00
|
|
|
if (!!data && data.length > 0) {
|
|
|
|
if (value) {
|
|
|
|
this.selectedFileList.push(
|
|
|
|
...data.filter(dInfo =>
|
|
|
|
this.selectedFileList.filter(
|
|
|
|
fileInfo => fileInfo.info.seq !== dInfo.info.seq
|
|
|
|
)
|
|
|
|
)
|
|
|
|
);
|
|
|
|
} else {
|
|
|
|
this.selectedFileList = this.selectedFileList.filter(
|
|
|
|
fileInfo =>
|
|
|
|
!(
|
|
|
|
data.filter(dInfo => dInfo.info.seq === fileInfo.info.seq)
|
|
|
|
.length > 0
|
|
|
|
)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
getCheckUser(fileInfo: FileInfoTotal) {
|
|
|
|
if (this.selectedFileList) {
|
|
|
|
if (
|
|
|
|
this.selectedFileList.filter(
|
|
|
|
info => info.info.seq === fileInfo.info.seq
|
|
|
|
).length > 0
|
|
|
|
) {
|
|
|
|
return true;
|
|
|
|
} else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
onCheckUser(value: boolean, fileInfo: FileInfoTotal) {
|
|
|
|
if (value) {
|
|
|
|
this.selectedFileList.push(fileInfo);
|
|
|
|
} else {
|
|
|
|
this.selectedFileList = this.selectedFileList.filter(
|
|
|
|
info => info.info.seq !== fileInfo.info.seq
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
onClickRow(row: FileInfoTotal) {
|
|
|
|
this.selectedFile = row;
|
|
|
|
}
|
2019-12-04 16:37:19 +09:00
|
|
|
|
2019-12-06 13:35:31 +09:00
|
|
|
onClickDownload(fileInfo: FileInfoTotal) {
|
|
|
|
this.commonApiService
|
|
|
|
.fileTalkDownload({
|
|
|
|
userSeq: this.loginRes.userSeq,
|
2020-01-03 17:35:34 +09:00
|
|
|
deviceType: this.environmentsInfo.deviceType,
|
2019-12-06 13:35:31 +09:00
|
|
|
token: this.loginRes.tokenString,
|
|
|
|
attachmentsSeq: fileInfo.info.seq,
|
|
|
|
fileDownloadItem: fileInfo.fileDownloadItem
|
|
|
|
})
|
|
|
|
.pipe(
|
|
|
|
take(1),
|
|
|
|
map(async rawBlob => {
|
|
|
|
const mimeType = MimeUtil.getMimeFromExtension(
|
|
|
|
FileUtil.getExtension(fileInfo.info.name)
|
|
|
|
);
|
|
|
|
const blob = rawBlob.slice(0, rawBlob.size, mimeType);
|
|
|
|
|
|
|
|
FileUtil.fromBlobToBuffer(blob)
|
|
|
|
.then(buffer => {
|
|
|
|
this.nativeService
|
|
|
|
.saveFile(buffer, fileInfo.info.name, mimeType)
|
|
|
|
.then(result => {
|
|
|
|
if (!!result) {
|
2020-01-06 17:05:36 +09:00
|
|
|
this.translateService
|
|
|
|
.get('common.file.savedToPath', {
|
2020-01-06 18:05:34 +09:00
|
|
|
path: result
|
2020-01-06 17:05:36 +09:00
|
|
|
})
|
|
|
|
.pipe(take(1))
|
|
|
|
.subscribe(v => {
|
|
|
|
this.snackBarService.open(v, '', {
|
|
|
|
duration: 3000,
|
|
|
|
verticalPosition: 'bottom'
|
|
|
|
});
|
|
|
|
});
|
2019-12-06 13:35:31 +09:00
|
|
|
} else {
|
2020-01-06 17:05:36 +09:00
|
|
|
this.translateService
|
|
|
|
.get('common.file.failToSave')
|
|
|
|
.pipe(take(1))
|
|
|
|
.subscribe(v => {
|
|
|
|
this.snackBarService.open(v);
|
|
|
|
});
|
2019-12-06 13:35:31 +09:00
|
|
|
}
|
|
|
|
})
|
|
|
|
.catch(reason => {
|
2020-01-06 17:05:36 +09:00
|
|
|
this.translateService
|
|
|
|
.get('common.file.failToSave')
|
|
|
|
.pipe(take(1))
|
|
|
|
.subscribe(v => {
|
|
|
|
this.snackBarService.open(v);
|
|
|
|
});
|
2019-12-06 13:35:31 +09:00
|
|
|
});
|
|
|
|
})
|
|
|
|
.catch(reason => {
|
|
|
|
this.logger.error('download', reason);
|
|
|
|
});
|
|
|
|
}),
|
|
|
|
finalize(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
fileInfo.fileDownloadItem.downloadingProgress$ = undefined;
|
|
|
|
}, 1000);
|
|
|
|
})
|
|
|
|
)
|
|
|
|
.subscribe();
|
|
|
|
}
|
|
|
|
|
2019-12-05 17:42:13 +09:00
|
|
|
onClickDownloadAll(): void {
|
2019-12-06 13:35:31 +09:00
|
|
|
this.selectedFileList.forEach(fileInfo => {
|
|
|
|
this.onClickDownload(fileInfo);
|
|
|
|
});
|
2019-12-05 17:42:13 +09:00
|
|
|
}
|
|
|
|
|
2019-12-04 16:37:19 +09:00
|
|
|
onClickOpenDownloadFolder(): void {
|
|
|
|
this.nativeService
|
|
|
|
.openDefaultDownloadFolder()
|
|
|
|
.then(result => {
|
|
|
|
if (!!result) {
|
|
|
|
} else {
|
|
|
|
throw new Error('response Error');
|
|
|
|
}
|
|
|
|
})
|
|
|
|
.catch(reason => {
|
2019-12-05 17:42:13 +09:00
|
|
|
this.logger.error(reason);
|
2019-12-04 16:37:19 +09:00
|
|
|
});
|
|
|
|
}
|
2019-12-09 13:42:40 +09:00
|
|
|
|
|
|
|
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]
|
|
|
|
})
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2020-01-06 17:05:36 +09:00
|
|
|
onClickForward(fileInfo: FileInfoTotal) {
|
|
|
|
this.translateService
|
|
|
|
.get('chat.forwardFileTo')
|
|
|
|
.pipe(take(1))
|
|
|
|
.subscribe(async v => {
|
|
|
|
const result = await this.dialogService.open<
|
|
|
|
CreateChatDialogComponent,
|
|
|
|
CreateChatDialogData,
|
|
|
|
CreateChatDialogResult
|
|
|
|
>(CreateChatDialogComponent, {
|
|
|
|
width: '600px',
|
|
|
|
data: {
|
|
|
|
type: UserSelectDialogType.MessageForward,
|
|
|
|
title: v,
|
|
|
|
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
|
|
|
|
})
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
2019-12-09 13:42:40 +09:00
|
|
|
}
|
|
|
|
|
2020-01-06 17:05:36 +09:00
|
|
|
onClickDelete(fileInfo: FileInfoTotal) {
|
|
|
|
this.translateService
|
|
|
|
.get('chat.confirmDeleteFile')
|
|
|
|
.pipe(take(1))
|
|
|
|
.subscribe(async v => {
|
|
|
|
const result = await this.dialogService.open<
|
|
|
|
ConfirmDialogComponent,
|
|
|
|
ConfirmDialogData,
|
|
|
|
ConfirmDialogResult
|
|
|
|
>(ConfirmDialogComponent, {
|
|
|
|
width: '400px',
|
|
|
|
data: {
|
|
|
|
title: 'Delete',
|
|
|
|
html: v
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
if (!!result && !!result.choice && result.choice) {
|
|
|
|
this.store.dispatch(
|
|
|
|
EventStore.del({
|
|
|
|
roomSeq: this.roomInfo.roomSeq,
|
|
|
|
eventSeq: fileInfo.info.eventSeq
|
|
|
|
})
|
|
|
|
);
|
2019-12-09 13:42:40 +09:00
|
|
|
|
2020-01-06 17:05:36 +09:00
|
|
|
this.fileInfoTotal = this.fileInfoTotal.filter(
|
|
|
|
fInfo => fInfo.info.seq !== fileInfo.info.seq
|
|
|
|
);
|
|
|
|
this.onSelectedIndexChange(this.currentTabIndex);
|
|
|
|
}
|
|
|
|
});
|
2019-12-09 13:42:40 +09:00
|
|
|
}
|
2019-12-20 16:30:22 +09:00
|
|
|
|
|
|
|
get fileRetentionPeriodOptions(): DateOptions {
|
|
|
|
return {
|
|
|
|
manipulate: { amount: this.loginRes.fileRetentionPeriod, unit: 'days' }
|
|
|
|
};
|
|
|
|
}
|
2019-11-21 15:35:06 +09:00
|
|
|
}
|