mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-20 21:35:50 +00:00
style new group view desktop/tablet
This commit is contained in:
@@ -13,6 +13,7 @@ import { GroupMessagesPage } from 'src/app/shared/chat/group-messages/group-mess
|
||||
import { MessagesPage } from 'src/app/shared/chat/messages/messages.page';
|
||||
import { EmptyChatPage } from 'src/app/shared/chat/empty-chat/empty-chat.page';
|
||||
import { ContactsPage } from 'src/app/shared/chat/messages/contacts/contacts.page';
|
||||
import { NewGroupPage } from 'src/app/shared/chat/new-group/new-group.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -28,8 +29,14 @@ import { ContactsPage } from 'src/app/shared/chat/messages/contacts/contacts.pag
|
||||
MessagesPage,
|
||||
ContactsPage,
|
||||
GroupMessagesPage,
|
||||
NewGroupPage,
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
entryComponents: [MessagesPage,ContactsPage, GroupMessagesPage]
|
||||
entryComponents: [
|
||||
MessagesPage,
|
||||
ContactsPage,
|
||||
GroupMessagesPage,
|
||||
NewGroupPage,
|
||||
]
|
||||
})
|
||||
export class ChatPageModule {}
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<ion-label class="title">Chat</ion-label>
|
||||
</div>
|
||||
<div class="div-icon">
|
||||
<ion-icon slot="end" (click)="newGroup()" src="assets/images/icons-chat-new-group.svg" ></ion-icon>
|
||||
<ion-icon slot="end" (click)="openNewGroupPage()" src="assets/images/icons-chat-new-group.svg" ></ion-icon>
|
||||
<ion-icon slot="end" (click)="openContactsPage()" src="assets/images/icons-chat-new-conversation.svg"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
@@ -93,6 +93,7 @@
|
||||
<app-empty-chat class="d-flex height-100" *ngIf="showEmptyComponent"></app-empty-chat>
|
||||
<app-messages class="d-flex height-100 flex-column" [roomId]="roomId" *ngIf="showMessages" #messagecontainer></app-messages>
|
||||
<app-contacts *ngIf="showContacts" class="d-flex height-100"></app-contacts>
|
||||
<app-new-group *ngIf="showNewGroup" class="d-flex height-100 flex-column"></app-new-group>
|
||||
<app-group-messages *ngIf="showGroupMessages" class="d-flex height-100 flex-column" [roomId]="roomId" #messagecontainer></app-group-messages>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -60,6 +60,7 @@ export class ChatPage implements OnInit {
|
||||
showEmptyComponent=true;
|
||||
showMessages=false;
|
||||
showContacts=false;
|
||||
showNewGroup=false;
|
||||
showGroupMessages=false;
|
||||
|
||||
@Output() getRoomInfo;
|
||||
@@ -102,6 +103,7 @@ export class ChatPage implements OnInit {
|
||||
closeAllDesktopComponents() {
|
||||
this.showMessages=false;
|
||||
this.showContacts=false;
|
||||
this.showNewGroup=false;
|
||||
this.showGroupMessages=false;
|
||||
this.showEmptyComponent=false;
|
||||
}
|
||||
@@ -128,6 +130,15 @@ export class ChatPage implements OnInit {
|
||||
this.showContacts=true;
|
||||
}
|
||||
}
|
||||
openNewGroupPage() {
|
||||
if( window.innerWidth <= 1024){
|
||||
this.newGroup();
|
||||
}
|
||||
else{
|
||||
this.closeAllDesktopComponents();
|
||||
this.showNewGroup=true;
|
||||
}
|
||||
}
|
||||
openGroupMessagesPage(rid) {
|
||||
if( window.innerWidth <= 1024){
|
||||
this.openGroupMessagesModal(rid);
|
||||
|
||||
@@ -2,9 +2,6 @@
|
||||
<ion-toolbar class="header-toolbar">
|
||||
<div class="main-header">
|
||||
<div class="title-content">
|
||||
<div class="left">
|
||||
<ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="middle">
|
||||
<ion-label class="title">Novo Grupo</ion-label>
|
||||
</div>
|
||||
@@ -15,11 +12,11 @@
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="main-content">
|
||||
<div class="main-content width-100">
|
||||
<div class="item-container">
|
||||
<ion-input [(ngModel)]="groupName" placeholder="Título"></ion-input>
|
||||
</div>
|
||||
<div *ngIf="false" class="item-container-no-border">
|
||||
<div *ngIf="true" class="item-container-no-border">
|
||||
<ion-checkbox (ionChange)="_ionChange($event)" color="primary"></ion-checkbox>
|
||||
<ion-label>Grupo Ultra-secreto</ion-label>
|
||||
</div>
|
||||
|
||||
@@ -47,7 +47,7 @@ ion-content{
|
||||
transform: translate3d(0, 1px, 0);
|
||||
|
||||
.title-content{
|
||||
width: 360px;
|
||||
//width: 360px;
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
@@ -63,7 +63,7 @@ ion-content{
|
||||
padding: 0!important;
|
||||
float: left;
|
||||
width: 221px;
|
||||
margin: 2.5px 0 0 5px;
|
||||
//margin: 2.5px 0 0 5px;
|
||||
}
|
||||
.right{
|
||||
padding: 0!important;
|
||||
@@ -101,7 +101,7 @@ ion-content{
|
||||
padding: 15px 20px 0 20px;
|
||||
|
||||
.item-container{
|
||||
width: 360px;
|
||||
//width: 360px;
|
||||
margin: 15px auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
@@ -110,7 +110,7 @@ ion-content{
|
||||
|
||||
.item-container-no-border{
|
||||
display: flex;
|
||||
width: 360px;
|
||||
//width: 360px;
|
||||
margin: 25px auto;
|
||||
border-radius: 5px;
|
||||
align-items: center;
|
||||
@@ -124,15 +124,16 @@ ion-content{
|
||||
}
|
||||
|
||||
.container-div{
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
overflow: auto;
|
||||
|
||||
.ion-item-class-2{
|
||||
width: 360px;
|
||||
width: 100%;
|
||||
margin: 0px auto;
|
||||
|
||||
.ion-icon-class{
|
||||
width: 45px;
|
||||
width: 5%;
|
||||
height: 45px;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
@@ -140,12 +141,13 @@ ion-content{
|
||||
}
|
||||
}
|
||||
.ion-input-class{
|
||||
width: 315px;
|
||||
width: 93%;
|
||||
height: 45px;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 5px;
|
||||
padding-right: 10px;
|
||||
margin-left: 2%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { analyzeAndValidateNgModules } from '@angular/compiler';
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { ModalController, NavParams, PickerController, PopoverController } from '@ionic/angular';
|
||||
import { GroupDurationPage } from 'src/app/shared/popover/group-duration/group-duration.page';
|
||||
import { GroupContactsPage } from '../group-messages/group-contacts/group-contacts.page';
|
||||
@@ -15,17 +15,19 @@ export class NewGroupPage implements OnInit {
|
||||
displayDuration: any;
|
||||
showDuration: boolean;
|
||||
selectedDuration = ['','',''];
|
||||
groupName:string;
|
||||
//groupName:string;
|
||||
|
||||
@Input() groupName:string;
|
||||
|
||||
constructor(
|
||||
private pickerController: PickerController,
|
||||
private popoverController: PopoverController,
|
||||
private modalController: ModalController,
|
||||
private navParams: NavParams,
|
||||
//private navParams: NavParams,
|
||||
)
|
||||
{
|
||||
this.isGroupCreated = false;
|
||||
this.groupName = this.navParams.get('name');
|
||||
//this.groupName = this.navParams.get('name');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
Reference in New Issue
Block a user