peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 04:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

show rooms

Browse Source
This commit is contained in:
Peter Maquiran
2024-06-05 10:28:38 +01:00
parent 39f89a92a5
commit 2e9492db68
10 changed files with 144 additions and 272 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/shared/chat/messages/messages.page.html
+18 -198
View File
@@ -1,11 +1,11 @@
<ion-header class="ion-no-border">
<ion-toolbar class="header-toolbar">
<div class="main-header">
<ion-header class="ion-no-border" >
<ion-toolbar class="header-toolbar" >
<div class="main-header" *ngIf="roomData$ | async as roomData">
<div class="header-top">
<div class="middle">
<ion-label class="title">{{ ChatSystemService.getDmRoom(this.roomId).name }}</ion-label>
<div class="middle" >
<ion-label class="title"> {{ roomData.roomName }}</ion-label>
<!-- <button (click)="ChatMessageDebuggingPage()">Dev</button> -->
<span><ion-icon *ngIf="RochetChatConnectorService.isLogin" class="{{ ChatSystemService.getDmRoom(this.roomId).online }}" name="ellipse"></ion-icon></span>
<span><ion-icon *ngIf="RochetChatConnectorService.isLogin" class="online" name="ellipse"></ion-icon></span>
</div>
<div hidden class="right">
<button title="Menu" class="btn-no-color" (click)="_openMessagesOptions()">
@@ -28,192 +28,18 @@
</ion-toolbar>
</ion-header>
<ion-content>
<ion-content >
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<div class="messages" #scrollMe>
<ion-list>
<ion-list *ngIf="roomData$ | async as roomData">
<!-- <div (click)=" ChatSystemService.getDmRoom(this.roomId).deleteAll()">delete all</div> -->
<div class="messages-list-item-wrapper container-width-100"
*ngFor="let msg of ChatSystemService.getDmRoom(roomId).messages; index as i; let last = last" >
<div [class.dateLabel]="msg.dateLabel" class='message-item incoming-{{msg.u.username!=sessionStore.user.UserName}} max-width-45' *ngIf="msg.msg !=''" >
<div class="message-item-options d-flex justify-content-end" *ngIf="!msg.dateLabel">
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
</fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu>
</div>
<div class="title d-flex" *ngIf="!msg.dateLabel">
<ion-label >{{msg.u.name}}</ion-label>
<span class="time">{{msg.time}}</span>
</div>
<div class="d-block justify-space-between">
<pre *ngIf="msg.delate == false" class="message-box text ma-0 font-13-rem" style="font-size: 0.8125rem !important;" >{{msg.msg}}</pre>
<!-- <ion-label *ngIf="msg.delate == false" class="message-box">{{msg.msg}} </ion-label> -->
<ion-label *ngIf="msg.delate == true" class="flex-0">Apagou a mensagem</ion-label>
<ion-label class="float-status-all float-status" *ngIf="msg.u.username==sessionStore.user.UserName">
<span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
<!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
<span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
<div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
</ion-label>
{{last ? scrollToBottom() : ''}}
</div>
</div>
<div *ngIf="msg.file && msg.delate == false">
<div class='message-item incoming-{{msg.u.username!=sessionStore.user.UserName}} max-width-45'
*ngIf="msg.file.type != 'application/meeting'">
<div class="message-item-options d-flex justify-content-end">
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
</fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu>
</div>
<div class="title d-flex">
<ion-label >{{msg.u.name}}</ion-label>
<span class="time">{{msg.time}}</span>
</div>
<div>
<div *ngIf="msg.attachments" class="message-attachments">
<div *ngFor="let file of msg.attachments">
<div *ngIf="msg.file.type == 'application/img'" (click)="openPreview(msg)" dfsdvsvs>
<div *ngIf="!msg.attachments[0].image_url">
<ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
<ion-icon name="image" class="file-icon"></ion-icon>
<ion-label>{{"Imagem"}}</ion-label>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.downloadLoader == false && msg.uploadingFile == false && msg.downloadAttachmentsTemp == 0" class="icon-download" src="assets/icon/theme/{{ThemeService.currentTheme}}/icons-download.svg" slot="end"></ion-icon>
<ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
<ion-icon *ngIf="msg.downloadAttachments == false && msg.downloadAttachmentsTemp >= 1 && msg.downloadLoader == false" src="assets/images/retry-svgrepo-com.svg" class="icon-download font-12"> </ion-icon>
</ion-item>
</div>
<img *ngIf="msg.attachments[0].image_url" src={{msg.attachments[0].image_url}} alt="image" class="d-block">
<ion-label class="float-status-all float-status" *ngIf="msg.u.username==sessionStore.user.UserName">
<span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
<!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
<span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
<div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
</ion-label>
</div>
<div *ngIf="msg.file.type != 'application/img'">
<div *ngIf="msg.file.type != 'application/audio'" class="file add-attachment-bg-color">
<div (click)="openPreview(msg)" class="file-details add-ellipsis cursor-pointer" *ngIf="msg.file">
<div *ngIf="!msg.attachments[0].image_url">
<ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
<ion-icon *ngIf="msg.attachments[0].type != 'webtrix'" name="document" class="file-icon"></ion-icon>
<ion-icon *ngIf="msg.attachments[0].type == 'webtrix'" src="assets/icon/webtrix.svg" class="file-icon"></ion-icon>
<ion-label>{{ file.title}}</ion-label>
<ion-icon *ngIf="ThemeService.currentTheme == 'default' && msg.attachments[0].type != 'webtrix' && !( msg.downloadLoader == true || msg.uploadingFile == true ) " class="icon-download" src="assets/icon/theme/default/icons-download.svg" slot="end"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.attachments[0].type != 'webtrix' && !( msg.downloadLoader == true || msg.uploadingFile == true ) " class="icon-download" src="assets/icon/theme/gov/icons-download.svg" slot="end"></ion-icon>
<ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
</ion-item>
</div>
<div *ngIf="msg.attachments[0].image_url">
<span *ngIf="msg.file.type">
<fa-icon *ngIf="msg.file.type == 'application/pdf'" icon="file-pdf" class="pdf-icon"></fa-icon>
<fa-icon *ngIf="msg.file.type == 'application/word'" icon="file-word" class="word-icon">
</fa-icon>
<fa-icon *ngIf="msg.file.type == 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'" icon="file-word" class="word-icon"></fa-icon>
<fa-icon
*ngIf="msg.file.type == 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'"
icon="file-word" class="excel-icon"></fa-icon>
<ion-icon *ngIf="msg.file.type == 'application/webtrix'" src="assets/icon/webtrix.svg">
</ion-icon>
<ion-icon *ngIf="msg.file.type == 'application/meeting'" src="assets/icon/webtrix.svg">
</ion-icon>
</span>
<ion-label class="file-title">{{file.title}}</ion-label>
</div>
</div>
</div>
<div (click)="audioPreview(msg)" class="audio-contentainer" *ngIf="msg.file.type == 'application/audio' && !file.title_link">
<ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
<ion-icon name="mic-outline" class="file-icon"></ion-icon>
<ion-label>{{'Mensagem de voz'}}</ion-label>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.downloadLoader == false && msg.uploadingFile == false && msg.downloadAttachmentsTemp == 0" class="icon-download" src="assets/icon/theme/{{ThemeService.currentTheme}}/icons-download.svg" slot="end"></ion-icon>
<ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
<ion-icon *ngIf="msg.downloadAttachments == false && msg.downloadAttachmentsTemp >= 1 && msg.downloadLoader == false" src="assets/images/retry-svgrepo-com.svg" class="icon-download font-12"> </ion-icon>
</ion-item>
</div>
<div class="audio-contentainer" *ngIf="msg.file.type == 'application/audio' && file.title_link">
<audio [src]="file.title_link|safehtml" preload="metadata" class="flex-grow-1" controls controlsList="nodownload noplaybackrate"></audio>
</div>
<div class="file-details-optional add-attachment-bg-color">
<ion-label *ngIf="msg.file">
<span *ngIf="file.description">{{file.description}}</span>
<span *ngIf="file.description && msg.file.type != 'application/webtrix'"> • </span>
</ion-label>
<ion-label class="float-status-all float-status" *ngIf="msg.u.username==sessionStore.user.UserName">
<span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
<!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
<!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
<span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
<div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
</ion-label>
</div>
</div>
</div>
</div>
{{last ? scrollToBottom() : ''}}
</div>
</div>
<div class="info-meeting" *ngIf="msg.file.type == 'application/meeting'">
<ion-label *ngIf="msg.delate == true" class="info-meeting-small">Apagou a mensagem</ion-label><br />
<ion-label *ngIf="msg.delate == false" class="info-meeting-small">{{msg.u.name}} criou esta reunião</ion-label><br />
<button *ngIf="msg.delate == false" (click)="goToEvent(msg.file)" class="btn-no-color info-meeting-normal">
<ion-label class="info-meeting-normal">{{msg.file.subject}}</ion-label>
</button><br />
<ion-label *ngIf="msg.delate == false" class="info-meeting-medium">
<ion-icon name="calendar-outline"></ion-icon> De {{showDateDuration(msg.file.start_date)}} a
{{showDateDuration(msg.file.end_date)}}
</ion-label><br />
<ion-label *ngIf="msg.delate == false" class="info-meeting-medium">
<ion-icon></ion-icon>
<ion-icon name="location-outline"></ion-icon> {{msg.file.venue}}
</ion-label><br />
</div>
</div>
</div>
MESSAGE
<p>Room ID: {{ roomData.id }}</p>
</ion-list>
</div>
@@ -227,16 +53,17 @@
</ion-content>
<ion-footer (click)="ChatSystemService.getDmRoom(roomId).sendReadMessage()">
<!-- <ion-footer (click)="ChatSystemService.getDmRoom(roomId).sendReadMessage()"> -->
<ion-footer >
<div class="typing" *ngIf="ChatSystemService.getDmRoom(roomId).otherUserType == true" >
<!-- <div class="typing" *ngIf="ChatSystemService.getDmRoom(roomId).otherUserType == true" >
<ngx-letters-avatar *ngIf="showAvatar"
[avatarName]= "ChatSystemService.getDmRoom(roomId).name"
[width]="30"
[circular]="true"
fontFamily="Roboto"></ngx-letters-avatar>
está a escrever...
</div>
</div> -->
<div class="width-100 pl-20 pr-20">
<span *ngIf="!lastAudioRecorded">{{durationDisplay}}</span>
<div class=" audioDiv d-flex width-100 mt-10 mb-10" *ngIf="lastAudioRecorded">
@@ -277,7 +104,7 @@
<div class="width-100">
<div *ngIf="!recording && !lastAudioRecorded" class="type-message">
<ion-textarea *ngIf="allowTyping" (keyup.enter)="sendMessage()" clearOnEdit="true" placeholder="Escrever uma mensagem" class="message-input" rows="1" [(ngModel)]="ChatSystemService.getDmRoom(roomId).message" (ionChange)="ChatSystemService.getDmRoom(roomId).sendTyping()"></ion-textarea>
<ion-textarea *ngIf="allowTyping" (keyup.enter)="sendMessage()" clearOnEdit="true" placeholder="Escrever uma mensagem" class="message-input" rows="1" [(ngModel)]="textField" (ionChange)="sendTyping()"></ion-textarea>
</div>
<div *ngIf="recording" class="d-flex align-items-center justify-content-center">
<button (click)="stopRecording()" class="btn-no-color d-flex align-items-center justify-content-center">
@@ -287,19 +114,12 @@
</div>
<div>
<button #recordbtn *ngIf="!ChatSystemService.getDmRoom(roomId).message && !lastAudioRecorded" (click)="startRecording()" class="btn-no-color">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/default/icons-chat-record-audio.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-record-audio.svg"></ion-icon>
<!-- <ion-icon *ngIf="audioPermissionStatus != 'granted' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-record-audio-disable.svg"></ion-icon> -->
</button>
<button *ngIf="ChatSystemService.getDmRoom(roomId).message" class="btn-no-color" (click)="sendMessage()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
</button>
<button *ngIf="!ChatSystemService.getDmRoom(roomId).message && lastAudioRecorded" class="btn-no-color" (click)="sendAudio(lastAudioRecorded)">
<button class="btn-no-color" (click)="sendMessage()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
</button>
</div>
</div>
</ion-footer>