save

src/app/pages/chat/messages/messages.module.ts

@@ -8,6 +8,7 @@ import { MessagesPageRoutingModule } from './messages-routing.module';
 
 import { MessagesPage } from './messages.page';
 import { SharedModule } from 'src/app/shared/shared.module';
+import { BtnModalDismissPage } from 'src/app/shared/btn-modal-dismiss/btn-modal-dismiss.page';
 
 @NgModule({
   imports: [
@@ -17,6 +18,6 @@ import { SharedModule } from 'src/app/shared/shared.module';
     SharedModule,
     MessagesPageRoutingModule
   ],
-  declarations: [MessagesPage]
+  declarations: [MessagesPage, SharedModule]
 })
 export class MessagesPageModule {}

src/app/pages/chat/messages/messages.page.html

@@ -2,7 +2,9 @@
   <ion-toolbar class="header-toolbar">
     <div class="main-header">
       <div class="header-top">
-        <app-btn-modal-dismiss></app-btn-modal-dismiss>
+        <div class="left">
+          <ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
+        </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>
@@ -30,21 +32,6 @@
     </ion-refresher-content>
   </ion-refresher>
   <div class="messages" #scrollMe>
-    <!-- <ion-infinite-scroll position="top" threshold="25%" (ionInfinite)="loadMoreMessages($event)">
-      <ion-infinite-scroll-content loadindSpiniter="crescent" loadingText="Carregando...">
-
-      </ion-infinite-scroll-content>
-    </ion-infinite-scroll> -->
-    <!-- <div class="incoming">
-      <div class="title">
-        <ion-label>Secretário Assuntos sociais</ion-label>
-        <span class="time">14:23</span>
-      </div>
-      <div>
-        <img src='assets/images/1.jpg' tappable>
-        <ion-label hidden >Investidura Filipe Nyusi</ion-label>
-      </div>
-    </div> -->
     <div *ngFor="let msg of messages" class='incoming-{{msg.u.username!=loggedUser.me.username}}'>
       <div class="title">
         <ion-label>{{msg.u.name}}</ion-label>
@@ -57,8 +44,6 @@
   </div>
 
 </ion-content>
-
-
 <ion-footer>
   <ion-toolbar>
     <ion-row align-items-center class="row">
@@ -81,4 +66,4 @@
       </ion-col>
     </ion-row>
   </ion-toolbar>
-</ion-footer>
+</ion-footer>

src/app/pages/chat/messages/messages.page.scss

@@ -2,7 +2,6 @@
 .header-toolbar{
     --background:transparent;
     --opacity: 1;
-    border: 1px solid red;
 
     .main-header{
         width: 100%; /* 400px */
@@ -22,6 +21,12 @@
           overflow: auto;
           padding: 0 !important;
           background: #fff;
+          .left{
+            width: 37px;
+            float: left;
+            font-size: 35px;
+            overflow: hidden;
+          }
            .middle{
             padding: 0!important;
             float: left;
@@ -83,13 +88,9 @@
     }
  }
  ion-content{
-   width: 100%;
-   height: 100%;
-  border: 1px solid red;
    .welcome-text{
     /* width: 322px; */
-    /*  width: em(422px); */
-    width: 100%;
+     width: em(422px);
      background: #ebebeb;
      text-align: center;
      font-size: 13px;
@@ -99,7 +100,6 @@
      line-height: 1.2rem;
      margin: 20px 39px 25px;
      border-radius: 8px;
-     
    }
    .messages{
     font-size: 13px;
@@ -150,8 +150,6 @@
  }
 
  ion-footer{
-  width: 100%;
-  border: 1px solid red;
    .row{
      width: 380px;
     margin: 0 auto;
@@ -227,5 +225,4 @@ display: block;
   display: block;
  float: left;
  padding-left: 10px;
-}
- 
+}

src/app/pages/chat/messages/messages.page.ts

@@ -1,18 +1,18 @@
-import { AfterViewChecked, Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
+import { AfterViewChecked, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
 import { ModalController, NavParams, PopoverController } from '@ionic/angular';
 import { Status } from 'src/app/models/chat/status.model';
+import { ContactsPage } from 'src/app/pages/chat/messages/contacts/contacts.page';
 import { AuthService } from 'src/app/services/auth.service';
 import { ChatService } from 'src/app/services/chat.service';
 import { ChatOptionsPopoverPage } from 'src/app/shared/popover/chat-options-popover/chat-options-popover.page';
 import { MessagesOptionsPage } from 'src/app/shared/popover/messages-options/messages-options.page';
-import { ContactsPage } from '../new-group/contacts/contacts.page';
 
 @Component({
   selector: 'app-messages',
   templateUrl: './messages.page.html',
   styleUrls: ['./messages.page.scss'],
 })
-export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
+export class MessagesPage implements OnInit, AfterViewChecked {
   showLoader: boolean;
 
   @ViewChild('scrollMe') private myScrollContainer: ElementRef;
@@ -21,26 +21,19 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
 
   message = '';
   messages:any;
-  dm:any;
   userPresence='';
   dmUsers:any;
+  roomId:string;
 
-  @Input() roomId:string;
   
   constructor(
     public popoverController: PopoverController,
     private modalController: ModalController,
-    /* private navParams: NavParams, */
+    private navParams: NavParams,
     private chatService: ChatService,
     private authService: AuthService,
   ) { 
-   /*  this.dm = this.navParams.get('dm'); */
-  }
-  ngOnChanges(changes: SimpleChanges): void {
-    console.log(this.roomId);
-    this.load();
-    
-    //throw new Error('Method not implemented.');
+    this.roomId = this.navParams.get('roomId');
   }
 
   ngOnInit() {
@@ -55,16 +48,15 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
     /* setInterval(()=>{ */
       this.load();
     /* }, 9000); */
-    console.log(this.roomId);
-    
     
   }
+  close(){
+    this.modalController.dismiss();
+  }
   load(){
     this.loadMessages();
     this.getChatMembers();
   }
-
-
   doRefresh(ev:any){
     this.load();
     ev.target.complete();
@@ -72,7 +64,6 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
   
   ngAfterViewChecked() {        
     this.scrollToBottom();
-    console.log(this.roomId);
   } 
   scrollToBottom(): void {
     try {
@@ -108,8 +99,6 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
     })
   }
   getChatMembers(){
-    console.log(this.roomId);
-    
     this.showLoader = true;
     this.chatService.getMembers(this.roomId).subscribe(res=> {
       this.dmUsers = res['members'].filter(data => data.username != this.loggedUser.me.username)
@@ -123,7 +112,7 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
     const popover = await this.popoverController.create({
       component: MessagesOptionsPage,
       componentProps: {
-        roomId: this.dm._id,
+        roomId: this.roomId,
       },
       cssClass: 'messages-options',
       event: ev,
@@ -155,4 +144,4 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
     return await popover.present();
   }
 
-}
+}