fix chat ui details

src/app/ui/chat/modal/messages/messages.page.html

@@ -51,7 +51,7 @@
   <div class="messages height-100 width-100 d-flex flex-column" #scrollMe >
 
     <div
-    *ngFor="let message of messages1[roomId]" class="messages-list-item-wrapper"
+    *ngFor="let message of messages1[roomId]; let messageIndex = index" class="messages-list-item-wrapper"
     [ngClass]="{
       'info-meeting': message.messageType == IMessageType.information && !message.ballon,
       'info-ballon': message.ballon == true,

src/app/ui/chat/modal/messages/messages.page.ts

@@ -24,7 +24,7 @@ import { Observable, Subscription } from 'rxjs';
 import { MessageTable } from 'src/app/infra/database/dexie/instance/chat/schema/message';
 import { ChatServiceService } from 'src/app/module/chat/domain/chat-service.service';
 import { EditMessagePage } from 'src/app/ui/chat/modal/edit-message/edit-message.page';
-import { IMessageType, MessageAttachmentFileType, MessageAttachmentSource } from 'src/app/core/chat/entity/message';
+import { IMessageType, MessageAttachmentFileType, MessageAttachmentSource, MessageEntity } from 'src/app/core/chat/entity/message';
 import { MemberTable } from 'src/app/infra/database/dexie/instance/chat/schema/members';
 import { TypingTable } from 'src/app/infra/database/dexie/instance/chat/schema/typing';
 import { compressImageBase64 } from 'src/app/utils/imageCompressore';
@@ -50,6 +50,8 @@ import { MessageViewModal } from '../../store/model/message';
 import { XBallon } from '../../utils/messageBallon';
 import { tap } from 'rxjs/operators';
 import { ChatPopoverPage } from '../chat-popover/chat-popover.page';
+import { ViewOncesImagePageInput, ViewOncesImagePage } from '../view-onces/view-onces.page';
+import { LastMessage } from '../../utils/lastMessage';
 
 
 
@@ -887,6 +889,19 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
   }
 
 
+  async onImageError() {}
+  async onImageLoad(message: MessageViewModal, index:number) {
+    if(message.attachments[0].fileName == LastMessage.attachments[0].fileName) {
+
+      this.scrollToBottom()
+      setTimeout(() => {
+        this.scrollToBottom();
+      }, 100)
+
+      this.messages1[this.roomId].splice(index, 1);
+    }
+  }
+  
 
   async takePictureMobile() {
 
@@ -1067,6 +1082,22 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
 
   }
 
+  async viewOnce(event: Event, message: MessageViewModal, index:number) {
+    const params: ViewOncesImagePageInput = {
+      imageDataUrl: message.attachments[index].safeFile as any,
+    }
+    const modal = await this.modalController.create({
+      component: ViewOncesImagePage,
+      cssClass: '',
+      componentProps: params
+    });
+
+    modal.present()
+
+    return modal.onDidDismiss().then((res) => {
+      this.messageDelete(message)
+    });
+  }
 
   async addFileToChat(types) {
     console.log('add file ')

src/app/ui/chat/modal/room-info/room-info.page.html

@@ -1,6 +1,6 @@
 <ion-header>
   <ion-toolbar>
-    <ion-title class="title"  *ngIf="roomData$ | async as roomData"> Nome do grupo {{ roomData.roomName }}</ion-title>
+    <ion-title class="title"  *ngIf="roomData$ | async as roomData"> {{ roomData.roomName }}</ion-title>
   </ion-toolbar>
 </ion-header>
 
@@ -10,9 +10,12 @@
 
   <ion-list class="header-bottom-contacts px-20"  *ngIf="roomMembers$ | async as memberList">
     <div *ngFor="let user of memberList; let i = index">
-      <div class="py-1">
-        <!-- <img [src]="memberList.userPhoto" class="pa-20"> {{ user.wxFullName }}  -->
-        {{ user.wxFullName }} <span *ngIf="user.isAdmin">(admin do group)</span>
+      <div class="py-1 d-flex align-center">
+        <div class="image-container mr-10">
+          <img *ngIf="ObjectURL[user.wxUserId]"  [src]="ObjectURL[user.wxUserId]">
+        </div>
+
+        {{ user.wxFullName }} <span class="admin" *ngIf="user.isAdmin">(admin do group)</span>
       </div>
     </div>
   </ion-list>

src/app/ui/chat/modal/room-info/room-info.page.scss

@@ -5,4 +5,18 @@ img  {
   -moz-border-radius: 20px;
   -ms-border-radius: 20px;
   -o-border-radius: 20px;
-}
+  height: 35px;
+  width: 35px;
+  object-fit: cover;
+}
+
+.image-container {
+  height: 35px;
+  width: 35px;
+  background-color: gray;
+  border-radius: 20px;
+}
+
+.admin {
+  color: gray;
+}

src/app/ui/chat/modal/room-info/room-info.page.ts

@@ -2,12 +2,11 @@ import { Component, OnInit } from '@angular/core';
 import { NavParams } from '@ionic/angular';
 import { Observable } from 'rxjs';
 import { MemberListLocalRepository } from 'src/app/module/chat/data/repository/member/member-list-local-repository.service'
-import { Observable as  DexieObservable } from 'Dexie';
 import { RoomLocalRepository } from 'src/app/module/chat/data/repository/room/room-local-repository.service'
-import { MemberTable } from 'src/app/infra/database/dexie/instance/chat/schema/members';
 import { RoomTable } from 'src/app/infra/database/dexie/instance/chat/schema/room';
-import { tap } from 'rxjs/operators';
-
+import { map, tap } from 'rxjs/operators';
+import { ChatServiceService } from 'src/app/module/chat/domain/chat-service.service'
+import { MemberEntity } from 'src/app/core/chat/entity/member';
 @Component({
   selector: 'app-room-info',
   templateUrl: './room-info.page.html',
@@ -16,13 +15,15 @@ import { tap } from 'rxjs/operators';
 export class RoomInfoPage implements OnInit {
 
   roomId:string;
-  roomMembers$:  Observable<MemberTable[] | undefined>
+  roomMembers$:  Observable<MemberEntity[]>
   roomData$: Observable<RoomTable | undefined>
+  ObjectURL : {[key: string]: string} = {};
 
   constructor(
     private navParams: NavParams,
     private MemberListLocalRepository: MemberListLocalRepository,
     private RoomLocalRepository: RoomLocalRepository,
+    private ChatServiceService: ChatServiceService
   ) {
     this.roomId = this.navParams.get('roomId');
   }
@@ -31,10 +32,24 @@ export class RoomInfoPage implements OnInit {
 
     // this.roomMessage$ = this.messageRepositoryService.getItemsLive(this.roomId)
     this.roomMembers$ = this.MemberListLocalRepository.getRoomMemberByIdLive(this.roomId).pipe(
-      tap((data)=> {
-        console.log(data)
-      })
+      map((memberList) => memberList.map(e =>  Object.assign(new MemberEntity(), e))),
+      tap((members) => {
+        for(let member of members) {
+
+          if(!this.ObjectURL[member.wxUserId] && member.hasPhoto()) {
+            this.ChatServiceService.getUserPhoto({wxUserId: member.wxUserId, attachmentId: member.userPhoto}).then((result)=> {
+
+              if(result.isOk()) {
+                console.log('get photo', result.value)
+                this.ObjectURL[member.wxUserId] = 'data:image/jpeg;base64,'+result.value
+              }
+            })
+          }
+        }
+      }),
+
     )
+
     this.roomData$ = this.RoomLocalRepository.getRoomByIdLive(this.roomId)
   }