mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-20 13:26:08 +00:00
set last message
This commit is contained in:
@@ -3,12 +3,11 @@
|
||||
<div class="main-header">
|
||||
<div class="title-content width-100">
|
||||
<div class="back-icon">
|
||||
<!-- <ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/Theme/doneIt/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
<button class="btn-no-color cursor-pointer" >
|
||||
<button class="btn-no-color cursor-pointer" (click)="dismiss()" >
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'doneIt' " slot="end" src='assets/images/theme/{{ThemeService.currentTheme}}/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " slot="end" src='assets/images/theme/gov/icons-calendar-arrow-left.svg'></ion-icon>
|
||||
</button> -->
|
||||
</button>
|
||||
</div>
|
||||
<div class="div-title">
|
||||
<ion-label class="title">Editar Mensagem</ion-label>
|
||||
@@ -18,34 +17,33 @@
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="main-content">
|
||||
|
||||
<div class="old-message-container d-flex justify-center">
|
||||
<div class="old-message" style="white-space: pre-line;">{{ oldMessage }}</div>
|
||||
</div>
|
||||
<div class="main-content">
|
||||
|
||||
|
||||
<div class="type-message mt-40-em">
|
||||
<ion-textarea #messageInput clearOnEdit="true" placeholder="Escrever uma mensagem" class="message-input" rows="1" [(ngModel)]="message" (keyup.enter)="save()" ></ion-textarea>
|
||||
</div>
|
||||
<div class="old-message-container d-flex justify-center">
|
||||
<div class="old-message" style="white-space: pre-line;">{{ oldMessage }}</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
<ion-footer class="ion-no-border">
|
||||
<ion-toolbar class="footer-toolbar px-20">
|
||||
<ion-buttons slot="start">
|
||||
<button class="btn-ok" fill="clear" color="#fff" (click)="save()">
|
||||
<ion-label>Enviar</ion-label>
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<button class="btn-cancel" fill="clear" color="#061b52" (click)="dismiss()" >
|
||||
<ion-label>Cancelar</ion-label>
|
||||
</button>
|
||||
</ion-buttons>
|
||||
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
|
||||
|
||||
<div class="d-flex align-center mt-40-em mb-40-em mr-20">
|
||||
<div class="type-message flex-1 ml-30 mr-20">
|
||||
<ion-textarea
|
||||
#messageInput
|
||||
placeholder="Escrever uma mensagem"
|
||||
class="message-input "
|
||||
rows="1"
|
||||
autoGrow="true"
|
||||
[(ngModel)]="message"
|
||||
(keyup.enter)="save()"
|
||||
clearOnEdit="false"
|
||||
></ion-textarea>
|
||||
</div>
|
||||
<button class="btn-no-color" (click)="save()">
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@@ -64,14 +64,13 @@
|
||||
overflow:auto;
|
||||
padding: 0 0 0 0;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.type-message {
|
||||
.type-message {
|
||||
display: flex;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 25px;
|
||||
margin: 0 30px 0 30px;
|
||||
align-items: center;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -88,7 +87,3 @@
|
||||
display: inline;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
:host {
|
||||
height: 400px;
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
import { ModalController, PopoverController } from '@ionic/angular';
|
||||
import { ThemeService } from 'src/app/services/theme.service'
|
||||
|
||||
@Component({
|
||||
@@ -16,7 +16,7 @@ export class EditMessagePage implements OnInit {
|
||||
oldMessage: string
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
public popoverController: PopoverController,
|
||||
public ThemeService: ThemeService,
|
||||
) {}
|
||||
|
||||
@@ -29,13 +29,11 @@ export class EditMessagePage implements OnInit {
|
||||
}
|
||||
|
||||
dismiss() {
|
||||
this.modalController.dismiss();
|
||||
this.popoverController.dismiss();
|
||||
}
|
||||
|
||||
save() {
|
||||
// Implement your save logic here
|
||||
console.log('Updated Message:', this.message);
|
||||
this.modalController.dismiss({
|
||||
this.popoverController.dismiss({
|
||||
'message': this.message
|
||||
});
|
||||
}
|
||||
|
||||
@@ -60,6 +60,13 @@
|
||||
}"
|
||||
>
|
||||
|
||||
<!-- Emoji Picker -->
|
||||
<div *ngIf="selectedMessage === message" class="emoji-picker mr-20" [ngStyle]="{'bottom': '0', 'right': '0'}">
|
||||
<span *ngFor="let emoji of emojis" (click)="addReaction(message, emoji)" class="emoji-icon">
|
||||
{{ emoji }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="message-container rotate-div" *ngIf="message.showMessage">
|
||||
<div class="d-flex justify-content-between">
|
||||
<div>
|
||||
@@ -132,7 +139,7 @@
|
||||
<div>
|
||||
<div class="message-item-options d-flex justify-content-end">
|
||||
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon>
|
||||
<mat-menu #beforeMenu="matMenu" xPosition="before">
|
||||
<mat-menu class="custom-menu" #beforeMenu="matMenu" xPosition="before">
|
||||
<button (click)="messageDelete(message)" class="menuButton">Apagar mensagem</button>
|
||||
<button *ngIf="!message.hasAttachment" (click)="editMessage(message)" class="menuButton">Editar mensagem</button>
|
||||
<button (click)="toggleEmojiPicker(message)" class="menuButton">Reagir mensagem</button>
|
||||
@@ -151,12 +158,6 @@
|
||||
<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">
|
||||
{{ emoji }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="message-container rotate-div" *ngIf="message.isDeleted == true">
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { AfterViewInit, Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';
|
||||
import { AfterViewInit, Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
|
||||
import { GestureController, ModalController, NavParams, PopoverController, Platform } from '@ionic/angular';
|
||||
import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
|
||||
import { ExpedientTaskModalPageNavParamsTask } from 'src/app/models/ExpedientTaskModalPage';
|
||||
@@ -144,7 +144,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
isAdmin = true
|
||||
RoomTypeEnum = RoomType
|
||||
IMessageType = IMessageType
|
||||
|
||||
handleClickActive = true
|
||||
|
||||
constructor(
|
||||
public popoverController: PopoverController,
|
||||
@@ -219,6 +219,17 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
this.chatServiceService.getRoomById(this.roomId)
|
||||
}
|
||||
|
||||
@HostListener('document:click', ['$event'])
|
||||
handleClickOutside(event: Event) {
|
||||
if (!this.handleClickActive) return;
|
||||
|
||||
const clickedInside = (event.target as HTMLElement).closest('.mat-menu-content');
|
||||
if (!clickedInside) {
|
||||
this.selectedMessage = null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async getMessages() {
|
||||
|
||||
|
||||
@@ -660,6 +671,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
|
||||
ngOnDestroy() {
|
||||
window.removeEventListener('scroll', this.scrollChangeCallback, true);
|
||||
this.handleClickActive = false; // Disable the listener before component destruction
|
||||
}
|
||||
|
||||
async sendMessage() {
|
||||
@@ -901,7 +913,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
this.messages1[this.roomId].splice(index, 1);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
async takePictureMobile() {
|
||||
|
||||
@@ -1131,7 +1143,8 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
file: result.value.files[0].data,
|
||||
fileName: result.value.files[0].name,
|
||||
source: MessageAttachmentSource.Device,
|
||||
fileType: MessageAttachmentFileType.Doc
|
||||
fileType: MessageAttachmentFileType.Doc,
|
||||
description: result.value.files[0].name
|
||||
}]
|
||||
|
||||
this.messages1[this.roomId].push(message)
|
||||
@@ -1425,9 +1438,9 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
|
||||
async editMessage(message: any) {
|
||||
|
||||
const modal = await this.modalController.create({
|
||||
const modal = await this.popoverController.create({
|
||||
component: EditMessagePage,
|
||||
cssClass: '',
|
||||
cssClass: 'edit-message',
|
||||
componentProps: {
|
||||
message: message.message,
|
||||
roomId: this.roomId,
|
||||
@@ -1448,11 +1461,11 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
toggleEmojiPicker(message: any) {
|
||||
toggleEmojiPicker(message: MessageViewModal) {
|
||||
if (this.selectedMessage === message) {
|
||||
this.selectedMessage = null; // Close the picker if it's already open
|
||||
} else {
|
||||
this.selectedMessage = message; // Open the picker for the selected message
|
||||
this.selectedMessage = message; // Open the picker for the selected message
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user