perfect scrollbar of messeages is added

This commit is contained in:
병준 박 2019-10-29 11:39:34 +09:00
parent 43d96eb477
commit 22605ae51e
3 changed files with 30 additions and 30 deletions

View File

@ -70,6 +70,7 @@
<!-- Timer Room Info -->
<!-- CHAT MESSAGES -->
<perfect-scrollbar fxFlex="1 1 auto" #psChatContent>
<ucap-chat-messages
[messages]="eventList$ | async"
[userInfos]="userInfoList"
@ -81,6 +82,7 @@
(contextMenu)="onContextMenuMessage($event)"
>
</ucap-chat-messages>
</perfect-scrollbar>
<!-- CHAT MESSAGES -->
<div

View File

@ -45,7 +45,7 @@ $line-basic:1px solid #dddddd;
.room-name {
font-size: 16px;
padding: 0 10px;
@include ellipsis(1)
@include ellipsis(1);
}
.room-option {
width: 100px;

View File

@ -55,6 +55,7 @@ import {
ImageViewerDialogResult
} from '@app/layouts/common/dialogs/image-viewer.dialog.component';
import { Maximum_Range } from '@ucap-webmessenger/core';
import { PerfectScrollbarComponent } from 'ngx-perfect-scrollbar';
@Component({
selector: 'app-layout-messenger-messages',
@ -70,6 +71,9 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewChecked {
messageContextMenuTrigger: MatMenuTrigger;
messageContextMenuPosition = { x: '0px', y: '0px' };
@ViewChild('psChatContent', { static: true })
psChatContent: PerfectScrollbarComponent;
environmentsInfo: EnvironmentsInfo;
loginRes: LoginResponse;
@ -143,7 +147,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewChecked {
select(AppStore.MessengerSelector.EventSelector.selectAllInfoList)
);
this.scrollToBottomForMessageBoxContainer();
this.psChatContent.directiveRef.scrollToBottom(0, 0);
}
ngOnDestroy(): void {
@ -159,7 +163,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewChecked {
}
ngAfterViewChecked(): void {
this.scrollToBottomForMessageBoxContainer();
this.psChatContent.directiveRef.scrollToBottom(0, 0);
}
getRoomName() {
@ -220,12 +224,6 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewChecked {
this.store.dispatch(RoomStore.updateOnlyAlarm({ roomInfo: this.roomInfo }));
}
private scrollToBottomForMessageBoxContainer(): void {
try {
this.messageBoxContainer.nativeElement.scrollTop = this.messageBoxContainer.nativeElement.scrollHeight;
} catch (err) {}
}
/** MassText Detail View */
onMassDetail(value: number) {
this.store.dispatch(