add user list

This commit is contained in:
Peter Maquiran
2022-01-11 13:03:43 +01:00
parent 3b370996b5
commit a8a1307bec
4 changed files with 153 additions and 92 deletions
+52 -52
View File
@@ -43,64 +43,64 @@
<div class=" aside overflow-y-auto d-flex flex-wrap flex-grow-1"> <div class=" aside overflow-y-auto d-flex flex-wrap flex-grow-1">
<div class="width-100" [ngSwitch]="segment"> <div class="width-100" [ngSwitch]="segment">
<ion-list *ngSwitchCase="'Contactos'"> <ion-list *ngSwitchCase="'Contactos'">
<ion-item-sliding> <ion-item-sliding>
<div class="item item-hover width-100 d-flex ion-no-padding ion-no-margin" <div class="item item-hover width-100 d-flex ion-no-padding ion-no-margin"
*ngFor="let dm of userDirectMessages" *ngFor="let room of ChatServiceGPR.individual | keyvalue"
[class.item-active]="dm._id == idSelected"> [class.item-active]="room.value.id == idSelected">
<div class="item-icon"> <div class="item-icon">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="icon" slot="start" src="assets/images/icons-chat-chat-40.svg"></ion-icon> <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="icon" slot="start" src="assets/images/icons-chat-chat-40.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' && dm._id != idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40.svg"></ion-icon> <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && room.value.id != idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' && dm._id == idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40-hover.svg"></ion-icon> <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && room.value.id == idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40-hover.svg"></ion-icon>
</div> </div>
<div [class.highlight]="dm._id =='cjFv5XfreKz5j3fWW'" <div [class.highlight]="room.value.id =='cjFv5XfreKz5j3fWW'"
(click)="openMessagesPage(dm._id)" (click)="openMessagesPage(room.value.id)"
class="item-content flex-grow-1 cursor-pointer"><!-- (click)="openMessages(dm)" --> class="item-content flex-grow-1 cursor-pointer"><!-- (click)="openMessages(dm)" -->
<div class="item-title-time"> <div class="item-title-time">
<div class="item-title" [class.item-title-active]="dm._id == idSelected"> <div class="item-title" [class.item-title-active]="room.value.id == idSelected">
<ion-label *ngFor="let user of dm.uids"> <ion-label >
<span *ngIf="user !=loggedUserChat.me.username"> <span >
<div *ngFor="let t of dmUsers"> <div >
<div *ngIf="user == t._id"> <div >
{{t.name}} {{room.value.name}}
</div>
</div> </div>
</span> </div>
</ion-label> </span>
</ion-label>
</div>
<!-- <div class="item-date" [class.item-date-active]="dm._id == idSelected">{{showDateDuration(dm._updatedAt)}}</div> -->
</div>
<div *ngIf="room.value.lastMessage" class="item-description" [class.item-description-active]="room.value.id == idSelected">
<ion-label *ngIf="room.value.lastMessage">{{room.value.lastMessage.msg}}</ion-label>
<ion-label *ngIf="room.value.lastMessage.file">
<fa-icon *ngIf="room.value.lastMessage.file.type != 'application/meeting'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<fa-icon *ngIf="room.value.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<span> {{room.value.lastMessage.file.name || room.value.lastMessage.file.subject }}</span>
</ion-label>
<ion-label *ngIf="room.value.lastMessage.attachments">
<div *ngIf="room.value.lastMessage.attachments[0].image_url">
<fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<span> Fotografia</span>
</div> </div>
<div class="item-date" [class.item-date-active]="dm._id == idSelected">{{showDateDuration(dm._updatedAt)}}</div> </ion-label>
</div>
<div *ngIf="dm.lastMessage" class="item-description" [class.item-description-active]="dm._id == idSelected">
<ion-label *ngIf="dm.lastMessage">{{dm.lastMessage.msg}}</ion-label>
<ion-label *ngIf="dm.lastMessage.file">
<fa-icon *ngIf="dm.lastMessage.file.type != 'application/meeting'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
<fa-icon *ngIf="dm.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
<span> {{dm.lastMessage.file.name || dm.lastMessage.file.subject }}</span>
</ion-label>
<ion-label *ngIf="dm.lastMessage.attachments">
<div *ngIf="dm.lastMessage.attachments[0].image_url">
<fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
<span> Fotografia</span>
</div>
</ion-label>
</div>
</div> </div>
</div> </div>
</ion-item-sliding> </div>
<ion-item-sliding *ngIf="showLoader || userDirectMessages.length < 1"> </ion-item-sliding>
<div *ngFor="let n of numSequence(8); let i = index;" class="item item-hover width-100 d-flex ion-no-padding ion-no-margin"> <ion-item-sliding *ngIf="ChatServiceGPR.loadingWholeList || ChatServiceGPR.individualCount < 1">
<div class="item-icon"><ion-icon class="icon" slot="start" src="assets/icon/icons-chat-grey.svg"></ion-icon></div> <div *ngFor="let n of numSequence(8); let i = index;" class="item item-hover width-100 d-flex ion-no-padding ion-no-margin">
<div class="item-content flex-grow-1 cursor-pointer"> <div class="item-icon"><ion-icon class="icon" slot="start" src="assets/icon/icons-chat-grey.svg"></ion-icon></div>
<div class="item-title-time"> <div class="item-content flex-grow-1 cursor-pointer">
<div class="item-title"><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></div> <div class="item-title-time">
<div class="item-date"><ion-skeleton-text animated></ion-skeleton-text></div> <div class="item-title"><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></div>
</div> <div class="item-date"><ion-skeleton-text animated></ion-skeleton-text></div>
<div class="item-description d-flex align-items-center"> </div>
<fa-icon icon="file-alt" class="file-icon"></fa-icon> <div class="item-description d-flex align-items-center">
<ion-skeleton-text animated style="width: 95%; margin-left:5%"></ion-skeleton-text> <fa-icon icon="file-alt" class="file-icon"></fa-icon>
</div> <ion-skeleton-text animated style="width: 95%; margin-left:5%"></ion-skeleton-text>
</div> </div>
</div> </div>
</ion-item-sliding> </div>
</ion-item-sliding>
</ion-list> </ion-list>
<ion-list *ngSwitchCase="'Grupos'"> <ion-list *ngSwitchCase="'Grupos'">
<ion-item-sliding *ngIf="!showLoader"> <ion-item-sliding *ngIf="!showLoader">
+29 -26
View File
@@ -12,6 +12,7 @@ import {
import { ModalController, Platform } from '@ionic/angular'; import { ModalController, Platform } from '@ionic/angular';
import { AuthService } from 'src/app/services/auth.service'; import { AuthService } from 'src/app/services/auth.service';
import { ChatService } from 'src/app/services/chat.service'; import { ChatService } from 'src/app/services/chat.service';
import { ChatService as ChatServiceGPR} from 'src/app/services/chat/chat.service'
import { GroupMessagesPage } from './group-messages/group-messages.page'; import { GroupMessagesPage } from './group-messages/group-messages.page';
import { ContactsPage } from './messages/contacts/contacts.page'; import { ContactsPage } from './messages/contacts/contacts.page';
import { MessagesPage } from './messages/messages.page'; import { MessagesPage } from './messages/messages.page';
@@ -123,9 +124,11 @@ export class ChatPage implements OnInit {
private router: Router, private router: Router,
private sqlservice: SqliteService, private sqlservice: SqliteService,
private platform: Platform, private platform: Platform,
private storageservice: StorageService private storageservice: StorageService,
public ChatServiceGPR: ChatServiceGPR
) { ) {
this.loggedUserChat = authService.ValidatedUserChat['data']; this.loggedUserChat = authService.ValidatedUserChat['data'];
this.headers = new HttpHeaders(); this.headers = new HttpHeaders();
window.onresize = (event) => { window.onresize = (event) => {
@@ -142,44 +145,44 @@ export class ChatPage implements OnInit {
this.segment = "Contactos"; this.segment = "Contactos";
this.authService.userData$.subscribe((res: any) => { // this.authService.userData$.subscribe((res: any) => {
this.loggedUser = res; // this.loggedUser = res;
console.log(this.loggedUser); // console.log(this.loggedUser);
this.load(); // this.load();
this.getDirectMessagesDB(); // // this.getDirectMessagesDB();
}); // });
/* websocket functions */ /* websocket functions */
//this.sendMsg(); //this.sendMsg();
/* Fim websocket functions */ /* Fim websocket functions */
this.hideRefreshButton(); // this.hideRefreshButton();
this.getChatMembers(); // this.getChatMembers();
//Teste //Teste
let t = this.showDateDuration(new Date()); // let t = this.showDateDuration(new Date());
console.log(t); // console.log(t);
this.setStatus('away'); // this.setStatus('away');
/* if(this.dataService.get("newGroup")){ /* if(this.dataService.get("newGroup")){
this.openNewGroupPage(); this.openNewGroupPage();
} */ } */
this.router.events.forEach((event) => { // this.router.events.forEach((event) => {
if (event instanceof NavigationStart && event.url.startsWith('/home/chat')) { // if (event instanceof NavigationStart && event.url.startsWith('/home/chat')) {
if (this.dataService.get("newGroup")) { // if (this.dataService.get("newGroup")) {
this.openNewGroupPage(); // this.openNewGroupPage();
} // }
else{ // else{
this.closeAllDesktopComponents(); // this.closeAllDesktopComponents();
this.showEmptyComponent = true; // this.showEmptyComponent = true;
} // }
} // }
else{ // else{
this.dataService.set("newGroup", false); // this.dataService.set("newGroup", false);
} // }
}); // });
} }
numSequence(n: number): Array<number> { numSequence(n: number): Array<number> {
+63 -10
View File
@@ -2,14 +2,21 @@ import { Injectable } from '@angular/core';
import { RoomService } from './room.service'; import { RoomService } from './room.service';
import { RocketChatClientService } from 'src/app/services/socket/rocket-chat-client.service'; import { RocketChatClientService } from 'src/app/services/socket/rocket-chat-client.service';
import { MessageService } from 'src/app/services/chat/message.service' import { MessageService } from 'src/app/services/chat/message.service'
import { SessionStore } from 'src/app/store/session.service';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
export class ChatService { export class ChatService {
rooms: RoomService[] = []
group = [] individual: {[key: string]: RoomService} = {}
group: {[key: string]: RoomService} = {}
loadingWholeList = false
individualCount = 0;
groupCount = 0;
constructor( constructor(
private RocketChatClientService: RocketChatClientService private RocketChatClientService: RocketChatClientService
@@ -17,17 +24,63 @@ export class ChatService {
this.getAllRoomAndSubscribe() this.getAllRoomAndSubscribe()
} }
getAllRoomAndSubscribe() { async getAllRoomAndSubscribe () {
this.RocketChatClientService.getRooms().then((rooms: any) => { this.loadingWholeList = true
rooms.result.update.forEach((roomData:any) => {
const room = new RoomService(new RocketChatClientService(), new MessageService()) const rooms: any = await this.RocketChatClientService.getRooms();
room.setData({id: roomData.lastMessage.rid})
}); rooms.result.update.forEach((roomData:any) => {
let room
let roomId = roomData.lastMessage.rid
if(this.isIndividual(roomData)) {
room = new RoomService(new RocketChatClientService(), new MessageService())
room.setData({
id: this.getRoomId(roomData),
name: this.getChatName(roomData),
lastMessage: this.getRoomLastMessage(roomData)
})
this.individual[roomId] = room
this.individualCount++
} else {
room = new RoomService(new RocketChatClientService(), new MessageService())
room.setData({
id: this.getRoomId(roomData),
name: this.getChatName(roomData),
lastMessage: this.getRoomLastMessage(roomData)
})
this.group[roomId] = room
this.groupCount++
}
}); });
this.loadingWholeList = false
} }
onJoinRoom() { getChatName(roomData) {
// live if(this.isIndividual(roomData)) {
const names: String[] = roomData.usernames
const roomName = names.filter((name)=>{
return name != SessionStore.user.RochetChatUser
})[0]
return roomName
} else {
return roomData.fName
}
}
getRoomId(roomData) {
return roomData.lastMessage.rid
}
getRoomLastMessage(roomData) {
return roomData.lastMessage
}
private isIndividual(roomData) {
return !roomData.fname
} }
} }
+9 -4
View File
@@ -7,17 +7,22 @@ import { ChatUserService } from 'src/app/services/chat/chat-user.service'
}) })
export class RoomService { export class RoomService {
massages: MessageService[] = [] massages: {[key: string]: MessageService} = {}
lastMessage: MessageService;
chatUser: ChatUserService[] = [] chatUser: ChatUserService[] = []
id = [] id = ''
name = ''
constructor( constructor(
private RocketChatClientService: RocketChatClientService, private RocketChatClientService: RocketChatClientService,
private MessageService: MessageService private MessageService: MessageService
) {} ) {}
setData({id}){ setData({id, name, lastMessage}) {
this.id= id this.id = id
this.name = name
this.lastMessage = lastMessage
} }
create() {} create() {}