Dialog of Add, Remove + Member list in chat

This commit is contained in:
NyxiumYuuki 2021-06-01 22:34:28 +02:00
parent 95c08668f7
commit 22b137931d
2 changed files with 121 additions and 5 deletions

View file

@ -2,6 +2,11 @@
<div class="chat-header">
<p class="username" *ngIf="room !== 'general'">{{room}}</p>
<p class="username" *ngIf="room === 'general'">General</p>
<div class="pull-right">
<input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="addMember()" type="submit" value="+">
<input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="removeMember()" type="submit" value="-">
<input *ngIf="room !== 'general' && typeRoom === true" class="btn btn-sm btn-primary" name="button-change-private" (click)="listMembers()" type="submit" value="Members">
</div>
</div>
<div #scrollContainer class="chat-body" >
<ul #ulMessages id="messages">

View file

@ -3,6 +3,9 @@ import {ChatInfo, ChatService} from "../services/chat/chat.service";
import {DatePipe} from "@angular/common";
import {environment} from "../../environments/environment";
import {MessageService} from "../services/message/message.service";
import {MatDialog} from "@angular/material/dialog";
import {AddMemberDialogComponent} from "../add-member-dialog/add-member-dialog.component";
import {RemoveMemberDialogComponent} from "../remove-member-dialog/remove-member-dialog.component";
@Component({
selector: 'app-message',
@ -18,13 +21,16 @@ export class MessageComponent implements OnInit, OnChanges {
// @ts-ignore
@Input() room: string;
// @ts-ignore
@Input() typeRoom: boolean;
// @ts-ignore
@ViewChild('ulMessages') ulMsg: ElementRef;
// @ts-ignore
@ViewChild('scrollContainer') scrollContainer: ElementRef;
constructor(private chatservice: ChatService, private pipe: DatePipe, private messageservice: MessageService) {
constructor(private chatservice: ChatService, private pipe: DatePipe, private messageservice: MessageService, public dialog: MatDialog) {
}
ngOnInit() {
@ -42,11 +48,21 @@ export class MessageComponent implements OnInit, OnChanges {
this.chatServiceOnNewMessage(this.room);
}
else{
let dataMessage;
if(this.typeRoom === true){
dataMessage = {
member: this.username,
roomName: this.room,
}
}
else{
dataMessage = {
sender: this.username,
receiver: this.room,
}
}
this.chatservice.setUrl(environment.urlCPR);
this.messageservice.sendMessage(environment.urlCPR,"conversations/getConv",{
sender: this.username,
receiver: this.room,
}).subscribe(data => {
this.messageservice.sendMessage(environment.urlCPR,"conversations/getConv",dataMessage).subscribe(data => {
if (data.status !== 'ok') {
console.log(data.data.reason);
} else {
@ -110,4 +126,99 @@ export class MessageComponent implements OnInit, OnChanges {
this.msg = '';
}
}
addMember(){
let dataMessage;
if(this.typeRoom === true){
dataMessage = {
member: this.username,
roomName: this.room,
}
}
else{
dataMessage = {
sender: this.username,
receiver: this.room,
}
}
this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
if (data.status !== 'ok') {
console.log(data.data.reason);
} else {
this.roomId = data.data._id;
const dialogRef = this.dialog.open(AddMemberDialogComponent, {
width: '50%',
data: {owner: this.username, conversationid: this.roomId}
});
dialogRef.afterClosed().subscribe(data2 => {
console.log(data2);
this.listMembers();
});
}
});
}
removeMember(){
let dataMessage;
if(this.typeRoom === true){
dataMessage = {
member: this.username,
roomName: this.room,
}
}
else{
dataMessage = {
sender: this.username,
receiver: this.room,
}
}
this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
if (data.status !== 'ok') {
console.log(data.data.reason);
} else {
this.roomId = data.data._id;
const dialogRef = this.dialog.open(RemoveMemberDialogComponent, {
width: '50%',
data: {owner: this.username, conversationid: this.roomId}
});
dialogRef.afterClosed().subscribe(data2 => {
console.log(data2);
this.listMembers();
});
}
});
}
listMembers(){
let dataMessage;
if(this.typeRoom === true){
dataMessage = {
member: this.username,
roomName: this.room,
}
}
else{
dataMessage = {
sender: this.username,
receiver: this.room,
}
}
this.messageservice.sendMessage(environment.urlCPR, "conversations/getConv", dataMessage).subscribe(data => {
if (data.status !== 'ok') {
console.log(data.data.reason);
} else {
this.roomId = data.data._id;
this.messageservice.sendMessage(environment.urlCPR, "conversations/getMembers", {conversationid: this.roomId}).subscribe(data2 => {
if (data2.status !== 'ok') {
console.log(data2.data.reason);
} else {
if(typeof data2.data[0] !== 'undefined'){
this.ulMsg.nativeElement.insertAdjacentHTML('beforeend', '<li><span class="text-danger">Membres: '+data2.data[0].members+'</span></li>');
}
}
});
}
});
}
}