diff --git a/src/app/pages/chat/chat.page.scss b/src/app/pages/chat/chat.page.scss
index ce22de9f4..2d381ea85 100644
--- a/src/app/pages/chat/chat.page.scss
+++ b/src/app/pages/chat/chat.page.scss
@@ -63,6 +63,7 @@
.item{
width: 100%;
border-bottom: 1px solid #ebebeb;
+ overflow: auto;
.item-icon{
width: 40px;
diff --git a/src/app/pages/chat/chat.page.ts b/src/app/pages/chat/chat.page.ts
index 76a4edeba..1bcb45c77 100644
--- a/src/app/pages/chat/chat.page.ts
+++ b/src/app/pages/chat/chat.page.ts
@@ -5,6 +5,7 @@ import { ChatService } from 'src/app/services/chat.service';
import { ConversationPage } from './conversation/conversation.page';
import { GroupMessagesPage } from './group-messages/group-messages.page';
import { MessagesPage } from './messages/messages.page';
+import { ContactsPage } from './messages/contacts/contacts.page';
import { NewGroupPage } from './new-group/new-group.page';
import { NewchatPage } from './newchat/newchat.page';
@@ -31,7 +32,7 @@ export class ChatPage implements OnInit {
ngOnInit() {
this.segment = "Contactos";
this.doRefresh();
- this.authService.getUserData();
+ /* this.authService.getUserData(); */
}
onSegmentChange(){
@@ -72,8 +73,8 @@ export class ChatPage implements OnInit {
}
async selectContact(){
const modal = await this.modalController.create({
- component: NewchatPage,
- cssClass: 'newchat',
+ component: ContactsPage,
+ cssClass: 'contacts',
backdropDismiss: false,
});
await modal.present();
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts-routing.module.ts b/src/app/pages/chat/group-messages/group-contacts/group-contacts-routing.module.ts
new file mode 100644
index 000000000..c998741ed
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts-routing.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { GroupContactsPage } from './group-contacts.page';
+
+const routes: Routes = [
+ {
+ path: '',
+ component: GroupContactsPage
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class GroupContactsPageRoutingModule {}
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts.module.ts b/src/app/pages/chat/group-messages/group-contacts/group-contacts.module.ts
new file mode 100644
index 000000000..9ec279e82
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts.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 { GroupContactsPageRoutingModule } from './group-contacts-routing.module';
+
+import { GroupContactsPage } from './group-contacts.page';
+import { SharedModule } from 'src/app/shared/shared.module';
+
+@NgModule({
+ imports: [
+ CommonModule,
+ FormsModule,
+ IonicModule,
+ SharedModule,
+ GroupContactsPageRoutingModule
+ ],
+ declarations: [GroupContactsPage]
+})
+export class GroupContactsPageModule {}
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.html b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.html
new file mode 100644
index 000000000..190194b56
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.html
@@ -0,0 +1,51 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{header}}
+
+
+
+
+
{{user.first}} {{user.last}}
+
+
+
+
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.scss b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.scss
new file mode 100644
index 000000000..cf9de70f9
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.scss
@@ -0,0 +1,127 @@
+.header-toolbar{
+ --background:transparent;
+ --opacity: 1;
+
+ .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);
+
+ .div-icon{
+ width: 40px;
+ float: right;
+ font-size: 35px;
+ overflow: auto;
+ padding: 1px;
+ }
+ .div-icon ion-icon{
+ float: right;
+ padding-left: 20px;
+ }
+ .title-content{
+ width: 360px;
+ margin: 0px auto;
+ overflow: auto;
+ padding: 0 !important;
+ }
+
+ .back-icon{
+ width: 37px;
+ float: left;
+ font-size: 35px;
+ overflow: auto;
+
+ }
+ .div-title{
+ width: 221px;
+ padding: 0!important;
+ float: left;
+ margin: 2.5px 0 0 5px;
+ }
+ .title{
+ font-size: 25px;
+ }
+ }
+ }
+ .toolbar-search{
+ --padding-top:0 !important;
+ --padding-bottom:0 !important;
+ --padding-start:0 !important;
+ --padding-end:0 !important;
+
+ .search{
+ border: 1px solid #ebebeb;
+ margin: 5px 20px 5px 20px;
+ border-radius: 5px;
+ }
+ .search ion-searchbar{
+ /* border: 1px solid green; */
+ width: 100%;
+ margin: 0 !important;
+ padding: 0 !important;
+ --border-radius: 5px;
+ --box-shadow: none;
+ overflow: auto;
+ --icon-color:#0d89d1;
+ }
+
+ }
+ ion-content{
+ --background:transparent;
+ }
+ .main-content{
+ width: 100%;
+ height: 100%;
+ font-family: Roboto;
+ margin: 0 auto;
+ background-color: #fff;
+ overflow:auto;
+ padding: 0 0 0 0;
+
+ .item-divider{
+ background: #ebebeb;
+ font-size: 15px;
+ margin: 10px 0 10px 0;
+ padding:5px 0 5px 20px;
+
+ }
+
+ .item-checkbox{
+ display: flex;
+ margin: 10px 20px 10px 20px !important;
+ overflow: auto;
+ align-items: center;
+
+ }
+
+ .item-checkbox ion-checkbox{
+ --border-color: #0d89d1;
+ --background-checked:#0d89d1;
+ float: left;
+ }
+
+ .item-checkbox p{
+ display: block;
+ margin: 0 !important;
+ width: 330px;
+ padding-left: 10px;
+ font-size: 15px;
+ color: #0d89d1;
+ float: left;
+ }
+ .item-checkbox ion-icon{
+ font-size: 10px;
+ float: left;
+ color:#99e47b;
+ margin-left: 10px;
+ }
+ }
+
+
\ No newline at end of file
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.spec.ts b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.spec.ts
new file mode 100644
index 000000000..dde2043a8
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.spec.ts
@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { GroupContactsPage } from './group-contacts.page';
+
+describe('GroupContactsPage', () => {
+ let component: GroupContactsPage;
+ let fixture: ComponentFixture
;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ GroupContactsPage ],
+ imports: [IonicModule.forRoot()]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(GroupContactsPage);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ }));
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.ts b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.ts
new file mode 100644
index 000000000..f109751bd
--- /dev/null
+++ b/src/app/pages/chat/group-messages/group-contacts/group-contacts.page.ts
@@ -0,0 +1,152 @@
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { GroupMessagesPage } from '../group-messages.page';
+
+@Component({
+ selector: 'app-group-contacts',
+ templateUrl: './group-contacts.page.html',
+ styleUrls: ['./group-contacts.page.scss'],
+})
+export class GroupContactsPage implements OnInit {
+ showLoader: boolean;
+ users = [];
+
+ contact: string[] = [" Ana M.", "Andre F.", "Bruno G.", "Catarina T", "Tiago"];
+
+ headers: HttpHeaders;
+ options:any;
+
+ contacts: Contact[] = [
+ {
+ first: 'Ana',
+ last: 'Manuel',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ },
+ {
+ first: 'Abdullah',
+ last: 'Hill',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ },
+ {
+ first: 'Batur',
+ last: 'Oymen',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ },
+ {
+ first: 'Bianca',
+ last: 'Costa',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ },
+ {
+ first: 'Zaya',
+ last: 'Mary',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ },
+ {
+ first: 'Tiago',
+ last: 'Kayaya',
+ url: 'https://randomuser.me/api/portraits/med/women/54.jpg',
+ }
+];
+
+ constructor(
+ private modalController: ModalController,
+ private http: HttpClient,
+ )
+ {
+ this.headers = new HttpHeaders();
+ this.headers = this.headers.set('Access-Control-Allow-Origin' , '*');
+ this.headers = this.headers.set('Access-Control-Allow-Methods', 'POST, GET, OPTIONS, PUT');
+ this.headers = this.headers.set('Accept','application/json');
+ this.headers = this.headers.set('content-type','application/json');
+
+
+ }
+
+ ngOnInit() {
+ this.loadUsers();
+
+ }
+
+ loadUsers(){
+ this.options = {
+ headers: this.headers,
+ };
+ /* this.http.get('https://randomuser.me/api/?results=100', this.options)
+ .subscribe(res => {
+ this.users = res['results'].sort((a,b) => {
+ if(a.name.first < b.name.first){
+ return -1;
+ }
+ if(a.name.first > b.name.first){
+ return 1;
+ }
+ return 0;
+ });
+ console.log(res);
+ console.log(this.users);
+ }); */
+ this.users = this.contacts.sort((a,b) => {
+ if(a.first < b.first){
+ return -1;
+ }
+ if(a.first > b.first){
+ return 1;
+ }
+ return 0;
+ });
+ }
+
+ separateLetter(record, recordIndex, records){
+ /* if(recordIndex == 0){
+ return record.name.first[0];
+ }
+
+ let first_prev = records[recordIndex - 1].name.first[0];
+ let first_current = record.name.first[0];
+
+ if(first_prev != first_current){
+ return first_current;
+ }
+ return null; */
+ if(recordIndex == 0){
+ return record.first[0];
+ }
+
+ let first_prev = records[recordIndex - 1].first[0];
+ let first_current = record.first[0];
+
+ if(first_prev != first_current){
+ return first_current;
+ }
+ return null;
+ }
+
+ doRefresh(event){
+
+ }
+ close(){
+ this.modalController.dismiss();
+ }
+ onChange(event){
+
+ }
+ clicked(){
+ console.log('clicked');
+
+ }
+ async groupMessages(){
+ const modal = await this.modalController.create({
+ component: GroupMessagesPage,
+ componentProps: {},
+ cssClass: 'contacts',
+ backdropDismiss: false
+ });
+
+ await modal.present();
+
+ modal.onDidDismiss();
+ }
+
+}
diff --git a/src/app/pages/chat/group-messages/group-messages-routing.module.ts b/src/app/pages/chat/group-messages/group-messages-routing.module.ts
index 5a4f0ae40..708ec8d8f 100644
--- a/src/app/pages/chat/group-messages/group-messages-routing.module.ts
+++ b/src/app/pages/chat/group-messages/group-messages-routing.module.ts
@@ -1,17 +1,21 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { GroupMessagesPage } from './group-messages.page';
-
-const routes: Routes = [
- {
- path: '',
- component: GroupMessagesPage
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { GroupMessagesPage } from './group-messages.page';
+
+const routes: Routes = [
+ {
+ path: '',
+ component: GroupMessagesPage
+ },
{
+ path: 'group-contacts',
+ loadChildren: () => import('./group-contacts/group-contacts.module').then( m => m.GroupContactsPageModule)
}
-];
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class GroupMessagesPageRoutingModule {}
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class GroupMessagesPageRoutingModule {}
diff --git a/src/app/pages/chat/messages/contacts/contacts-routing.module.ts b/src/app/pages/chat/messages/contacts/contacts-routing.module.ts
new file mode 100644
index 000000000..fb8c7a5ea
--- /dev/null
+++ b/src/app/pages/chat/messages/contacts/contacts-routing.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { ContactsPage } from './contacts.page';
+
+const routes: Routes = [
+ {
+ path: '',
+ component: ContactsPage
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class ContactsPageRoutingModule {}
diff --git a/src/app/pages/chat/messages/contacts/contacts.module.ts b/src/app/pages/chat/messages/contacts/contacts.module.ts
new file mode 100644
index 000000000..13749fd57
--- /dev/null
+++ b/src/app/pages/chat/messages/contacts/contacts.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 { ContactsPageRoutingModule } from './contacts-routing.module';
+
+import { ContactsPage } from './contacts.page';
+import { SharedModule } from 'src/app/shared/shared.module';
+
+@NgModule({
+ imports: [
+ CommonModule,
+ FormsModule,
+ IonicModule,
+ SharedModule,
+ ContactsPageRoutingModule
+ ],
+ declarations: [ContactsPage]
+})
+export class ContactsPageModule {}
diff --git a/src/app/pages/chat/messages/contacts/contacts.page.html b/src/app/pages/chat/messages/contacts/contacts.page.html
new file mode 100644
index 000000000..fe0d67fac
--- /dev/null
+++ b/src/app/pages/chat/messages/contacts/contacts.page.html
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{header}}
+
+
+
+
{{user.first}} {{user.last}}
+
+
+
+
+
+
+