peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 04:57:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

New Event Fields Control

Browse Source
This commit is contained in:
Paulo Pinto
2020-09-02 12:45:11 +01:00
parent 5a610d5cc3
commit 5d565b5567
5 changed files with 108 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/cal-modal/cal-modal.module.ts
+2 -1
View File
@@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
@@ -15,6 +15,7 @@ import { NgCalendarModule } from 'ionic2-calendar';
FormsModule,
IonicModule,
CalModalPageRoutingModule,
ReactiveFormsModule,
NgCalendarModule
],
declarations: [CalModalPage]
src/app/pages/cal-modal/cal-modal.page.html
+73 -40
View File
@@ -11,46 +11,79 @@
<ion-content>
<div class="div-ion-content">
<ion-item>
<ion-label position="floating">Assunto</ion-label>
<ion-input type="text" [(ngModel)]="postEvent.Subject"></ion-input>
</ion-item>
<ion-item>
<ion-label position="floating">Descrição</ion-label>
<ion-input type="text" [(ngModel)]="postEvent.Body.Text"></ion-input>
</ion-item>
<ion-item>
<ion-label position="floating">Localização</ion-label>
<ion-input type="text" [(ngModel)]="postEvent.Location"></ion-input>
</ion-item>
<ion-item>
<ion-label position="floating">Selecione a Agenda</ion-label>
<ion-select [(ngModel)]="postEvent.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>
</ion-item>
<ion-item>
<ion-label position="floating">Tipo de evento</ion-label>
<ion-select [(ngModel)]="postEvent.EventType" interface="action-sheet" class="custom-options" Cancel-text="Cancelar">
<ion-select-option value="Reunião">Reunião</ion-select-option>
<ion-select-option value="Viagem">Viagem</ion-select-option>
<ion-select-option value="Conferência">Conferência</ion-select-option>
<ion-select-option value="Encontro">Encontro</ion-select-option>
</ion-select>
</ion-item>
<ion-item>
<ion-label position="floating">Data Início</ion-label>
<ion-datetime [(ngModel)]="postEvent.StartDate" min="2020" max="2100"
displayFormat="D MMM YYYY H:mm"
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"></ion-datetime>
</ion-item>
<ion-item>
<ion-label position="floating">Data Fim</ion-label>
<ion-datetime [(ngModel)]="postEvent.EndDate" min="2020" max="2100"
displayFormat="D MMM YYYY H:mm"
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"></ion-datetime>
</ion-item>
<form [formGroup]="ionicForm" novalidate>
<ion-item>
<ion-label position="floating">Assunto</ion-label>
<ion-input formControlName="subject" type="text" [(ngModel)]="postEvent.Subject" required></ion-input>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.subject.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Descrição</ion-label>
<ion-input formControlName="description" type="text" [(ngModel)]="postEvent.Body.Text" required></ion-input>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.startdate.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Localização</ion-label>
<ion-input formControlName="location" type="text" [(ngModel)]="postEvent.Location" required></ion-input>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.startdate.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Selecione a Agenda</ion-label>
<ion-select formControlName="agenda" [(ngModel)]="postEvent.CalendarName" interface="action-sheet" class="custom-options" Cancel-text="Cancelar" required>
<ion-select-option Pessoal="Reunião">Pessoal</ion-select-option>
<ion-select-option Oficial="Viagem">Oficial</ion-select-option>
</ion-select>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.agenda.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Tipo de evento</ion-label>
<ion-select formControlName="eventtype" [(ngModel)]="postEvent.EventType" interface="action-sheet" class="custom-options" Cancel-text="Cancelar" required>
<ion-select-option value="Reunião">Reunião</ion-select-option>
<ion-select-option value="Viagem">Viagem</ion-select-option>
<ion-select-option value="Conferência">Conferência</ion-select-option>
<ion-select-option value="Encontro">Encontro</ion-select-option>
</ion-select>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.startdate.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Data Início</ion-label>
<ion-datetime formControlName="startdate" [(ngModel)]="postEvent.StartDate" min="2020" max="2100"
displayFormat="D MMM YYYY H:mm" minuteValues="0,15,30,45"
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
required>
</ion-datetime>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.startdate.errors?.required">
Campo obrigatório
</span>
<ion-item>
<ion-label position="floating">Data Fim</ion-label>
<ion-datetime formControlName="enddate" [(ngModel)]="postEvent.EndDate" min="2020" max="2100"
displayFormat="D MMM YYYY H:mm" minuteValues="0,15,30,45"
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
required></ion-datetime>
</ion-item>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="errorControl.enddate.errors?.required">
Campo obrigatório
</span>
</form>
<div class="div-attach">
<ion-item lines="none">
<ion-icon name="add" slot="end" (click)="openAttendees()"></ion-icon>
src/app/pages/cal-modal/cal-modal.page.scss
+6 -1
View File
@@ -14,7 +14,12 @@
margin: 15px 0 0 0;
padding: 15px;
}
.error{
color:red;
font-size: 12px;
font-weight: bold;
padding-bottom: 20px;
}
/* ion-item{
display: block;
border: 1px solid red;
src/app/pages/cal-modal/cal-modal.page.ts
+25 -6
View File
@@ -9,6 +9,7 @@ import { AttendeesPage } from 'src/app/pages/events/attendees/attendees.page';
import { AttendeeModalPage } from '../events/attendee-modal/attendee-modal.page';
import { EventPerson } from 'src/app/models/eventperson.model';
import { AlertService } from 'src/app/services/alert.service';
import { FormGroup, FormBuilder, Validators } from "@angular/forms";
@Component({
selector: 'app-cal-modal',
@@ -29,13 +30,28 @@ export class CalModalPage implements OnInit {
eventAttendees: EventPerson[];
segment:string = "true";
constructor(private modalCtrl: ModalController, private eventService: EventsService, private alertController:AlertService) {
this.postEvent = new Event();
this.postEvent.Body = { BodyType : "1", Text : ""};
ionicForm: FormGroup;
isSubmitted = false;
constructor(public formBuilder: FormBuilder, private modalCtrl: ModalController, private eventService: EventsService, private alertController:AlertService) {
this.postEvent = new Event();
this.postEvent.Body = { BodyType : "1", Text : ""};
}
ngOnInit() {
this.ionicForm = this.formBuilder.group({
subject: ['', [Validators.required]],
agenda: ['', [Validators.required]],
startdate: ['', [Validators.required]],
enddate: ['', [Validators.required]],
description: ['', [Validators.required]],
location: ['', [Validators.required]],
eventtype: ['', [Validators.required]]
})
}
get errorControl() {
return this.ionicForm.controls;
}
ngAfterViewInit(): void {
@@ -45,8 +61,11 @@ export class CalModalPage implements OnInit {
}
save(){
this.eventService.postEvent(this.postEvent, this.postEvent.CalendarName).subscribe();
this.modalCtrl.dismiss(this.postEvent);
if (this.ionicForm.valid)
{
this.eventService.postEvent(this.postEvent, this.postEvent.CalendarName).subscribe();
this.modalCtrl.dismiss(this.postEvent);
}
}
onViewTitleChanged(title){