add message status

This commit is contained in:
Peter Maquiran
2022-03-30 14:52:02 +01:00
parent c630e32ae3
commit 47c96ba052
5 changed files with 127 additions and 0 deletions
@@ -56,6 +56,14 @@
<div class="message">
<ion-label *ngIf="msg.delate == false">{{msg.msg}}</ion-label>
<ion-label *ngIf="msg.delate == true">{{msg.msg}}</ion-label>
<ion-label class="float-status-all float-status" >
<ion-icon *ngIf="msg.messageSend == false" src="assets/images/clock-regular.svg"></ion-icon>
<ion-icon *ngIf="msg.messageSend == true && msg.received.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>
</ion-label>
{{last ? scrollToBottom() : ''}}
</div>
</div>
@@ -83,6 +91,13 @@
msg.attachments[0].image_url" (click)="openPreview(msg)">
<img *ngIf="msg.attachments[0].image_url" src="{{msg.attachments[0].image_url}}" alt="image">
<ion-icon *ngIf="msg.attachments[0].image_url == null" name="download-outline"></ion-icon>
<ion-label class="float-status-all float-status" >
<ion-icon *ngIf="msg.messageSend == false" src="assets/images/clock-regular.svg"></ion-icon>
<ion-icon *ngIf="msg.messageSend == true && msg.received.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>
</ion-label>
</div>
<div *ngIf="msg.file.type != 'application/img'">
<div *ngIf="msg.file.type != 'application/audio'" class="file add-attachment-bg-color">
@@ -113,6 +128,13 @@
<span *ngIf="file.description && msg.file.type != 'application/webtrix'"></span>
<span *ngIf="msg.file.type != 'application/webtrix' && msg.file.type != 'application/audio'">{{msg.displayType}}</span>
</ion-label>
<ion-label class="float-status-all float-status" >
<ion-icon *ngIf="msg.messageSend == false" src="assets/images/clock-regular.svg"></ion-icon>
<ion-icon *ngIf="msg.messageSend == true && msg.received.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>
</ion-label>
</div>
</div>
</div>
@@ -293,3 +293,31 @@
.typing ngx-letters-avatar {
padding-right: 5px;
}
.float-status{
position: relative !important;
float: right;
display: flex;
align-items: self-end;
}
.float-status-image{
position: relative !important;
float: right;
display: flex;
align-items: self-end;
top: -15px;
}
.float-status-webtrix {
position: relative !important;
top: 0px !important;
float: right;
display: flex;
align-items: self-end;
}
.float-status-all {
font-size: 10pt !important;
}