add press gesture in messages itens to perfom message options such as delete message

This commit is contained in:
tiago.kayaya
2021-09-30 08:43:49 +01:00
parent 4e12e8d0fa
commit 9b8c60b573
10 changed files with 205 additions and 40 deletions
+22 -4
View File
@@ -1,5 +1,8 @@
<ion-header class="ion-no-border">
<ion-toolbar class="header-toolbar">
<!-- <div #rectangle class="rectangle" (press)="handlePress()">
Double click me to change the color
</div> -->
<div class="main-header">
<div class="header-top">
<div class="left">
@@ -7,9 +10,15 @@
<ion-icon slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
</button>
</div>
<div class="middle" *ngFor="let users of dmUsers">
<ion-label class="title">{{users.name}}</ion-label>
<span><ion-icon class="{{users.status}}" name="ellipse"></ion-icon></span>
<div class="middle-container" *ngIf="!showMessageOptions">
<div class="middle" *ngFor="let users of dmUsers">
<ion-label class="title">{{users.name}}</ion-label>
<span><ion-icon class="{{users.status}}" name="ellipse"></ion-icon></span>
</div>
</div>
<div class="middle-container-options" *ngIf="showMessageOptions">
<fa-icon icon="trash" class="middle-container-options-icons"></fa-icon>
<!-- <ion-icon name="trash"></ion-icon> -->
</div>
<div hidden class="right">
<button class="btn-no-color" (click)="openMessagesOptions()">
@@ -30,13 +39,22 @@
</ion-header>
<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>
<div *ngFor="let msg of chatMessageStore.message[roomId] ; let last = last" class='incoming-{{msg.u.username!=loggedUser.me.username}}'>
<div (click)="handleClick() " (press)="handlePress()" class='message-container incoming-{{msg.u.username!=loggedUser.me.username}}' *ngFor="let msg of chatMessageStore.message[roomId] ; let last = last">
<!-- <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)" class="menuButton">Apagar mensagem</button>
</mat-menu>
</div> -->
<div class="title">
<ion-label>{{msg.u.name}}</ion-label>
<span class="time">{{showDateDuration(msg._updatedAt)}}</span>