File: /var/www/vhost/disk-apps/pwa.sports-crowd.com/src/app/pages/messages/messages.html
<ion-header class="ion-no-border">
<ion-toolbar>
<ion-back-button defaultHref="/app/tabs/settings" slot="start"></ion-back-button>
<ion-title class="ion-text-center">{{ 'MESSAGES_TITLE' | translate }}</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding" #content>
<ion-list lines="none" class="listGlobeMessage">
<div class="messageContent" *ngFor="let message of listMessages; let last = last">
<div class="contentMessage ion-float-right" *ngIf="!message.messages.admin_id">
<ion-card class="cardTextMessage cardTextMessageUser">
<ion-card-content> {{message.messages.message}} </ion-card-content>
<p class="textDateMessage ion-float-end">{{message.messages.created_at}}</p>
</ion-card>
<ion-item class="avatarMessage ion-no-padding">
<ion-avatar slot="end" *ngIf="userProvider._infoUser">
<img
src="../../assets/img/default_profile.png"
*ngIf="!userProvider._infoUser.user_info.photo && !userProvider._infoUser.user_info.photo_social"
/>
<img
src="{{cityProvider._urlGallery}}avatars/{{userProvider._infoUser.user_info.photo}}"
*ngIf="userProvider._infoUser.user_info.photo"
/>
<img src="{{userProvider._infoUser.user_info.photo_social}}" *ngIf="userProvider._infoUser.user_info.photo_social" />
</ion-avatar>
</ion-item>
</div>
<div class="contentMessage ion-float-left" *ngIf="message.messages.admin_id">
<ion-item class="avatarMessage ion-no-padding">
<ion-avatar slot="start">
<img src="../../assets/img/callcenter.png" />
</ion-avatar>
</ion-item>
<ion-card class="cardTextMessage cardTextMessageAdmin">
<ion-card-content> {{message.messages.message}} </ion-card-content>
<p class="textDateMessage ion-float-end">{{message.messages.created_at}}</p>
</ion-card>
</div>
{{last ? callBottomScroll() : ''}}
</div>
</ion-list>
</ion-content>
<ion-footer>
<ion-toolbar>
<form #formMessages="ngForm" (ngSubmit)="sendMessage(formMessages)" class="formSendMessage">
<ion-item lines="none" class="width-100percent">
<ion-input
class="flexgrow_input"
slot="start"
type="text"
placeholder="{{ 'PLACEHOLDER_MESSAGES' | translate}}"
[(ngModel)]="messageUser"
name="message"
#message="ngModel"
(ngModelChange)="changeInputText($event)"
required
></ion-input>
<ion-button type="submit" color="primary" shape="round" expand="block" fill="clear" class="marginTop10"
><ion-icon name="send"></ion-icon
></ion-button>
<!-- <ion-buttons slot="end" class="marginTop5">
</ion-buttons> -->
</ion-item>
</form>
</ion-toolbar>
</ion-footer>