This commit is contained in:
Tiago Kayaya
2020-09-10 09:51:33 +01:00
23 changed files with 408 additions and 117 deletions
@@ -1,7 +1,7 @@
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-back-button (click)="navigateBack()" defaultHref="" icon="chevron-back"></ion-back-button>
<ion-back-button (click)="close()" defaultHref="" icon="chevron-back"></ion-back-button>
</ion-buttons>
<ion-title>Anexos do evento</ion-title>
</ion-toolbar>
@@ -24,20 +24,7 @@
</div>
<!-- Skeleton screen -->
<div *ngIf="!loadedEventAttachments">
<div class="ion-padding custom-skeleton">
<ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
<ion-skeleton-text animated></ion-skeleton-text>
<ion-skeleton-text animated style="width: 88%"></ion-skeleton-text>
<ion-skeleton-text animated style="width: 70%"></ion-skeleton-text>
<ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
</div>
<ion-list>
<ion-list-header>
<ion-label>
<ion-skeleton-text animated style="width: 20%"></ion-skeleton-text>
</ion-label>
</ion-list-header>
<ion-item>
<ion-avatar slot="start">
<ion-skeleton-text animated></ion-skeleton-text>
@@ -55,23 +42,9 @@
</ion-label>
</ion-item>
<ion-item>
<ion-thumbnail slot="start">
<ion-avatar slot="start">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3>
<ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
</h3>
<p>
<ion-skeleton-text animated style="width: 80%"></ion-skeleton-text>
</p>
<p>
<ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
</p>
</ion-label>
</ion-item>
<ion-item>
<ion-skeleton-text animated style="width: 27px; height: 27px" slot="start"></ion-skeleton-text>
</ion-avatar>
<ion-label>
<h3>
<ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
@@ -3,6 +3,7 @@ import { AttachmentsService } from 'src/app/services/attachments.service';
import { Attachment } from 'src/app/models/attachment.model';
import { ActivatedRoute, Router } from '@angular/router';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { ModalController, NavParams } from '@ionic/angular';
@Component({
selector: 'app-attachments',
@@ -14,17 +15,14 @@ export class AttachmentsPage implements OnInit {
loadedEventAttachments: Attachment[];
pageId: string;
constructor(private attachamentsService: AttachmentsService, private activatedRoute: ActivatedRoute, private iab: InAppBrowser, private route: Router) { }
constructor(
private attachamentsService: AttachmentsService,
private iab: InAppBrowser,
private modalCtrl: ModalController,
private navParams: NavParams) { }
ngOnInit() {
/* Emit new data when something changes */
this.activatedRoute.paramMap.subscribe(paramMap =>{
if(!paramMap.has('eventId')){
//Redirect
return;
}
this.loadAttachments(paramMap.get('eventId'));
});
this.loadAttachments(this.navParams.get('eventId'));
}
loadAttachments(eventid:string)
@@ -41,9 +39,9 @@ export class AttachmentsPage implements OnInit {
const browser = this.iab.create(url,"_blank");
browser.show();
}
navigateBack(){
this.route.navigate(['/home/events',this.pageId]);
close(){
this.modalCtrl.dismiss(null);
}
}
@@ -31,7 +31,7 @@
</ion-buttons>
<ion-buttons slot="end">
<ion-button (click)="save()">
<ion-label>Gravar</ion-label>
<ion-label>Adicionar</ion-label>
<ion-icon name="checkmark" slot="start"></ion-icon>
</ion-button>
</ion-buttons>
@@ -49,7 +49,7 @@
<ion-title></ion-title>
<ion-buttons slot="end">
<ion-button (click)="save()">
<ion-label>Gravar</ion-label>
<ion-label>OK</ion-label>
<ion-icon name="checkmark" slot="start"></ion-icon>
</ion-button>
</ion-buttons>
@@ -18,8 +18,8 @@
<ion-item-sliding>
<form [formGroup]="ionicForm" novalidate>
<ion-item>
<ion-label position="stacked">Assunto</ion-label>
<ion-input [(ngModel)]="loadedEvent.Subject" formControlName="subject" type="text" required></ion-input>
<ion-label class="capitalizeText" position="stacked">Assunto</ion-label>
<ion-input class="capitalizeText" [(ngModel)]="loadedEvent.Subject" formControlName="subject" type="text" required></ion-input>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.subject.errors?.required">
@@ -28,15 +28,15 @@
</form>
<ion-item>
<ion-label position="stacked">Descrição</ion-label>
<ion-input [(ngModel)]='loadedEvent.Body.Text'></ion-input>
<ion-input class="capitalizeText" [(ngModel)]='loadedEvent.Body.Text'></ion-input>
</ion-item>
<ion-item>
<ion-label position="stacked">Localização</ion-label>
<ion-input [(ngModel)]='loadedEvent.Location'></ion-input>
<ion-input class="capitalizeText" [(ngModel)]='loadedEvent.Location'></ion-input>
</ion-item>
<ion-item>
<ion-label position="stacked">Calendário</ion-label>
<ion-select placeholder="{{loadedEvent.CalendarName}}" [(ngModel)]="loadedEvent.CalendarName" interface="action-sheet" class="custom-options" Cancel-text="Cancelar">
<ion-select class="capitalizeText" placeholder="{{loadedEvent.CalendarName}}" [(ngModel)]="loadedEvent.CalendarName" interface="action-sheet" class="custom-options" Cancel-text="Cancelar">
<ion-select-option Pessoal="Reunião">Pessoal</ion-select-option>
<ion-select-option Oficial="Viagem">Oficial</ion-select-option>
</ion-select>
@@ -70,21 +70,24 @@
</ion-buttons>
<ion-label class="attach-label">Participantes</ion-label>
</ion-item>
<div *ngIf="loadedEvent.Attendees">
<div *ngFor="let attendee of loadedEvent.Attendees; let i=index">
<div *ngIf="i<2">
<div *ngIf="i<1">
<ion-list >
<ion-item class="attendees" lines="none" >
<ion-icon class="attendees-icon" name="person" slot="start"></ion-icon>
<ion-label class="attendees-list">{{attendee.Name}}</ion-label>
<ion-label class="capitalizeText" class="attendees-list">{{attendee.Name}}</ion-label>
</ion-item>
</ion-list>
</div>
<div *ngIf="i>1">
<ion-button class="see-more-button" fill="none" shape="round" (click)="openAttendees()">
<ion-label color="secondary">Ver mais...</ion-label>
</ion-button>
</div>
</div>
<div *ngIf="loadedEvent.Attendees.length > 1">
<ion-button class="see-more-button" fill="none" shape="round" (click)="openAttendees()">
<ion-label color="secondary">Ver mais...</ion-label>
</ion-button>
</div>
</div>
</div>
<div class="div-attach">
<ion-item>
@@ -93,6 +96,7 @@
</ion-buttons>
<ion-label class="attach-label">Anexos</ion-label>
</ion-item>
<div *ngIf="loadedEventAttachments">
<div *ngFor="let att of loadedEventAttachments; let j=index">
<div *ngIf="j<2">
<ion-list *ngIf="loadedEvent.HasAttachments">
@@ -106,12 +110,13 @@
</ion-item>
</ion-list>
</div>
<div *ngIf="loadedEventAttachments.length > 1">
<ion-button class="see-more-button" fill="none" shape="round" (click)="showAlert()">
<ion-label color="secondary">Ver mais...</ion-label>
</ion-button>
</div>
</div>
<div *ngIf="loadedEventAttachments.length > 1">
<ion-button class="see-more-button" fill="none" shape="round" (click)="openAttachments()"><!-- [routerLink]="['/home/attachments', loadedEvent.EventId]" -->
<ion-label color="secondary">Ver mais...</ion-label>
</ion-button>
</div>
</div>
<!-- Skeleton Attachment -->
<ion-list *ngIf="!loadedEventAttachments">
<ion-item lines="none" >
@@ -92,3 +92,4 @@ ion-card{
text-transform: initial;
font-size: 16px;
}
@@ -12,6 +12,7 @@ import { Attachment } from 'src/app/models/attachment.model';
import { AttachmentsService } from 'src/app/services/attachments.service';
import { FormGroup, FormBuilder, Validators } from "@angular/forms";
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { AttachmentsPage } from '../attachments/attachments.page';
@Component({
@@ -40,6 +41,7 @@ export class EventDetailPage implements OnInit {
private modalCtrl: ModalController,
private alertService: AlertService,
private attachamentsService: AttachmentsService,
private route: Router,
private iab: InAppBrowser) {
this.loadedEvent = new Event();
this.loadedEvent.Body = new EventBody();
@@ -191,8 +193,6 @@ export class EventDetailPage implements OnInit {
const browser = this.iab.create(url,"_blank");
browser.show();
}
back()
{
@@ -206,4 +206,30 @@ export class EventDetailPage implements OnInit {
}, 2000);
}
navigateTo(ev){
this.route.navigate(['/home/events',ev]);
}
async openAttachments(){
const modal = await this.modalCtrl.create({
component: AttachmentsPage,
componentProps: {
eventId: this.pageId,
attachments: this.loadedEventAttachments
},
cssClass: 'attachments',
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss().then((data) => {
if (data['data'] != null)
{
let newattendees: EventPerson[] = data['data'];
this.loadedEvent.Attendees = newattendees;
}
});
}
}
+8 -8
View File
@@ -73,7 +73,7 @@
<ion-icon slot="start" name="reader"></ion-icon>
</div>
<div class="div-content-{{event.CalendarName}}">
<h3>{{event.Subject}}</h3>
<h3 class="capitalizeText">{{event.Subject}}</h3>
<p>{{event.StartDate | date: 'hh:mm'}} - {{event.EndDate| date: 'hh:mm'}}</p>
</div>
</div>
@@ -82,7 +82,7 @@
<ion-icon class="ion-icon-location" slot="start" name="location"></ion-icon>
</div>
<div class="div-botton-middle">
<p class="item-list-small">{{event.Location}}</p>
<p class="item-list-small capitalizeText">{{event.Location}}</p>
</div>
<div *ngIf="event.HasAttachments" class="div-botton-right">
<ion-icon class="ion-icon-attach" slot="end" name="attach-outline"></ion-icon>
@@ -99,14 +99,14 @@
<ion-item-sliding>
<ion-item lines="none"
*ngFor="let event of officialeventsList"
[routerLink]="['/home/events', event.EventId]">
[routerLink]="['/home/events', event.EventId, 'events']">
<div class="div-item-{{event.CalendarName}}">
<div class="div-up">
<div class="div-icon">
<ion-icon slot="start" name="reader"></ion-icon>
</div>
<div class="div-content-{{event.CalendarName}}">
<h3>{{event.Subject}}</h3>
<h3 class="capitalizeText">{{event.Subject}}</h3>
<p>{{event.StartDate | date: 'hh:mm'}} - {{event.EndDate | date: 'hh:mm'}}</p>
</div>
</div>
@@ -115,7 +115,7 @@
<ion-icon class="ion-icon-location" slot="start" name="location"></ion-icon>
</div>
<div class="div-botton-middle">
<p class="item-list-small">{{event.Location}}</p>
<p class="item-list-small capitalizeText">{{event.Location}}</p>
</div>
<div class="div-botton-right">
<ion-icon class="ion-icon-attach" slot="end" name="attach-outline"></ion-icon>
@@ -132,14 +132,14 @@
<ion-item-sliding>
<ion-item lines="none"
*ngFor="let event of personaleventsList"
[routerLink]="['/home/events', event.EventId]">
[routerLink]="['/home/events', event.EventId, 'events']">
<div class="div-item-{{event.CalendarName}}">
<div class="div-up">
<div class="div-icon">
<ion-icon slot="start" name="reader"></ion-icon>
</div>
<div class="div-content-{{event.CalendarName}}">
<h3>{{event.Subject}}</h3>
<h3 class="capitalizeText">{{event.Subject}}</h3>
<p>{{event.StartDate | date: 'hh:mm' }} - {{event.EndDate | date: 'hh:mm'}}</p>
</div>
</div>
@@ -148,7 +148,7 @@
<ion-icon class="ion-icon-location" slot="start" name="location"></ion-icon>
</div>
<div class="div-botton-middle">
<p class="item-list-small">{{event.Location}}</p>
<p class="item-list-small capitalizeText">{{event.Location}}</p>
</div>
<div class="div-botton-right">
<ion-icon class="ion-icon-attach" slot="end" name="attach-outline"></ion-icon>