mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
-style approve entents for desktop finished
-style expedient for desktop ongoing
This commit is contained in:
@@ -23,6 +23,14 @@ const routes: Routes = [
|
||||
{
|
||||
path: 'btn-adicionar',
|
||||
loadChildren: () => import('./shared/buttons/btn-adicionar/btn-adicionar.module').then( m => m.BtnAdicionarPageModule)
|
||||
},
|
||||
{
|
||||
path: 'empty-container',
|
||||
loadChildren: () => import('./shared/empty-container/empty-container.module').then( m => m.EmptyContainerPageModule)
|
||||
},
|
||||
{
|
||||
path: 'events-to-approve',
|
||||
loadChildren: () => import('./shared/gabinete-digital/events-to-approve/events-to-approve.module').then( m => m.EventsToApprovePageModule)
|
||||
},
|
||||
|
||||
/* {
|
||||
|
||||
@@ -32,6 +32,7 @@ import { GroupContactsPage } from 'src/app/shared/chat/group-messages/group-cont
|
||||
GroupMessagesPage,
|
||||
NewGroupPage,
|
||||
GroupContactsPage,
|
||||
EmptyChatPage,
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
entryComponents: [
|
||||
@@ -40,6 +41,7 @@ import { GroupContactsPage } from 'src/app/shared/chat/group-messages/group-cont
|
||||
GroupMessagesPage,
|
||||
NewGroupPage,
|
||||
GroupContactsPage,
|
||||
EmptyChatPage,
|
||||
]
|
||||
})
|
||||
export class ChatPageModule {}
|
||||
|
||||
@@ -87,10 +87,7 @@
|
||||
</div>
|
||||
<!-- Aside right -->
|
||||
<div class="aside-content d-none flex-column height-100">
|
||||
<!-- <ion-button (click)="openMessagesPage()">Messages</ion-button>
|
||||
<ion-button (click)="openGroupMessagesPage('MduvQyrQBejb3xMrY')">Groups</ion-button>
|
||||
<ion-button (click)="destroyComponent()">Destroy</ion-button> -->
|
||||
<app-empty-chat class="d-flex height-100" *ngIf="showEmptyComponent"></app-empty-chat>
|
||||
<app-empty-chat [texto]="emptyTextDescription" class="d-flex height-100 flex-column" *ngIf="showEmptyComponent" #messagecontainer></app-empty-chat>
|
||||
<app-messages class="d-flex height-100 flex-column" [roomId]="roomId" *ngIf="showMessages" #messagecontainer></app-messages>
|
||||
<app-contacts (openMessage)="openMessagesPage($event)" *ngIf="showContacts" class="d-flex height-100 flex-column"></app-contacts>
|
||||
<app-new-group (addGroupMessage)="openGroupContactsPage($event)" *ngIf="showNewGroup" class="d-flex height-100 flex-column"></app-new-group>
|
||||
|
||||
@@ -64,9 +64,11 @@ export class ChatPage implements OnInit {
|
||||
showNewGroup=false;
|
||||
showGroupMessages=false;
|
||||
showGroupContacts=false;
|
||||
emptyTextDescription = 'Sem conversa selecionada';
|
||||
|
||||
@Output() getRoomInfo;
|
||||
|
||||
|
||||
constructor(
|
||||
private http:HttpClient,
|
||||
private chatService: ChatService,
|
||||
@@ -80,11 +82,6 @@ export class ChatPage implements OnInit {
|
||||
/* this.headers = this.headers.set('X-User-Id', 'GqjNWiLrGEHRna7Zn');
|
||||
this.headers = this.headers.set('X-Auth-Token', 'SJwIgtlqfloPK696fpc2VBvyDluipuIHKB_0Q6-9ycJ'); */
|
||||
}
|
||||
closeAllDesktopComponent(){
|
||||
this.desktopComponent = {
|
||||
showMessages: false,
|
||||
}
|
||||
}
|
||||
ngOnInit() {
|
||||
this.segment = "Contactos";
|
||||
|
||||
@@ -265,7 +262,7 @@ export class ChatPage implements OnInit {
|
||||
modal.onDidDismiss();
|
||||
}
|
||||
async openMessagesModal(roomId:any){
|
||||
this.closeAllDesktopComponent();
|
||||
this.closeAllDesktopComponents();
|
||||
|
||||
let classs;
|
||||
if( window.innerWidth <= 1024){
|
||||
|
||||
@@ -10,7 +10,9 @@ import { GabineteDigitalPage } from './gabinete-digital.page';
|
||||
import { SharedModule } from 'src/app/shared/shared.module';
|
||||
|
||||
import { EventListComponent } from 'src/app/shared/agenda/event-list/event-list.component';
|
||||
import { ExpedientePage } from 'src/app/shared/gabinete-digital/expediente/expediente.page'
|
||||
import { EmptyContainerPage } from 'src/app/shared/empty-container/empty-container.page';
|
||||
import { EventsToApprovePage } from 'src/app/shared/gabinete-digital/events-to-approve/events-to-approve.page';
|
||||
import { ExpedientePage } from 'src/app/shared/gabinete-digital/expediente/expediente.page';
|
||||
|
||||
/* import { ComponentsModule } from 'src/app/components/components.module'; */
|
||||
|
||||
@@ -25,7 +27,14 @@ import { ExpedientePage } from 'src/app/shared/gabinete-digital/expediente/exped
|
||||
declarations: [
|
||||
GabineteDigitalPage,
|
||||
EventListComponent,
|
||||
ExpedientePage
|
||||
EmptyContainerPage,
|
||||
EventsToApprovePage,
|
||||
ExpedientePage,
|
||||
],
|
||||
entryComponents: [
|
||||
EmptyContainerPage,
|
||||
EventsToApprovePage,
|
||||
ExpedientePage,
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
||||
})
|
||||
|
||||
@@ -8,15 +8,13 @@
|
||||
<ion-refresher-content>
|
||||
</ion-refresher-content>
|
||||
</ion-refresher>
|
||||
<div class="main-content height-100">
|
||||
<div class="main-content d-flex height-100">
|
||||
|
||||
<div class="d-flex height-100">
|
||||
|
||||
<!-- -->
|
||||
<div class="d-flex aside-wrapper flex-column pt-25 justify-center width-md-40 ">
|
||||
<!-- Aside left -->
|
||||
<div class="aside-wrapper d-flex flex-column pt-25 justify-center width-md-40 ">
|
||||
<p class="text-center mt-0 aside-title px-20">Gabinete Digital</p>
|
||||
<div class="aside overflow-y-auto d-flex d-md-block flex-wrap justify-center width-100 px-20">
|
||||
<div class="exp-card d-flex flex-column justify-center" (click)="openEventsToApproveList('MDGPR')">
|
||||
<div class="exp-card d-flex flex-column justify-center" (click)="openEventsToApprovePage('MDGPR')">
|
||||
<div class="d-flex justify-center">
|
||||
<ion-icon src="assets/images/icons-agenda.svg"></ion-icon>
|
||||
</div>
|
||||
@@ -69,12 +67,11 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- -->
|
||||
<div class="d-none flex-1 aside-content height-100 overflow-y-auto pt-25">
|
||||
<app-event-list class="d-flex flex-1 flex-column height-100" *ngIf="desktopComponent.showEventList"></app-event-list>
|
||||
<app-expediente class="d-flex flex-1 flex-column height-100" *ngIf="desktopComponent.showExpediente"></app-expediente>
|
||||
<!-- Aside right -->
|
||||
<div class="aside-content d-none flex-column height-100">
|
||||
<app-empty-container [texto]="emptyTextDescription" *ngIf="showEmptyContainer" class="d-flex height-100 flex-column"></app-empty-container>
|
||||
<app-events-to-approve [segment]="'MDGPR'" *ngIf="showEventsToApprove" class="d-flex height-100 flex-column"></app-events-to-approve>
|
||||
<app-expediente [profile]="profile" class="d-flex flex-1 flex-column height-100" *ngIf="desktopComponent.showExpediente"></app-expediente>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@@ -107,7 +107,7 @@ ion-content{
|
||||
padding: 30px 5px 30px 5px;
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
|
||||
border: solid 1px #e9e9e9;
|
||||
//border: solid 1px #e9e9e9;
|
||||
/* --background-color: #ffffff !important; */
|
||||
background-color: #ffffff !important;
|
||||
float: left;
|
||||
@@ -153,8 +153,9 @@ ion-content{
|
||||
|
||||
.main-content{
|
||||
.aside-wrapper{
|
||||
border: 1px solid red;
|
||||
width: 40%;
|
||||
justify-content: flex-start !important;
|
||||
border-right: 1px solid #d8d8d8;
|
||||
.aside-title{
|
||||
font-family: Roboto;
|
||||
font-size: 25px;
|
||||
@@ -162,25 +163,38 @@ ion-content{
|
||||
}
|
||||
}
|
||||
.aside-content{
|
||||
width: 60%;
|
||||
display: flex !important;
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.exp-card{
|
||||
margin: 5px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 15px;
|
||||
flex-direction: row !important;
|
||||
width: 100%;
|
||||
padding-right: 11px;
|
||||
padding-bottom: 5px;
|
||||
padding-top: 5px;
|
||||
padding: 10px 17px 10px 17px;
|
||||
height: unset !important;
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
|
||||
|
||||
.exp-card-title{
|
||||
flex: 1;
|
||||
text-align: left;
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
.exp-card-content{
|
||||
margin: 0 !important;
|
||||
}
|
||||
.exp-card-content .title1{
|
||||
display: none;
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
.exp-card-content .number{
|
||||
//display: none;
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -31,6 +31,10 @@ export class GabineteDigitalPage implements OnInit {
|
||||
showEventList: false,
|
||||
showExpediente : false
|
||||
}
|
||||
showEventsToApprove = true;
|
||||
showEmptyContainer = false;
|
||||
showExpedients = false;
|
||||
emptyTextDescription = 'Sem opção selecionada';
|
||||
|
||||
constructor(
|
||||
private processesbackend:ProcessesService,
|
||||
@@ -90,6 +94,13 @@ this.processesbackend.GetActionsList().subscribe(res=>{
|
||||
});
|
||||
}
|
||||
|
||||
closeAllDesktopComponents(){
|
||||
this.showEmptyContainer = false;
|
||||
this.showEventsToApprove = false;
|
||||
this.showExpedients = false;
|
||||
this.showExpedients = false;
|
||||
}
|
||||
|
||||
LoadCounts() {
|
||||
this.showLoader = true;
|
||||
this.processesbackend.GetTasksList("Expediente", true).subscribe(res =>{
|
||||
@@ -122,6 +133,16 @@ this.processesbackend.GetActionsList().subscribe(res=>{
|
||||
notImplemented(){
|
||||
this.alertService.presentAlert('Funcionalidade em desenvolvimento');
|
||||
}
|
||||
|
||||
openEventsToApprovePage(segment:any){
|
||||
this.closeAllDesktopComponents();
|
||||
if( window.innerWidth <= 1024){
|
||||
this.openEventsToApproveList(segment);
|
||||
}
|
||||
else{
|
||||
this.showEventsToApprove = true;
|
||||
}
|
||||
}
|
||||
|
||||
async openEventsToApproveList(segment:any){
|
||||
|
||||
@@ -151,7 +172,15 @@ this.processesbackend.GetActionsList().subscribe(res=>{
|
||||
//}
|
||||
|
||||
}
|
||||
|
||||
openExpedientListPage(){
|
||||
this.closeAllDesktopComponents();
|
||||
if( window.innerWidth <= 1024){
|
||||
this.openExpedientList();
|
||||
}
|
||||
else{
|
||||
this.showExpedients = true;
|
||||
}
|
||||
}
|
||||
async openExpedientList(){
|
||||
|
||||
this.closeAllDesktopComponent();
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<ion-content>
|
||||
<div class="center height-100">
|
||||
<p>Sem conversa selecionada</p>
|
||||
<p>{{texto}}</p>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-empty-chat',
|
||||
@@ -6,6 +6,7 @@ import { Component, OnInit } from '@angular/core';
|
||||
styleUrls: ['./empty-chat.page.scss'],
|
||||
})
|
||||
export class EmptyChatPage implements OnInit {
|
||||
@Input() texto:string;
|
||||
|
||||
constructor() { }
|
||||
|
||||
|
||||
@@ -55,7 +55,7 @@
|
||||
<ion-footer>
|
||||
<div class="container width-100 d-flex">
|
||||
<div>
|
||||
<ion-icon (click)="openChatOptions()" class="chat-icon-options" src="assets/icon/icons-chat-options.svg"></ion-icon>
|
||||
<ion-icon (click)="openSendGroupMessageOptions()" class="chat-icon-options" src="assets/icon/icons-chat-options.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="width-80">
|
||||
<ion-item class="ion-no-padding type-message" lines="none">
|
||||
|
||||
@@ -187,8 +187,19 @@ export class GroupMessagesPage implements OnInit, OnChanges {
|
||||
return await modal.present();
|
||||
}
|
||||
|
||||
openSendGroupMessageOptions(ev: any){
|
||||
if(window.innerWidth <= 1024){
|
||||
console.log('mobile');
|
||||
this.openChatOptions(ev);
|
||||
}
|
||||
else{
|
||||
console.log('desktop');
|
||||
this._openChatOptions();
|
||||
}
|
||||
}
|
||||
|
||||
/* async openOptions(ev: any) {
|
||||
|
||||
async openOptions(ev: any) {
|
||||
const popover = await this.popoverController.create({
|
||||
component: ChatPopoverPage,
|
||||
cssClass: 'chat-popover',
|
||||
@@ -202,10 +213,7 @@ export class GroupMessagesPage implements OnInit, OnChanges {
|
||||
popover.onDidDismiss().then(res=>{
|
||||
console.log(res);
|
||||
if(res.data){
|
||||
this.roomName = res.data.name.split('-').join(' ');
|
||||
console.log(this.roomName);
|
||||
|
||||
this.load();
|
||||
this.getRoomInfo();
|
||||
//this.modalController.dismiss();
|
||||
};
|
||||
|
||||
@@ -241,10 +249,10 @@ export class GroupMessagesPage implements OnInit, OnChanges {
|
||||
await modal.present();
|
||||
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.load();
|
||||
this.getRoomInfo();
|
||||
});
|
||||
}
|
||||
*/
|
||||
|
||||
/* async actionSheet() {
|
||||
const actionSheet = await this.actionSheetController.create({
|
||||
cssClass: 'my-custom-class',
|
||||
@@ -271,5 +279,42 @@ export class GroupMessagesPage implements OnInit, OnChanges {
|
||||
}
|
||||
*/
|
||||
|
||||
async _openChatOptions() {
|
||||
|
||||
const enterAnimation = (baseEl: any) => {
|
||||
const backdropAnimation = this.animationController.create()
|
||||
.addElement(baseEl.querySelector('ion-backdrop')!)
|
||||
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
|
||||
|
||||
const wrapperAnimation = this.animationController.create()
|
||||
.addElement(baseEl.querySelector('.modal-wrapper')!)
|
||||
.keyframes([
|
||||
{ offset: 0, opacity: '1', right: '-100%' },
|
||||
{ offset: 1, opacity: '1', right: '0px' }
|
||||
]);
|
||||
|
||||
return this.animationController.create()
|
||||
.addElement(baseEl)
|
||||
.easing('ease-out')
|
||||
.duration(500)
|
||||
.addAnimation([backdropAnimation, wrapperAnimation]);
|
||||
}
|
||||
|
||||
const leaveAnimation = (baseEl: any) => {
|
||||
return enterAnimation(baseEl).direction('reverse');
|
||||
}
|
||||
|
||||
const modal = await this.modalController.create({
|
||||
enterAnimation,
|
||||
leaveAnimation,
|
||||
component: ChatOptionsPopoverPage,
|
||||
cssClass: 'model profile-modal search-submodal',
|
||||
componentProps: {
|
||||
roomId: this.roomId,
|
||||
}
|
||||
});
|
||||
return await modal.present();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<ion-icon (click)="_openMessagesOptions()" src="assets/images/icons-menu.svg"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-bottom" (click)="addContacts()">
|
||||
<div hidden class="header-bottom" (click)="addContacts()">
|
||||
<div class="header-bottom-icon">
|
||||
<ion-icon src="assets/icon/icons-user.svg"></ion-icon>
|
||||
</div>
|
||||
@@ -48,7 +48,7 @@
|
||||
<ion-footer>
|
||||
<div class="container width-100 d-flex">
|
||||
<div>
|
||||
<ion-icon (click)="openChatOptions()" class="chat-icon-options" src="assets/icon/icons-chat-options.svg"></ion-icon>
|
||||
<ion-icon (click)="openSendMessageOptions()" class="chat-icon-options" src="assets/icon/icons-chat-options.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="width-80">
|
||||
<ion-item class="ion-no-padding type-message" lines="none">
|
||||
|
||||
@@ -147,6 +147,17 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
|
||||
modal.onDidDismiss();
|
||||
}
|
||||
|
||||
openSendMessageOptions(ev:any){
|
||||
if(window.innerWidth <= 1024){
|
||||
console.log('mobile');
|
||||
this.openChatOptions(ev);
|
||||
}
|
||||
else{
|
||||
console.log('desktop');
|
||||
this._openChatOptions();
|
||||
}
|
||||
}
|
||||
|
||||
async openChatOptions(ev: any) {
|
||||
const popover = await this.popoverController.create({
|
||||
component: ChatOptionsPopoverPage,
|
||||
@@ -208,5 +219,57 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
|
||||
return await modal.present();
|
||||
}
|
||||
|
||||
|
||||
|
||||
async _openChatOptions() {
|
||||
|
||||
const enterAnimation = (baseEl: any) => {
|
||||
const backdropAnimation = this.animationController.create()
|
||||
.addElement(baseEl.querySelector('ion-backdrop')!)
|
||||
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
|
||||
|
||||
const wrapperAnimation = this.animationController.create()
|
||||
.addElement(baseEl.querySelector('.modal-wrapper')!)
|
||||
.keyframes([
|
||||
{ offset: 0, opacity: '1', right: '-100%' },
|
||||
{ offset: 1, opacity: '1', right: '0px' }
|
||||
]);
|
||||
|
||||
return this.animationController.create()
|
||||
.addElement(baseEl)
|
||||
.easing('ease-out')
|
||||
.duration(500)
|
||||
.addAnimation([backdropAnimation, wrapperAnimation]);
|
||||
}
|
||||
|
||||
const leaveAnimation = (baseEl: any) => {
|
||||
return enterAnimation(baseEl).direction('reverse');
|
||||
}
|
||||
|
||||
|
||||
/* const popover = await this.popoverController.create({
|
||||
component: MessagesOptionsPage,
|
||||
componentProps: {
|
||||
roomId: this.dm._id,
|
||||
},
|
||||
cssClass: 'messages-options',
|
||||
event: ev,
|
||||
translucent: true,
|
||||
});
|
||||
return await popover.present(); */
|
||||
|
||||
const modal = await this.modalController.create({
|
||||
enterAnimation,
|
||||
leaveAnimation,
|
||||
component: ChatOptionsPopoverPage,
|
||||
cssClass: 'model profile-modal search-submodal',
|
||||
componentProps: {
|
||||
roomId: this.roomId,
|
||||
}
|
||||
});
|
||||
return await modal.present();
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { EmptyContainerPage } from './empty-container.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: EmptyContainerPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class EmptyContainerPageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EmptyContainerPageRoutingModule } from './empty-container-routing.module';
|
||||
|
||||
import { EmptyContainerPage } from './empty-container.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
EmptyContainerPageRoutingModule
|
||||
],
|
||||
declarations: [EmptyContainerPage]
|
||||
})
|
||||
export class EmptyContainerPageModule {}
|
||||
@@ -0,0 +1,5 @@
|
||||
<ion-content>
|
||||
<div class="center height-100">
|
||||
<p>{{texto}}</p>
|
||||
</div>
|
||||
</ion-content>
|
||||
@@ -0,0 +1,5 @@
|
||||
.center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EmptyContainerPage } from './empty-container.page';
|
||||
|
||||
describe('EmptyContainerPage', () => {
|
||||
let component: EmptyContainerPage;
|
||||
let fixture: ComponentFixture<EmptyContainerPage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ EmptyContainerPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(EmptyContainerPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,16 @@
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-empty-container',
|
||||
templateUrl: './empty-container.page.html',
|
||||
styleUrls: ['./empty-container.page.scss'],
|
||||
})
|
||||
export class EmptyContainerPage implements OnInit {
|
||||
@Input() texto:string;
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { EventsToApprovePage } from './events-to-approve.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: EventsToApprovePage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class EventsToApprovePageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EventsToApprovePageRoutingModule } from './events-to-approve-routing.module';
|
||||
|
||||
import { EventsToApprovePage } from './events-to-approve.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
EventsToApprovePageRoutingModule
|
||||
],
|
||||
declarations: [EventsToApprovePage]
|
||||
})
|
||||
export class EventsToApprovePageModule {}
|
||||
@@ -0,0 +1,68 @@
|
||||
<ion-content>
|
||||
<div class="title width-100">
|
||||
<label>Eventos para Aprovação</label>
|
||||
<ion-toolbar>
|
||||
<ion-segment [(ngModel)]="segment">
|
||||
<ion-segment-button value="MDGPR">
|
||||
Seu calendário
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="PR">
|
||||
Presidente da República
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
</ion-toolbar>
|
||||
</div>
|
||||
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
|
||||
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
|
||||
<ion-refresher-content>
|
||||
</ion-refresher-content>
|
||||
</ion-refresher>
|
||||
<div [ngSwitch]="segment">
|
||||
<!-- <div class="header-content width-100"> -->
|
||||
|
||||
<!-- </div> -->
|
||||
<ion-list class="width-100" *ngSwitchCase="'MDGPR'">
|
||||
<div class="width-100" *ngIf="eventsMDGPRList">
|
||||
<ion-list>
|
||||
<ion-item-sliding>
|
||||
<ion-item class="Rectangle width-100" lines="none"
|
||||
*ngFor="let event of eventsMDGPRList" (click)="openApproveModal(event.serialNumber)">
|
||||
|
||||
<div class="content-mdgpr-{{event.workflowInstanceDataFields.Agenda}} width-100">
|
||||
<div class="approve-event-time">
|
||||
<p>{{event.workflowInstanceDataFields.StartDate | date: 'hh:mm'}}</p>
|
||||
<p>{{event.workflowInstanceDataFields.EndDate | date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
<div class="approve-event-detail">
|
||||
<p *ngIf="event.workflowInstanceDataFields.StartDate != event.workflowInstanceDataFields.EndDate">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }} - {{ event.workflowInstanceDataFields.EndDate | date: 'dd/M/yy'}} | {{event.workflowInstanceDataFields.Location}}</p>
|
||||
<p *ngIf="event.workflowInstanceDataFields.StartDate == event.workflowInstanceDataFields.EndDate">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }} | {{event.workflowInstanceDataFields.Location}}</p>
|
||||
<h3>{{event.workflowInstanceDataFields.Subject}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</ion-list>
|
||||
</div>
|
||||
</ion-list>
|
||||
<ion-list *ngSwitchCase="'PR'">
|
||||
<div *ngIf="eventsPRList">
|
||||
<ion-item-sliding>
|
||||
<ion-item class="Rectangle" lines="none"
|
||||
*ngFor="let event of eventsPRList" (click)="openApproveModal(event.serialNumber)">
|
||||
<div class="content-pr-{{event.workflowInstanceDataFields.Agenda}}">
|
||||
<div class="approve-event-time">
|
||||
<p>{{event.workflowInstanceDataFields.StartDate | date: 'hh:mm'}}</p>
|
||||
<p>{{event.workflowInstanceDataFields.EndDate | date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
<div class="approve-event-detail">
|
||||
<p *ngIf="event.workflowInstanceDataFields.StartDate != event.workflowInstanceDataFields.EndDate">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }} - {{ event.workflowInstanceDataFields.EndDate | date: 'dd/M/yy'}} | {{event.workflowInstanceDataFields.Location}}</p>
|
||||
<p *ngIf="event.workflowInstanceDataFields.StartDate == event.workflowInstanceDataFields.EndDate">{{event.workflowInstanceDataFields.StartDate | date: 'd/M/yy' }} | {{event.workflowInstanceDataFields.Location}}</p>
|
||||
<h3>{{event.workflowInstanceDataFields.Subject}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</div>
|
||||
</ion-list>
|
||||
</div>
|
||||
</ion-content>
|
||||
@@ -0,0 +1,92 @@
|
||||
:host{
|
||||
padding: 30px 20px 0 20px !important;
|
||||
margin: 0;
|
||||
}
|
||||
.title{
|
||||
font-family: Roboto;
|
||||
font-size: 25px;
|
||||
color:#000;
|
||||
overflow: auto;
|
||||
}
|
||||
ion-item-sliding{
|
||||
margin-top: 5px;
|
||||
}
|
||||
.Rectangle {
|
||||
//width: 360px;
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
|
||||
border: solid 1px #e9e9e9;
|
||||
background-color: var(--white);
|
||||
margin: 0 auto;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-mdgpr-Oficial{
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #99e47b;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-mdgpr-Pessoal{
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #958bfc;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-pr-Oficial{
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #ffb703;
|
||||
overflow: auto;
|
||||
}
|
||||
.content-pr-Pessoal{
|
||||
border-radius: 5px;
|
||||
border-right: 5px solid #f05d5e;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.approve-event-time{
|
||||
float: left;
|
||||
}
|
||||
.approve-event-time p{
|
||||
width: 33px;
|
||||
font-family: Roboto;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
color: var(--Antartic-grey);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.approve-event-detail{
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.approve-event-detail p{
|
||||
width: 250px;
|
||||
font-family: Roboto;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
color: var(--black);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.approve-event-detail h3{
|
||||
width: 250px;
|
||||
font-family: Roboto;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
color: #0d89d1;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EventsToApprovePage } from './events-to-approve.page';
|
||||
|
||||
describe('EventsToApprovePage', () => {
|
||||
let component: EventsToApprovePage;
|
||||
let fixture: ComponentFixture<EventsToApprovePage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ EventsToApprovePage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(EventsToApprovePage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,104 @@
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { EventBody } from 'src/app/models/eventbody.model';
|
||||
import { EventPerson } from 'src/app/models/eventperson.model';
|
||||
import { Event } from 'src/app/models/event.model';
|
||||
import { ProcessesService } from 'src/app/services/processes.service';
|
||||
import { ModalController, NavParams } from '@ionic/angular';
|
||||
import { NavigationEnd, Router } from '@angular/router';
|
||||
import { ApproveEventModalPage } from 'src/app/pages/gabinete-digital/event-list/approve-event-modal/approve-event-modal.page';
|
||||
|
||||
@Component({
|
||||
selector: 'app-events-to-approve',
|
||||
templateUrl: './events-to-approve.page.html',
|
||||
styleUrls: ['./events-to-approve.page.scss'],
|
||||
})
|
||||
export class EventsToApprovePage implements OnInit {
|
||||
|
||||
//segment:string;
|
||||
showLoader: boolean;
|
||||
eventsPRList: any;
|
||||
eventsMDGPRList: any;
|
||||
eventPerson: EventPerson;
|
||||
eventBody: EventBody;
|
||||
categories: string[];
|
||||
serialnumber:string;
|
||||
|
||||
@Input() segment:string;
|
||||
|
||||
constructor(
|
||||
private processes:ProcessesService,
|
||||
private modalController: ModalController,
|
||||
private router: Router,
|
||||
//private navParams: NavParams,
|
||||
) { }
|
||||
S
|
||||
ngOnInit() {
|
||||
//this.segment = this.navParams.get('segment');
|
||||
/* console.log(this.navParams.get('md')); */
|
||||
console.log(this.segment);
|
||||
this.LoadToApproveEvents();
|
||||
|
||||
|
||||
this.router.events.forEach((event) => {
|
||||
if(event instanceof NavigationEnd && event.url == this.router.url) {
|
||||
this.LoadToApproveEvents();
|
||||
}
|
||||
});
|
||||
|
||||
window.onresize = (event) => {
|
||||
// if not mobile remove all component
|
||||
if( window.innerWidth <= 1024){
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
LoadToApproveEvents(){
|
||||
this.showLoader = true;
|
||||
|
||||
this.processes.GetToApprovedEvents('PR','false').subscribe(res=>{
|
||||
this.showLoader = false;
|
||||
this.eventsPRList = res;
|
||||
});
|
||||
this.processes.GetToApprovedEvents('MDGPR','false').subscribe(res=>{
|
||||
this.showLoader = false;
|
||||
this.eventsMDGPRList = res;
|
||||
});
|
||||
}
|
||||
async openApproveModal(eventSerialNumber){
|
||||
|
||||
|
||||
let classs;
|
||||
if( window.innerWidth <= 1024){
|
||||
classs = 'cal-modal modal modal-desktop'
|
||||
} else {
|
||||
classs = 'gabinete-digital-mobile-modal-to-Desktop'
|
||||
}
|
||||
|
||||
const modal = await this.modalController.create({
|
||||
component: ApproveEventModalPage,
|
||||
componentProps:{
|
||||
serialNumber: eventSerialNumber,
|
||||
},
|
||||
cssClass: classs,
|
||||
backdropDismiss: false
|
||||
});
|
||||
|
||||
await modal.present();
|
||||
|
||||
modal.onDidDismiss();
|
||||
}
|
||||
doRefresh(event) {
|
||||
this.LoadToApproveEvents();
|
||||
console.log('refresh');
|
||||
setTimeout(() => {
|
||||
event.target.complete();
|
||||
}, 2000);
|
||||
}
|
||||
close(){
|
||||
this.modalController.dismiss(null);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@@ -4,7 +4,7 @@
|
||||
<div class="title-content">
|
||||
<app-btn-modal-dismiss></app-btn-modal-dismiss>
|
||||
<div class="middle">
|
||||
<ion-label class="title">Gabinete Digital</ion-label>
|
||||
<ion-label class="title">11Gabinete Digital</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,5 +1,17 @@
|
||||
<ion-content>
|
||||
<ion-row>
|
||||
<ion-content class="container">
|
||||
<div class="arrow-right">
|
||||
<ion-icon (click)="close()" slot="end" class="arrow-right-icon" src='assets/images/icons-arrow-arrow-right.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<button full class="btn-ok" shape="round" >Tirar Fotografia</button>
|
||||
<button class="btn-ok" shape="round" >Digitalizar Documento</button>
|
||||
<button full class="btn-ok" shape="round" >Anexar Fotografia</button>
|
||||
<button class="btn-ok" shape="round" >Anexar Documento</button>
|
||||
<div class="solid"></div>
|
||||
<button (click)="close()" full class="btn-cancel" shape="round" >Cancelar</button>
|
||||
</div>
|
||||
|
||||
<!-- <ion-row>
|
||||
<ion-col>
|
||||
<button full class="btn-ok" shape="round" >Tirar Fotografia</button>
|
||||
</ion-col>
|
||||
@@ -19,5 +31,5 @@
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-row> -->
|
||||
</ion-content>
|
||||
|
||||
@@ -1,32 +1,47 @@
|
||||
ion-row{
|
||||
padding: 10px 10px 5px 10px;
|
||||
}
|
||||
.border-top{
|
||||
padding-top: 5px !important;
|
||||
border-top: 1px solid #ebebeb;
|
||||
}
|
||||
/* ion-col{
|
||||
border: 1px solid red;
|
||||
} */
|
||||
.btn-cancel{
|
||||
display: block;
|
||||
width: 170px !important;
|
||||
height: 45px !important;
|
||||
border-radius: 22.5px;
|
||||
background-color: #e0e9ee;
|
||||
--color: #061b52 !important;
|
||||
--background:transparent;
|
||||
--box-shadow: none;
|
||||
margin: 0 auto !important;
|
||||
.container{
|
||||
--padding-top:20px !important;
|
||||
--padding-bottom:20px !important;
|
||||
--padding-start:20px !important;
|
||||
--padding-end:20px !important;
|
||||
}
|
||||
.arrow-right{
|
||||
display: none;
|
||||
margin-bottom: 20px;
|
||||
.arrow-right-icon{
|
||||
width: 37px;
|
||||
float: right;
|
||||
font-size: 35px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
.buttons{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.btn-ok{
|
||||
display: block;
|
||||
width: 170px !important;
|
||||
height: 45px !important;
|
||||
border-radius: 22.5px;
|
||||
--background: #42b9fe;
|
||||
--color: #ffffff !important;
|
||||
.btn-ok, .btn-cancel, .btn-delete{
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
}
|
||||
.solid {
|
||||
display: none;
|
||||
width: 90%;
|
||||
border-top: 1px solid #bbb;
|
||||
margin: 0 auto !important;
|
||||
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
@media only screen and (min-width: 1024px) {
|
||||
.arrow-right{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.btn-cancel{
|
||||
display: none;
|
||||
}
|
||||
.btn-ok{
|
||||
width: 100% !important;
|
||||
}
|
||||
.mobile-only{
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { PopoverController } from '@ionic/angular';
|
||||
import { ModalController, PopoverController } from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'app-chat-options-popover',
|
||||
@@ -9,14 +9,20 @@ import { PopoverController } from '@ionic/angular';
|
||||
export class ChatOptionsPopoverPage implements OnInit {
|
||||
|
||||
constructor(
|
||||
private popoverController: PopoverController
|
||||
private popoverController: PopoverController,
|
||||
private modalController: ModalController,
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
close(){
|
||||
this.popoverController.dismiss();
|
||||
if( window.innerWidth <= 1024){
|
||||
this.popoverController.dismiss();
|
||||
}
|
||||
else{
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -9,20 +9,4 @@
|
||||
<button (click)="close()" full class="btn-cancel mobile-only" shape="round" >Cancelar</button>
|
||||
<button (click)="deleteGroup()" class="btn-delete" shape="round">Apagar grupo</button>
|
||||
</div>
|
||||
<!-- <ion-row>
|
||||
<ion-col>
|
||||
<button (click)="leaveGroup()" class="btn-cancel" shape="round" >Sair do Grupo</button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<button (click)="openChangeGroupName()" class="btn-ok" shape="round" >Alterar nome do grupo</button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="border-top">
|
||||
<ion-col>
|
||||
<button (click)="close()" full class="btn-cancel" shape="round" >Cancelar</button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<button (click)="deleteGroup()" class="btn-delete" shape="round">Apagar grupo</button>
|
||||
</ion-col>
|
||||
</ion-row> -->
|
||||
</ion-content>
|
||||
|
||||
Reference in New Issue
Block a user