diff --git a/src/app/pages/chat/chat-routing.module.ts b/src/app/pages/chat/chat-routing.module.ts index dd3a97dfb..7e318d35b 100644 --- a/src/app/pages/chat/chat-routing.module.ts +++ b/src/app/pages/chat/chat-routing.module.ts @@ -26,6 +26,10 @@ const routes: Routes = [ { path: 'messages', loadChildren: () => import('./messages/messages.module').then( m => m.MessagesPageModule) + }, + { + path: 'edit-group', + loadChildren: () => import('./edit-group/edit-group.module').then( m => m.EditGroupPageModule) } ]; diff --git a/src/app/pages/chat/chat.page.ts b/src/app/pages/chat/chat.page.ts index 7da07e654..e5b25c79e 100644 --- a/src/app/pages/chat/chat.page.ts +++ b/src/app/pages/chat/chat.page.ts @@ -56,7 +56,7 @@ export class ChatPage implements OnInit { }); this.doRefresh(); - this.loadJoinedRooms(); + /* this.loadJoinedRooms(); */ } loadJoinedRooms(){ this.chatService.loadJoinedRooms().subscribe(res => { @@ -70,7 +70,7 @@ export class ChatPage implements OnInit { /* setInterval(()=>{ */ this.getDirectMessages(); this.getGroups(); - this.customRoom(); + /* this.customRoom(); */ /* }, 2000); */ } customRoom(){ @@ -89,8 +89,8 @@ export class ChatPage implements OnInit { console.log(res.ims); this.userDirectMessages = res.ims.sort((a,b)=>{ - var dateA = new Date(a.lastMessage._updatedAt).getTime(); - var dateB = new Date(b.lastMessage._updatedAt).getTime(); + var dateA = new Date(a._updatedAt).getTime(); + var dateB = new Date(b._updatedAt).getTime(); return dateB - dateA; }); console.log(this.userDirectMessages); diff --git a/src/app/pages/chat/edit-group/edit-group-routing.module.ts b/src/app/pages/chat/edit-group/edit-group-routing.module.ts new file mode 100644 index 000000000..bb3c59158 --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group-routing.module.ts @@ -0,0 +1,17 @@ +import { NgModule } from '@angular/core'; +import { Routes, RouterModule } from '@angular/router'; + +import { EditGroupPage } from './edit-group.page'; + +const routes: Routes = [ + { + path: '', + component: EditGroupPage + } +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class EditGroupPageRoutingModule {} diff --git a/src/app/pages/chat/edit-group/edit-group.module.ts b/src/app/pages/chat/edit-group/edit-group.module.ts new file mode 100644 index 000000000..f5cbe4eae --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group.module.ts @@ -0,0 +1,22 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { FormsModule } from '@angular/forms'; + +import { IonicModule } from '@ionic/angular'; + +import { EditGroupPageRoutingModule } from './edit-group-routing.module'; + +import { EditGroupPage } from './edit-group.page'; +import { SharedModule } from 'src/app/shared/shared.module'; + +@NgModule({ + imports: [ + CommonModule, + FormsModule, + IonicModule, + SharedModule, + EditGroupPageRoutingModule + ], + declarations: [EditGroupPage] +}) +export class EditGroupPageModule {} diff --git a/src/app/pages/chat/edit-group/edit-group.page.html b/src/app/pages/chat/edit-group/edit-group.page.html new file mode 100644 index 000000000..aeb1e2f1e --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group.page.html @@ -0,0 +1,40 @@ + + + + + + + + + Alterar Nome do grupo + + + + + + + + + + + + + + + Grupo Ultra-secreto + + + + + + + + + + + + + + + + diff --git a/src/app/pages/chat/edit-group/edit-group.page.scss b/src/app/pages/chat/edit-group/edit-group.page.scss new file mode 100644 index 000000000..428f62e08 --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group.page.scss @@ -0,0 +1,151 @@ +ion-content{ + --background:transparent; +} +.header-toolbar{ + --background:transparent; + --opacity: 1; +} +.div-top-header{ + width: 400px; + margin: 0 auto; + background-color: #0782c9; + overflow: auto; + padding-top: 15px; + border: 0!important; + + .div-search{ + font-size: 45px; + float: left; + margin: 0 0 0 10px + } + .div-logo{ + background: transparent; + width: 140px; + margin: 5px 0 0px 71px; + float: left; + } + .div-logo img{ + width: 100%; + } + .div-profile{ + font-size: 45px; + float: right; + margin-right: 10px; + } + + } + .main-header{ + width: 100%; /* 400px */ + height: 100%; + font-family: Roboto; + border-top-left-radius: 25px; + border-top-right-radius: 25px; + background-color: #fff; + overflow:hidden; + padding: 30px 20px 0px 20px; + color:#000; + transform: translate3d(0, 1px, 0); + + .title-content{ + width: 360px; + margin: 0px auto; + overflow: auto; + padding: 0 !important; + background: #fff; + + .left{ + width: 37px; + float: left; + font-size: 35px; + overflow: auto; + } + .middle{ + padding: 0!important; + float: left; + width: 221px; + margin: 2.5px 0 0 5px; + } + .right{ + padding: 0!important; + float: right; + font-size: 15px; + color: #0782c9; + margin: 8px 0 0 5px; + } + } + + .title{ + font-size: 25px; + } + .div-icon{ + width: 40px; + float: right; + font-size: 35px; + overflow: auto; + padding: 1px; + } + .div-icon ion-icon{ + float: right; + padding-left: 20px; + } + + + } + .main-content{ + width: 100%; /* 400px */ + height: 100%; + font-family: Roboto; + margin: 0 auto; + background-color: #fff; + overflow:auto; + padding: 15px 20px 0 20px; + + .item-container{ + width: 360px; + margin: 15px auto; + border: 1px solid #ebebeb; + border-radius: 5px; + padding-left: 10px; + } + + .item-container-no-border{ + display: flex; + width: 360px; + margin: 25px auto; + border-radius: 5px; + align-items: center; + } + + .item-container-no-border ion-label{ + padding-left: 10px; + font-size: 12px; + color: #000; + } + } + + .container-div{ + margin-bottom: 15px; + overflow: auto; + + .ion-item-class-2{ + width: 360px; + margin: 0px auto; + + .ion-icon-class{ + width: 45px; + height: 45px; + float: left; + padding: 10px; + font-size: 25px; + } + } + .ion-input-class{ + width: 315px; + height: 45px; + border: 1px solid #ebebeb; + border-radius: 5px; + padding-left: 5px; + padding-right: 10px; + float: left; + } + } diff --git a/src/app/pages/chat/edit-group/edit-group.page.spec.ts b/src/app/pages/chat/edit-group/edit-group.page.spec.ts new file mode 100644 index 000000000..ee3f62d13 --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group.page.spec.ts @@ -0,0 +1,24 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { IonicModule } from '@ionic/angular'; + +import { EditGroupPage } from './edit-group.page'; + +describe('EditGroupPage', () => { + let component: EditGroupPage; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ EditGroupPage ], + imports: [IonicModule.forRoot()] + }).compileComponents(); + + fixture = TestBed.createComponent(EditGroupPage); + component = fixture.componentInstance; + fixture.detectChanges(); + })); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pages/chat/edit-group/edit-group.page.ts b/src/app/pages/chat/edit-group/edit-group.page.ts new file mode 100644 index 000000000..dad540578 --- /dev/null +++ b/src/app/pages/chat/edit-group/edit-group.page.ts @@ -0,0 +1,170 @@ +import { Component, OnInit } from '@angular/core'; +import { ModalController, NavParams, PickerController } from '@ionic/angular'; +import { ChatService } from 'src/app/services/chat.service'; + +@Component({ + selector: 'app-edit-group', + templateUrl: './edit-group.page.html', + styleUrls: ['./edit-group.page.scss'], +}) +export class EditGroupPage implements OnInit { + showLoader: boolean; + displayDuration: any; + showDuration: boolean; + selectedDuration = ['','','']; + groupName:string; + room:any; + + constructor( + private modalController: ModalController, + private pickerController: PickerController, + private chatService: ChatService, + private navParams: NavParams, + ) { + this.room = this.navParams.get('room'); + this.groupName = this.room.name.split('-').join(' '); + } + + ngOnInit() { + console.log(this.room); + } + + close(){ + this.modalController.dismiss(); + } + + changeGroupName(){ + if(this.groupName.trim().length > 1){ + let name = this.groupName.split(' ').join('-'); + let body = { + "roomId": this.room._id, + "name": name, + } + this.chatService.renameGroup(body).subscribe(res=>{ + console.log(res); + }); + this.close(); + } + else{ + console.log("Invalid name!"); + } + } + _ionChange(event){ + this.showDuration = event.detail.checked; + } + async showPicker(){ + const picker = await this.pickerController.create({ + cssClass: '', + buttons: [ + { + text: 'Cancelar', role: 'cancel', cssClass: 'btn-cancel' + }, + { + text: 'Ok', + cssClass: 'btn-cancel', + handler:(value:any)=>{ + console.log('button done pressed'); + this.selectedDuration = [ + value.days.value, + value.hours.value, + value.minutes.value, + ] + console.log(this.selectedDuration); + if(value.days.value != null && value.hours.value != null && value.minutes.value != null){ + if(value.days.value > 0){ + if(value.days.value == 1){ + if(value.hours.value == 1){ + this.displayDuration = value.days.value + " day " + + value.hours.value + " hora " + + value.minutes.value + " minutos"; + } + else{ + this.displayDuration = value.days.value + " days " + + value.hours.value + " horas " + + value.minutes.value + " minutos"; + } + } + else{ + if(value.hours.value == 1){ + this.displayDuration = value.days.value + " days " + + value.hours.value + " hora " + + value.minutes.value + " minutos"; + } + else{ + this.displayDuration = value.days.value + " days " + + value.hours.value + " horas " + + value.minutes.value + " minutos"; + } + } + } + else{ + if(value.hours.value == 1){ + this.displayDuration = value.hours.value + " hora " + + value.minutes.value + " minutos"; + } + else{ + this.displayDuration = value.hours.value + " horas " + + value.minutes.value + " minutos"; + } + } + } + }, + }, + ], + columns: [ + { + name: 'days', + prefix: 'Dias', + options: [ + { text: '0', value: 0 }, + { text: '1', value: 1 }, + { text: '2', value: 2 }, + { text: '3', value: 3 }, + { text: '4', value: 4 }, + ] + }, + { + name: 'hours', + prefix: 'Horas', + options: [ + { text: '0', value: 0 }, + { text: '1', value: 1 }, + { text: '2', value: 2 }, + { text: '3', value: 3 }, + { text: '4', value: 4 }, + { text: '5', value: 5 }, + { text: '6', value: 6 }, + { text: '7', value: 7 }, + { text: '8', value: 8 }, + ] + }, + { + name: 'minutes', + prefix: 'Minutos', + selectedIndex: 3, + options: [ + { text: '0', value: 0 }, + { text: '5', value: 5 }, + { text: '10', value: 10 }, + { text: '15', value: 15 }, + { text: '20', value: 20 }, + { text: '25', value: 25 }, + { text: '30', value: 30 }, + { text: '35', value: 35 }, + { text: '45', value: 45 }, + { text: '50', value: 50 }, + { text: '55', value: 55 }, + ] + } + ] + }); + await picker.present(); + picker.onDidDismiss().then(async data =>{ + let day = await picker.getColumn('days'); + let hour = await picker.getColumn('hours'); + let minutes = await picker.getColumn('minutes'); + }); + + } + +} diff --git a/src/app/pages/chat/group-messages/group-messages.page.ts b/src/app/pages/chat/group-messages/group-messages.page.ts index 48adf7fe6..f22a5cd97 100644 --- a/src/app/pages/chat/group-messages/group-messages.page.ts +++ b/src/app/pages/chat/group-messages/group-messages.page.ts @@ -106,30 +106,6 @@ export class GroupMessagesPage implements OnInit { this.message = ""; } - async actionSheet() { - const actionSheet = await this.actionSheetController.create({ - cssClass: 'my-custom-class', - buttons: [{ - text: 'Sair do grupo', - handler: () => { - console.log('Delete clicked'); - } - }, { - text: 'Alterar nome do grupo', - handler: () => { - console.log('Share clicked'); - } - }, { - text: 'Apagar o grupo', - handler: () => { - console.log('Play clicked'); - } - }, - ] - }); - await actionSheet.present(); - } - async openOptions(ev: any) { const popover = await this.popoverController.create({ component: ChatPopoverPage, @@ -143,6 +119,7 @@ export class GroupMessagesPage implements OnInit { await popover.present(); popover.onDidDismiss().then(res=>{ if(res.data){ + this.doRefresh(); this.modalController.dismiss(); }; @@ -182,5 +159,30 @@ export class GroupMessagesPage implements OnInit { }); } + /* async actionSheet() { + const actionSheet = await this.actionSheetController.create({ + cssClass: 'my-custom-class', + buttons: [{ + text: 'Sair do grupo', + handler: () => { + console.log('Delete clicked'); + } + }, { + text: 'Alterar nome do grupo1', + handler: () => { + console.log('Alterar nome do grupo'); + this.openChangeGroupName() + } + }, { + text: 'Apagar o grupo', + handler: () => { + console.log('Play clicked'); + } + }, + ] + }); + await actionSheet.present(); + } + */ } diff --git a/src/app/pages/chat/new-group/new-group.page.scss b/src/app/pages/chat/new-group/new-group.page.scss index d05552f41..428f62e08 100644 --- a/src/app/pages/chat/new-group/new-group.page.scss +++ b/src/app/pages/chat/new-group/new-group.page.scss @@ -149,6 +149,3 @@ ion-content{ float: left; } } - - - diff --git a/src/app/services/chat.service.ts b/src/app/services/chat.service.ts index 76c0ea9df..6c9f8330f 100644 --- a/src/app/services/chat.service.ts +++ b/src/app/services/chat.service.ts @@ -228,5 +228,8 @@ export class ChatService { } return this.http.get(environment.apiChatUrl+'groups.info', opts); } + renameGroup(body:any){ + return this.http.post(environment.apiChatUrl+'groups.rename', body, this.options); + } } diff --git a/src/app/shared/popover/chat-popover/chat-popover.page.html b/src/app/shared/popover/chat-popover/chat-popover.page.html index 99e7c0640..4f109ee1a 100644 --- a/src/app/shared/popover/chat-popover/chat-popover.page.html +++ b/src/app/shared/popover/chat-popover/chat-popover.page.html @@ -4,7 +4,7 @@ Sair do Grupo - Alterar nome do grupo + Alterar nome do grupo diff --git a/src/app/shared/popover/chat-popover/chat-popover.page.ts b/src/app/shared/popover/chat-popover/chat-popover.page.ts index e7e1b18f0..b4aaf0e5f 100644 --- a/src/app/shared/popover/chat-popover/chat-popover.page.ts +++ b/src/app/shared/popover/chat-popover/chat-popover.page.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; -import { NavParams, PopoverController } from '@ionic/angular'; +import { ModalController, NavParams, PopoverController } from '@ionic/angular'; +import { EditGroupPage } from 'src/app/pages/chat/edit-group/edit-group.page'; import { ChatService } from 'src/app/services/chat.service'; @Component({ @@ -12,6 +13,7 @@ export class ChatPopoverPage implements OnInit { constructor( private popoverController: PopoverController, + private modalController: ModalController, private navParams: NavParams, private chatService: ChatService, ) { @@ -57,5 +59,20 @@ export class ChatPopoverPage implements OnInit { } this.popoverController.dismiss(true); } + async openChangeGroupName(){ + const modal = await this.modalController.create({ + component: EditGroupPage, + componentProps: { + room: this.room, + }, + cssClass: 'contacts', + backdropDismiss: false + }); + + await modal.present(); + modal.onDidDismiss().then(()=>{ + return true; + }); + } }