mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
fix delete message on ui layer
This commit is contained in:
Peter Maquiran
@@ -47,12 +47,13 @@
|
||||
<div
|
||||
*ngFor="let message of messages1[roomId]; let messageIndex = index" class="messages-list-item-wrapper px-10-em"
|
||||
[ngClass]="{
|
||||
'info-meeting': message.messageType == IMessageType.information,
|
||||
'my-message': message.messageType != IMessageType.information && message?.sender?.wxUserId === SessionStore.user.UserId,
|
||||
'other-message': message.messageType != IMessageType.information && message?.sender?.wxUserId !== SessionStore.user.UserId
|
||||
'info-meeting': message.messageType == IMessageType.information && !message.ballon,
|
||||
'info-ballon': message.ballon,
|
||||
'my-message': message.messageType == IMessageType.normal && message?.sender?.wxUserId === SessionStore.user.UserId,
|
||||
'other-message': message.messageType == IMessageType.normal && message?.sender?.wxUserId !== SessionStore.user.UserId
|
||||
}"
|
||||
>
|
||||
<div class="message-container rotate-div" *ngIf="message.isDeleted != true && message.messageType != IMessageType.information">
|
||||
<div class="message-container rotate-div" *ngIf="message.showMessage">
|
||||
<div class="d-flex justify-content-between">
|
||||
<div>
|
||||
<div style="white-space: pre-line;">
|
||||
@@ -83,7 +84,6 @@
|
||||
Mandou uma mensagen com visualização única
|
||||
</div>
|
||||
|
||||
|
||||
<div *ngIf="SessionStore.user.UserId != message.sender.wxUserId && message.oneShot == true">
|
||||
<!-- <div *ngIf="message.oneShot == true" class="cursor-pointer"> -->
|
||||
<div (click)="viewOnce($event, message, i)">
|
||||
@@ -136,11 +136,8 @@
|
||||
<ion-icon *ngIf="messageStatus(message) == 'enviado'" src="assets/images/check-solid.svg"></ion-icon>
|
||||
<ion-icon *ngIf="messageStatus(message) == 'allReceived'" src="assets/images/check-double-solid.svg"></ion-icon>
|
||||
<ion-icon *ngIf="messageStatus(message) == 'allViewed'" src="assets/images/check-double-solid -viewed.svg"></ion-icon>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Emoji Picker -->
|
||||
<div *ngIf="selectedMessage === message" class="emoji-picker" [ngStyle]="{'bottom': '0', 'right': '0'}">
|
||||
<span *ngFor="let emoji of emojis" (click)="addReaction(message, emoji)" class="emoji-icon">
|
||||
@@ -154,7 +151,9 @@
|
||||
<div *ngIf="message.messageType == IMessageType.information" class="text-center">
|
||||
{{ message.message }}
|
||||
</div>
|
||||
<!-- current emoji -->
|
||||
<div *ngIf="message.ballon" class="text-center ballon">
|
||||
{{ message.message }}
|
||||
</div>
|
||||
<div class="rotate-div emoji-container" *ngIf="message.isDeleted != true && message.messageType != IMessageType.information">
|
||||
<span *ngFor="let reaction of message.reactions" class="emoji-icon">
|
||||
{{ reaction.reaction }}
|
||||
|
||||
@@ -137,6 +137,21 @@ ion-content {
|
||||
}
|
||||
}
|
||||
|
||||
.info-ballon {
|
||||
text-align: center;
|
||||
font-size: rem(13);
|
||||
color: #262420;
|
||||
padding: 10px;
|
||||
margin: 10px auto;
|
||||
line-height: 2.2rem;
|
||||
border-radius: 8px;
|
||||
.ballon {
|
||||
background: var(--chat-alert-msg-color);
|
||||
padding: 0px 10px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.messages {
|
||||
font-size: rem(13);
|
||||
font-family: Roboto;
|
||||
@@ -510,4 +525,4 @@ ion-footer {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
margin-bottom: -15px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,8 +49,10 @@ import { MessageTable } from 'src/app/infra/database/dexie/instance/chat/schema/
|
||||
import { RoomTable } from 'src/app/infra/database/dexie/instance/chat/schema/room';
|
||||
import { TypingTable } from 'src/app/infra/database/dexie/instance/chat/schema/typing';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { v4 as uuidv4 } from 'uuid'
|
||||
import { RoomViewModel } from '../../store/model/room';
|
||||
import { MessageViewModal } from '../../store/model/message';
|
||||
import { XBallon } from '../../utils/messageBallon';
|
||||
import { whatsappDate } from 'src/app/ui/shared/utils/whatappdate';
|
||||
@Component({
|
||||
selector: 'app-messages',
|
||||
templateUrl: './messages.page.html',
|
||||
@@ -91,7 +93,6 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
scrollToBottomBtn = false;
|
||||
longPressActive = false;
|
||||
downloadFile: string;
|
||||
|
||||
showAvatar = true;
|
||||
|
||||
recording = false;
|
||||
@@ -125,7 +126,6 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
roomStatus$: DexieObservable<Boolean >
|
||||
roomMessage$: DexieObservable<MessageTable[]>
|
||||
roomMembers$: Observable<MemberTable[] | undefined>
|
||||
//userTyping$: DexieObservable<TypingTable[] | undefined>
|
||||
userTyping$: TypingTable[] | undefined
|
||||
newMessagesStream!: Subscription
|
||||
|
||||
@@ -143,7 +143,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
messageTypingSubject: Subscription
|
||||
messageOnReconnectSubject: Subscription
|
||||
|
||||
messages1: {[key: string]: MessageEntity[]} = {}
|
||||
messages1: {[key: string]: MessageViewModal[]} = {}
|
||||
MessageAttachmentFileType = MessageAttachmentFileType
|
||||
MessageAttachmentFileSource = MessageAttachmentSource
|
||||
IMessageType = IMessageType
|
||||
@@ -155,6 +155,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
private worker: SharedWorker;
|
||||
private port: MessagePort;
|
||||
|
||||
date: {[key: string]: Object} = {}
|
||||
|
||||
constructor(
|
||||
public popoverController: PopoverController,
|
||||
private modalController: ModalController,
|
||||
@@ -186,56 +188,53 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
this.checkAudioPermission()
|
||||
//this.sendChunks()
|
||||
|
||||
this.worker = new SharedWorker('shared-worker.js');
|
||||
this.port = this.worker.port;
|
||||
// this.worker = new SharedWorker('shared-worker.js');
|
||||
// this.port = this.worker.port;
|
||||
|
||||
this.port.onmessage = (event) => {
|
||||
console.log('Received from worker:', event.data);
|
||||
}
|
||||
// this.port.onmessage = (event) => {
|
||||
// console.log('Received from worker:', event.data);
|
||||
// }
|
||||
|
||||
this.port.postMessage('hello');
|
||||
// this.port.postMessage('hello');
|
||||
}
|
||||
|
||||
sendChunks() {
|
||||
const base64String = 'data:video/mp4;base64,AAAAHGZ0eXBtcDQyAAAAAGlzb21tcDQyAAACAGlzb21tcDQyaXNvbXJtZGEAAAAHZnJlZS1ybWRhAAAAGXZmY2MtbGF2ZjU4LmEyLTkyLm12NTZjAGZyZWUtcm1kYQAAAAVyZWZsYXYAAABWZGF0YTqBgIAAAAs9AAABM/f/+6mpg6z+d0+j5adJHVD+lk75p0ntRFEyTlHT/GRYbDg4ODhISEhAQK/jMCAxCBAIEwMmJgAABNmY2MtbGF2ZjU4LmEyLTkyLm12NTZjAGZyZWUtcm1kYQAAAAVyZWZsYXY=';
|
||||
const chunkSize = Math.ceil(base64String.length / 2);
|
||||
const chunks = [
|
||||
{ chunk: base64String.slice(0, chunkSize), index: 0 },
|
||||
{ chunk: base64String.slice(chunkSize), index: 1 }
|
||||
];
|
||||
// sendChunks() {
|
||||
// const base64String = 'data:video/mp4;base64,AAAAHGZ0eXBtcDQyAAAAAGlzb21tcDQyAAACAGlzb21tcDQyaXNvbXJtZGEAAAAHZnJlZS1ybWRhAAAAGXZmY2MtbGF2ZjU4LmEyLTkyLm12NTZjAGZyZWUtcm1kYQAAAAVyZWZsYXYAAABWZGF0YTqBgIAAAAs9AAABM/f/+6mpg6z+d0+j5adJHVD+lk75p0ntRFEyTlHT/GRYbDg4ODhISEhAQK/jMCAxCBAIEwMmJgAABNmY2MtbGF2ZjU4LmEyLTkyLm12NTZjAGZyZWUtcm1kYQAAAAVyZWZsYXY=';
|
||||
// const chunkSize = Math.ceil(base64String.length / 2);
|
||||
// const chunks = [
|
||||
// { chunk: base64String.slice(0, chunkSize), index: 0 },
|
||||
// { chunk: base64String.slice(chunkSize), index: 1 }
|
||||
// ];
|
||||
|
||||
const identifier = uuidv4(); // You can set a unique identifier for the file
|
||||
// const identifier = uuidv4(); // You can set a unique identifier for the file
|
||||
|
||||
const totalChunks = chunks.length;
|
||||
// const totalChunks = chunks.length;
|
||||
|
||||
chunks.forEach((chunkData) => {
|
||||
const payload = {
|
||||
chunk: chunkData.chunk,
|
||||
identifier,
|
||||
index: chunkData.index,
|
||||
totalChunks
|
||||
};
|
||||
// chunks.forEach((chunkData) => {
|
||||
// const payload = {
|
||||
// chunk: chunkData.chunk,
|
||||
// identifier,
|
||||
// index: chunkData.index,
|
||||
// totalChunks
|
||||
// };
|
||||
|
||||
this.http.post('https://gdapi-dev.dyndns.info/stage/api/v2/File/UploadBase64Chunks', payload)
|
||||
.subscribe(response => {
|
||||
console.log('Chunk sent successfully:', response);
|
||||
}, error => {
|
||||
console.error('Error sending chunk:', error);
|
||||
});
|
||||
});
|
||||
}
|
||||
// this.http.post('https://gdapi-dev.dyndns.info/stage/api/v2/File/UploadBase64Chunks', payload)
|
||||
// .subscribe(response => {
|
||||
// console.log('Chunk sent successfully:', response);
|
||||
// }, error => {
|
||||
// console.error('Error sending chunk:', error);
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
|
||||
|
||||
this.roomData$ = this.RoomLocalRepository.getRoomByIdLive(this.roomId)
|
||||
|
||||
this.roomData$.subscribe(e => {
|
||||
// console.log(e)
|
||||
if(e) {
|
||||
this.roomType = e.roomType
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
this.getMessages();
|
||||
@@ -244,7 +243,6 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
this.listenToUpdateMessage();
|
||||
this.listenToSendMessage();
|
||||
|
||||
// this.roomMessage$ = this.messageRepositoryService.getItemsLive(this.roomId)
|
||||
this.roomMembers$ = this.MemberListLocalRepository.getRoomMemberByIdLive(this.roomId).pipe(
|
||||
tap((members) => {
|
||||
this.totalMembers = members.length
|
||||
@@ -258,7 +256,6 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
)
|
||||
|
||||
this.roomStatus$ = this.MemberListLocalRepository.allMemberOnline(this.roomId)
|
||||
// this.chatServiceService.getRoomById(this.roomId)
|
||||
|
||||
this.messageTypingSubject?.unsubscribe()
|
||||
this.messageTypingSubject = this.userTypingLocalRepository.getUserTypingLiveByRoomId(this.roomId).subscribe((e) => {
|
||||
@@ -307,7 +304,25 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
let messages = await this.messageLocalDataSourceService.getItems(this.roomId)
|
||||
|
||||
this.messages1[this.roomId] = []
|
||||
this.messages1[this.roomId] = messages
|
||||
this.date = {}
|
||||
const allMessage = [];
|
||||
|
||||
for(const message of messages) {
|
||||
const date = whatsappDate(message.sentAt, false)
|
||||
if(!this.date[date]) {
|
||||
this.date[date] = true
|
||||
const Ballon = XBallon(message)
|
||||
allMessage.push(Ballon)
|
||||
}
|
||||
|
||||
allMessage.push(new MessageViewModal(message))
|
||||
}
|
||||
|
||||
console.time("mappingTime");
|
||||
|
||||
this.messages1[this.roomId] = allMessage
|
||||
|
||||
console.timeEnd("mappingTime");
|
||||
|
||||
// if(messages.length >= 1) {
|
||||
// this.messages1[this.roomId].push(LastMessage)
|
||||
@@ -321,13 +336,11 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
this.messageOnReconnectSubject?.unsubscribe()
|
||||
this.messageOnReconnectSubject = this.chatServiceService.listenToMessageLoadHistory({roomId: this.roomId}).subscribe((messages) => {
|
||||
|
||||
console.log('message', messages);
|
||||
|
||||
for(const message of messages.data) {
|
||||
const found = this.messages1[this.roomId].find((e) => e.id == message.id)
|
||||
|
||||
if(!found) {
|
||||
const msg = new MessageEntity()
|
||||
const msg = new MessageViewModal(message as any)
|
||||
Object.assign(msg, message)
|
||||
this.messages1[this.roomId].push(msg)
|
||||
}
|
||||
@@ -387,17 +400,19 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
for(const message of this.messages1[this.roomId]) {
|
||||
|
||||
const me = message.info.find(e => e.memberId == SessionStore.user.UserId && typeof e.readAt == 'string')
|
||||
if(!message.meSender()) {
|
||||
const me = message.haveSeen(message.info)
|
||||
|
||||
if(!me) {
|
||||
Logger.info('send read at')
|
||||
if(!me) {
|
||||
Logger.info('send read at, sender '+ message.sender.wxFullName+ ' '+ message.message +'message id'+ message.id)
|
||||
|
||||
this.chatServiceService.sendReadAt({
|
||||
memberId: SessionStore.user.UserId,
|
||||
messageId: message.id,
|
||||
requestId: '',
|
||||
roomId: this.roomId
|
||||
})
|
||||
this.chatServiceService.sendReadAt({
|
||||
memberId: SessionStore.user.UserId,
|
||||
messageId: message.id,
|
||||
requestId: '',
|
||||
roomId: this.roomId
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -407,7 +422,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
this.messageReceiveSubject?.unsubscribe();
|
||||
this.messageReceiveSubject = this.chatServiceService.listenToIncomingMessage(this.roomId).subscribe(async (message) => {
|
||||
|
||||
this.messages1[this.roomId].push(message as MessageEntity)
|
||||
this.messages1[this.roomId].push(new MessageViewModal(message))
|
||||
|
||||
if(message.hasAttachment) {
|
||||
|
||||
@@ -440,7 +455,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
console.log('delete class', deleteMessage);
|
||||
|
||||
const index = this.messages1[this.roomId].findIndex(e => e?.id === deleteMessage.id); // Use triple equals for comparison
|
||||
this.messages1[this.roomId][index].isDeleted = true
|
||||
this.messages1[this.roomId][index].delete()
|
||||
// if (index !== -1) { // Check if the item was found
|
||||
// console.log('delete ==')
|
||||
// this.messages1[this.roomId].splice(index, 1);
|
||||
@@ -474,6 +489,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
this.messageSendSubject = this.chatServiceService.listenToSendMessage(this.roomId).subscribe((updateMessage) => {
|
||||
|
||||
console.log({updateMessage})
|
||||
|
||||
const index = this.messages1[this.roomId].findIndex(e => e?.requestId === updateMessage.requestId); // Use triple equals for comparison
|
||||
|
||||
@@ -717,7 +733,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
//Converting base64 to blob
|
||||
const encodedData = this.audioRecordedDataUrl;
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.roomId = this.roomId
|
||||
|
||||
message.sentAt = new Date().toISOString()
|
||||
@@ -782,7 +798,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
async sendMessage() {
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.message = this.textField
|
||||
message.roomId = this.roomId
|
||||
|
||||
@@ -960,7 +976,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
if(compressedImage.isOk()) {
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.roomId = this.roomId
|
||||
message.oneShot = oneShot
|
||||
|
||||
@@ -981,7 +997,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
mimeType: 'image/'+picture.value.format
|
||||
}]
|
||||
|
||||
this.messages1[this.roomId].push(message)
|
||||
this.messages1[this.roomId].push(new MessageViewModal(message))
|
||||
setTimeout(() => {
|
||||
this.scrollToBottomClicked()
|
||||
}, 100)
|
||||
@@ -1017,7 +1033,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
// "title": res.data.selected.Assunto,
|
||||
// "description": res.data.selected.DocTypeDesc,
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.message = this.textField
|
||||
message.roomId = this.roomId
|
||||
|
||||
@@ -1037,7 +1053,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
docId: res.data.selected.Id,
|
||||
}]
|
||||
|
||||
this.messages1[this.roomId].push(message)
|
||||
this.messages1[this.roomId].push(new MessageViewModal(message))
|
||||
setTimeout(() => {
|
||||
this.scrollToBottomClicked()
|
||||
}, 100)
|
||||
@@ -1105,7 +1121,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
if(compressedImage.isOk()) {
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.roomId = this.roomId
|
||||
|
||||
message.sentAt = new Date().toISOString()
|
||||
@@ -1163,7 +1179,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
|
||||
|
||||
if(fileBase64.isOk()) {
|
||||
|
||||
const message = new MessageEntity();
|
||||
const message = new MessageViewModal();
|
||||
message.roomId = this.roomId
|
||||
|
||||
message.sentAt = new Date().toISOString()
|
||||
|
||||
Reference in New Issue
Block a user