peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-18 20:47:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'developer' of https://bitbucket.org/equilibriumito/gabinete-digital into developer

Browse Source
This commit is contained in:
Eudes Inácio
2021-09-27 08:50:08 +01:00
parent dedc9580a7 f4ec6826ad
commit 9cf239e3a4
9 changed files with 174 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/chat/group-messages/group-messages.page.html
+5
View File
@@ -99,6 +99,11 @@
</div>
</div>
</div>
<ion-fab horizontal="end" vertical="bottom" slot="fixed">
<ion-fab-button *ngIf="scrollToBottomBtn" (click)="scrollToBottomClicked()" color="light" size="small">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
</ion-fab>
</ion-content>
<!--
src/app/pages/chat/group-messages/group-messages.page.ts
+17 -3
View File
@@ -49,6 +49,7 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
capturedImage:any;
capturedImageTitle:any;
attendees: EventPerson[] = [];
scrollToBottomBtn = false;
@ViewChild('scrollMe') private myScrollContainer: ElementRef;
@@ -103,17 +104,24 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
window.addEventListener('scroll', this.scrollChangeCallback, true);
}
onContentScrolled(e) {
onContentScrolled(e) {
this.startPosition = e.srcElement.scrollTop;
let scroll = e.srcElement.scrollTop;
let windowHeight = e.srcElement.scrollHeight;
let containerHeight = windowHeight - e.srcElement.clientHeight;
if (scroll > this.currentPosition) {
//this.showButton = false;
//alert('BOTTOM');
} else {
//this.showButton = true;
//alert('UP');
this.scrollingOnce = false;
}
if((containerHeight - 100) > scroll){
this.scrollToBottomBtn = true;
}
else{
this.scrollToBottomBtn = false;
}
this.currentPosition = scroll;
}
@@ -130,6 +138,12 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
} catch(err) { }
}
scrollToBottomClicked(): void {
try {
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
} catch(err) { }
}
getRoomInfo(){
this.showLoader = true;
this.chatService.getRoomInfo(this.roomId).subscribe(room=>{
src/app/pages/chat/messages/messages.page.html
+5
View File
@@ -74,6 +74,11 @@
</div>
</div>
</div>
<ion-fab horizontal="end" vertical="bottom" slot="fixed">
<ion-fab-button *ngIf="scrollToBottomBtn" (click)="scrollToBottomClicked()" color="light" size="small">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
</ion-fab>
</ion-content>
src/app/pages/chat/messages/messages.page.ts
+22 -3
View File
@@ -45,6 +45,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
private scrollChangeCallback: () => void;
currentPosition: any;
startPosition: number;
scrollToBottomBtn = false;
attendees: EventPerson[] = [];
constructor(
@@ -122,23 +123,41 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
} catch(err) { }
}
scrollToBottomClicked(): void {
try {
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
} catch(err) { }
}
ngAfterViewInit() {
this.scrollChangeCallback = () => this.onContentScrolled(event);
window.addEventListener('scroll', this.scrollChangeCallback, true);
}
onContentScrolled(e) {
onContentScrolled(e) {
this.startPosition = e.srcElement.scrollTop;
let scroll = e.srcElement.scrollTop;
let windowHeight = e.srcElement.scrollHeight;
let containerHeight = windowHeight - e.srcElement.clientHeight;
console.log(this.startPosition);
console.log(windowHeight);
if (scroll > this.currentPosition) {
//this.showButton = false;
//alert('BOTTOM');
} else {
//this.showButton = true;
//alert('UP');
this.scrollingOnce = false;
}
if((containerHeight - 100) > scroll){
this.scrollToBottomBtn = true;
}
else{
this.scrollToBottomBtn = false;
}
this.currentPosition = scroll;
console.log(this.currentPosition);
}
ngOnDestroy() {
src/app/shared/chat/group-messages/group-messages.page.html
+16
View File
@@ -98,6 +98,22 @@
</div>
</div>
</div>
<ion-fab horizontal="end" vertical="bottom" slot="fixed">
<ion-fab-button *ngIf="scrollToBottomBtn" (click)="scrollToBottomClicked()" color="light" size="small">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
<!-- <ion-fab-list side="start">
<ion-fab-button color="light">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
<ion-fab-button color="light">
<ion-icon name="logo-twitter"></ion-icon>
</ion-fab-button>
<ion-fab-button color="light">
<ion-icon name="logo-vimeo"></ion-icon>
</ion-fab-button>
</ion-fab-list> -->
</ion-fab>
</ion-content>
src/app/shared/chat/group-messages/group-messages.page.ts
+19 -3
View File
@@ -54,6 +54,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
private scrollChangeCallback: () => void;
currentPosition: any;
startPosition: number;
scrollToBottomBtn = false;
@Input() roomId:string;
@Output() closeAllDesktopComponents:EventEmitter<any> = new EventEmitter<any>();
@@ -158,20 +159,35 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
} catch(err) { }
}
scrollToBottomClicked(): void {
try {
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
} catch(err) { }
}
ngAfterViewInit() {
this.scrollChangeCallback = () => this.onContentScrolled(event);
window.addEventListener('scroll', this.scrollChangeCallback, true);
}
onContentScrolled(e) {
onContentScrolled(e) {
this.startPosition = e.srcElement.scrollTop;
let scroll = e.srcElement.scrollTop;
let windowHeight = e.srcElement.scrollHeight;
let containerHeight = windowHeight - e.srcElement.clientHeight;
if (scroll > this.currentPosition) {
//this.showButton = false;
//alert('BOTTOM');
} else {
//this.showButton = true;
//alert('UP');
this.scrollingOnce = false;
}
if((containerHeight - 100) > scroll){
this.scrollToBottomBtn = true;
}
else{
this.scrollToBottomBtn = false;
}
this.currentPosition = scroll;
}
src/app/shared/chat/messages/messages.page.html
+28 -2
View File
@@ -31,8 +31,18 @@
</ion-refresher-content>
</ion-refresher>
<div class="messages" #scrollMe>
<div class="container-width-100" *ngFor="let msg of chatMessageStore.message[roomId]; let last = last">
<div class='incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45'>
<div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of chatMessageStore.message[roomId]; let last = last">
<div class='message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45'>
<div class="message-item-options d-flex justify-content-end">
<fa-icon (click)="mesageItemDropdownOptions=true" icon="chevron-down" class="message-options-icon"></fa-icon>
<!-- <div class="mesage-item-dropdown-options" *ngIf="mesageItemDropdownOptions">
<ion-label>Apagar mensagem</ion-label>
</div> -->
<ion-select hidden class="message-options-icon" interface="popover">
<ion-select-option value="nes">Apagar mensagem</ion-select-option>
</ion-select>
</div>
<div class="title">
<ion-label>{{msg.u.name}}</ion-label>
<span class="time">{{showDateDuration(msg._updatedAt)}}</span>
@@ -69,6 +79,22 @@
</div>
</div>
</div>
<ion-fab horizontal="end" vertical="bottom" slot="fixed">
<ion-fab-button *ngIf="scrollToBottomBtn" (click)="scrollToBottomClicked()" color="light" size="small">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
<!-- <ion-fab-list side="start">
<ion-fab-button color="light">
<ion-icon name="chevron-down"></ion-icon>
</ion-fab-button>
<ion-fab-button color="light">
<ion-icon name="logo-twitter"></ion-icon>
</ion-fab-button>
<ion-fab-button color="light">
<ion-icon name="logo-vimeo"></ion-icon>
</ion-fab-button>
</ion-fab-list> -->
</ion-fab>
</ion-content>
src/app/shared/chat/messages/messages.page.ts
+22 -4
View File
@@ -50,6 +50,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
private scrollChangeCallback: () => void;
currentPosition: any;
startPosition: number;
mesageItemDropdownOptions: boolean = false;
scrollToBottomBtn = false;
constructor(
public popoverController: PopoverController,
@@ -122,6 +124,13 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
} catch(err) { }
}
scrollToBottomClicked(): void {
try {
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
//this.scrollingOnce = false;
} catch(err) { }
}
ngAfterViewInit() {
this.scrollChangeCallback = () => this.onContentScrolled(event);
window.addEventListener('scroll', this.scrollChangeCallback, true);
@@ -130,17 +139,26 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
onContentScrolled(e) {
this.startPosition = e.srcElement.scrollTop;
let scroll = e.srcElement.scrollTop;
let windowHeight = e.srcElement.scrollHeight;
let containerHeight = windowHeight - e.srcElement.clientHeight;
console.log(containerHeight);
console.log(e.srcElement.clientHeight);
if (scroll > this.currentPosition) {
//this.showButton = false;
//alert('BOTTOM');
} else {
//this.showButton = true;
//alert('UP');
this.scrollingOnce = false;
}
if((containerHeight - 100) > scroll){
this.scrollToBottomBtn = true;
}
else{
this.scrollToBottomBtn = false;
}
this.currentPosition = scroll;
/* console.log(this.currentPosition);
console.log(this.scrollingOnce); */
}
ngOnDestroy() {
src/global.scss
+40
View File
@@ -1072,6 +1072,46 @@ ngx-mat-datetime-content{
}
}
.messages{
.messages-list-item-wrapper{
.message-item{
.message-item-options{
.message-options-icon{
display: none;
padding-left: 10px;
padding-right: 0px;
position: absolute;
//background-color: red;
//box-shadow: rgba(0, 30, 0, 0.15) 1.95px 1.95px 2.6px;
}
.mesage-item-dropdown-options{
display: none;
margin-top: 15px;
position: absolute;
border: 1px solid red;
}
}
.title{
//border: 1px solid blue;
}
}
.incoming-true:hover{
.message-options-icon{
display: block;
background-color: #ebebeb;
}
}
.incoming-false:hover{
.message-options-icon{
display: block;
background-color: #e4f4fe;
}
}
}
}
.message-attachments{
border-radius: 5px;
background-color: #42b9fe13;