243 lines
8.2 KiB
HTML
243 lines
8.2 KiB
HTML
<div class="chat-messages" #scrollMe>
|
|
<div
|
|
*ngIf="eventRemain && messages.length > 0"
|
|
class="message-row view-previous"
|
|
>
|
|
<button mat-button (click)="onClickMore($event)" class="bg-accent-dark">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="20"
|
|
height="20"
|
|
viewBox="0 0 20 20"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<circle class="st0" cx="10" cy="10" r="7.3" />
|
|
<polyline class="st0" points="12.9,10 10,7.1 7.1,10 " />
|
|
<line class="st0" x1="10" y1="12.9" x2="10" y2="7.1" />
|
|
</svg>
|
|
<span>{{ 'chat.event.showPreviousEvents' | translate }}</span>
|
|
</button>
|
|
<div
|
|
class="unRead-count"
|
|
*ngIf="
|
|
!!roomInfo &&
|
|
!!firstEventSeq &&
|
|
roomInfo.lastReadEventSeq < firstEventSeq
|
|
"
|
|
>
|
|
<span class="line"></span>
|
|
<span class="count">
|
|
{{
|
|
'chat.event.moreUnreadEventsWith'
|
|
| translate
|
|
: {
|
|
countOfUnread: firstEventSeq - (roomInfo.lastReadEventSeq + 1)
|
|
}
|
|
}}
|
|
</span>
|
|
<span class="line"></span>
|
|
</div>
|
|
<span class="line"></span>
|
|
</div>
|
|
|
|
<!-- MESSAGE -->
|
|
<div
|
|
*ngFor="let message of messages; let i = index"
|
|
class="message-row"
|
|
[id]="message.seq"
|
|
[ngClass]="{
|
|
me: message.senderSeq === loginRes.userSeq,
|
|
contact: message.senderSeq !== loginRes.userSeq,
|
|
searched: getEventSearched(message.seq)
|
|
}"
|
|
>
|
|
<ucap-chat-message-box-read-here
|
|
id="message-box-readhere"
|
|
*ngIf="getReadHere(i) && existReadHere && !clearReadHere"
|
|
class="date-splitter"
|
|
>
|
|
</ucap-chat-message-box-read-here>
|
|
|
|
<ucap-chat-message-box-date-splitter
|
|
*ngIf="getDateSplitter(i)"
|
|
class="date-splitter"
|
|
[message]="message"
|
|
>
|
|
</ucap-chat-message-box-date-splitter>
|
|
|
|
<div class="chat-row">
|
|
<div
|
|
*ngIf="getIsInformation(message); then information; else contents"
|
|
></div>
|
|
<ng-template #information>
|
|
<ng-container
|
|
class="bubble"
|
|
*ngIf="message.type !== EventType.NotificationForTimerRoom"
|
|
[ngSwitch]="message.type"
|
|
>
|
|
<ucap-chat-message-box-information
|
|
*ngSwitchCase="EventType.Join"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-information>
|
|
<ucap-chat-message-box-information
|
|
*ngSwitchCase="EventType.Exit"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-information>
|
|
<ucap-chat-message-box-information
|
|
*ngSwitchCase="EventType.ForcedExit"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-information>
|
|
<ucap-chat-message-box-information
|
|
*ngSwitchCase="EventType.RenameRoom"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-information>
|
|
<ucap-chat-message-box-information
|
|
*ngSwitchCase="EventType.GuideForRoomTimerChanged"
|
|
[message]="message"
|
|
[senderName]="getUserName(message.senderSeq)"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-information>
|
|
</ng-container>
|
|
</ng-template>
|
|
<ng-template #contents>
|
|
<div
|
|
*ngIf="getUserProfile(message.senderSeq) != ''"
|
|
class="profile-img thumbnail-mask"
|
|
>
|
|
<img
|
|
class="avatar"
|
|
ucapImage
|
|
[base]="profileImageRoot"
|
|
[path]="getUserProfile(message.senderSeq)"
|
|
[default]="'assets/images/img_nophoto_50.png'"
|
|
(click)="onClickOpenProfile($event, message.senderSeq)"
|
|
/>
|
|
<!-- <ucap-ui-imaage
|
|
[style]="'width: 50px; height: 50px;'"
|
|
[imageClass]="'avatar'"
|
|
[base]="profileImageRoot"
|
|
[path]="getUserProfile(message.senderSeq)"
|
|
[default]="'assets/images/img_nophoto_50.png'"
|
|
></ucap-ui-imaage> -->
|
|
</div>
|
|
|
|
<div class="message-main">
|
|
<div class="chat-name">
|
|
{{ getUserName(message.senderSeq) }}
|
|
</div>
|
|
|
|
<div class="bubble">
|
|
<ng-container
|
|
class="bubble"
|
|
*ngIf="message.type !== EventType.NotificationForTimerRoom"
|
|
[ngSwitch]="message.type"
|
|
>
|
|
<ucap-chat-message-box-mass
|
|
*ngSwitchCase="EventType.MassText"
|
|
[message]="message"
|
|
(massDetail)="onMassDetail($event)"
|
|
(contextmenu)="onContextMenuMessage($event, message)"
|
|
>
|
|
</ucap-chat-message-box-mass>
|
|
<ucap-chat-message-box-file
|
|
*ngSwitchCase="EventType.File"
|
|
[eventInfoStatus]="eventInfoStatus"
|
|
[message]="message"
|
|
(save)="onSave($event)"
|
|
(fileViewer)="onFileViewer($event)"
|
|
(contextmenu)="onContextMenuMessage($event, message)"
|
|
>
|
|
</ucap-chat-message-box-file>
|
|
<ucap-chat-message-box-sticker
|
|
*ngSwitchCase="EventType.Sticker"
|
|
[message]="message"
|
|
(contextmenu)="onContextMenuMessage($event, message)"
|
|
>
|
|
</ucap-chat-message-box-sticker>
|
|
<ucap-chat-message-box-recall
|
|
*ngSwitchCase="EventType.RecalledMessage"
|
|
></ucap-chat-message-box-recall>
|
|
<ucap-chat-message-box-text
|
|
*ngSwitchCase="EventType.Character"
|
|
[message]="message"
|
|
(contextmenu)="onContextMenuMessage($event, message)"
|
|
>
|
|
</ucap-chat-message-box-text>
|
|
<ucap-chat-message-box-schedule
|
|
*ngSwitchCase="EventType.Plan"
|
|
[message]="message"
|
|
(contextmenu)="onContextMenuMessage($event, message)"
|
|
>
|
|
</ucap-chat-message-box-schedule>
|
|
<ucap-chat-message-box-translation
|
|
*ngSwitchCase="EventType.Translation"
|
|
[message]="message"
|
|
[translationSimpleview]="translationSimpleview"
|
|
[isMe]="message.senderSeq === loginRes.userSeq"
|
|
class="information-msg"
|
|
></ucap-chat-message-box-translation>
|
|
<ucap-chat-message-box-mass-translation
|
|
*ngSwitchCase="EventType.MassTranslation"
|
|
class="information-msg"
|
|
[message]="message"
|
|
[translationSimpleview]="translationSimpleview"
|
|
[isMe]="message.senderSeq === loginRes.userSeq"
|
|
(massTranslationDetail)="onClickMassTranslationDetail($event)"
|
|
>
|
|
</ucap-chat-message-box-mass-translation>
|
|
|
|
<ucap-chat-message-box-allim
|
|
*ngSwitchCase="EventType.AllimTms"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-allim>
|
|
<ucap-chat-message-box-allim
|
|
*ngSwitchCase="EventType.AllimElephant"
|
|
[message]="message"
|
|
class="information-msg"
|
|
>
|
|
</ucap-chat-message-box-allim>
|
|
|
|
<div *ngSwitchDefault>
|
|
<!--
|
|
notice
|
|
<ucap-chat-message-box-notice></ucap-chat-message-box-notice>
|
|
video-conference
|
|
<ucap-chat-message-box-video-conference></ucap-chat-message-box-video-conference>
|
|
|
|
<div class="message">
|
|
{{ message.sentMessage }}
|
|
</div> -->
|
|
{{ message.type }} / {{ message.sentMessage }}
|
|
</div>
|
|
</ng-container>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="time secondary-text">
|
|
<ul>
|
|
<li *ngIf="isShowUnreadCount">{{ getUnreadCount(message) }}</li>
|
|
<li>
|
|
{{ message.sendDate | ucapDate: 'a hh:mm' }}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|
|
</div>
|