import { Component, OnInit, ViewChild, OnDestroy, Inject } from '@angular/core'; import { MatPaginator, MatTableDataSource, MatSort } from '@angular/material'; import { FileInfo, FileDownloadInfo, FileType } from '@ucap-webmessenger/protocol-file'; import { Subscription, combineLatest } from 'rxjs'; import { Store, select } from '@ngrx/store'; import * as AppStore from '@app/store'; import { tap, map, take, finalize } from 'rxjs/operators'; import { FileUtil, MimeUtil, DeviceType } from '@ucap-webmessenger/core'; 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'; 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 { CommonApiService } from '@ucap-webmessenger/api-common'; export interface FileInfoTotal { info: FileInfo; checkInfo: FileDownloadInfo[]; fileDownloadItem: FileDownloadItem; } @Component({ selector: 'app-layout-chat-right-drawer-file-box', templateUrl: './file-box.component.html', styleUrls: ['./file-box.component.scss'] }) export class FileBoxComponent implements OnInit, OnDestroy { displayedColumns: string[] = ['check', 'name', 'sendDate']; dataSource = new MatTableDataSource(); fileInfoTotal: FileInfoTotal[]; fileInfoList: FileInfo[]; fileInfoListSubscription: Subscription; selectedFile: FileInfoTotal; selectedFileList: FileInfoTotal[] = []; loginRes: LoginResponse; currentTabIndex = 0; @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator; @ViewChild(MatSort, { static: true }) sort: MatSort; constructor( private store: Store, private sessionStorageService: SessionStorageService, private commonApiService: CommonApiService, private snackBarService: SnackBarService, @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService, private logger: NGXLogger ) { this.loginRes = this.sessionStorageService.get( KEY_LOGIN_RES_INFO ); } 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 ) ) ]) .pipe( tap(() => (this.fileInfoTotal = [])), tap(([roomInfo, fileInfoList, fileInfoCheckList]) => { 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 ), fileDownloadItem: new FileDownloadItem() }); }); this.onSelectedIndexChange(this.currentTabIndex); }) ) .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: return item.info[property]; } }; 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); } 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 ); } } 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); if (data.length === 0) { return false; } 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); 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; } onClickDownload(fileInfo: FileInfoTotal) { this.commonApiService .fileTalkDownload({ userSeq: this.loginRes.userSeq, deviceType: DeviceType.PC, 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) { this.snackBarService.open( `파일이 경로[${result}]에 저장되었습니다.`, '', { duration: 3000, verticalPosition: 'bottom' } ); } else { this.snackBarService.open('파일 저장에 실패하였습니다.'); } }) .catch(reason => { this.snackBarService.open('파일 저장에 실패하였습니다.'); }); }) .catch(reason => { this.logger.error('download', reason); }); }), finalize(() => { setTimeout(() => { fileInfo.fileDownloadItem.downloadingProgress$ = undefined; }, 1000); }) ) .subscribe(); } onClickDownloadAll(): void { this.selectedFileList.forEach(fileInfo => { this.onClickDownload(fileInfo); }); } onClickOpenDownloadFolder(): void { this.nativeService .openDefaultDownloadFolder() .then(result => { if (!!result) { } else { throw new Error('response Error'); } }) .catch(reason => { this.logger.error(reason); }); } }