mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-21 13:55:51 +00:00
1-Improved project structure. 2-Added new pages. 3-Prepared the environment to consume APIS. 4-Added Axios to the project. 5-Added get methods.
This commit is contained in:
Tiago Kayaya
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { EventDetailPage } from './event-detail.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: EventDetailPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class EventDetailPageRoutingModule {}
|
||||
@@ -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 { EventDetailPageRoutingModule } from './event-detail-routing.module';
|
||||
|
||||
import { EventDetailPage } from './event-detail.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
EventDetailPageRoutingModule
|
||||
],
|
||||
declarations: [EventDetailPage]
|
||||
})
|
||||
export class EventDetailPageModule {}
|
||||
@@ -0,0 +1,15 @@
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button defaultHref="/events"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>Event detail</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<ion-item>
|
||||
<ion-label>{{loadedEvent.Subject}}</ion-label>
|
||||
</ion-item>
|
||||
|
||||
</ion-content>
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EventDetailPage } from './event-detail.page';
|
||||
|
||||
describe('EventDetailPage', () => {
|
||||
let component: EventDetailPage;
|
||||
let fixture: ComponentFixture<EventDetailPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ EventDetailPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(EventDetailPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,31 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { EventsService } from 'src/app/services/events.service';
|
||||
|
||||
import { Event } from '../../../models/event.model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-event-detail',
|
||||
templateUrl: './event-detail.page.html',
|
||||
styleUrls: ['./event-detail.page.scss'],
|
||||
})
|
||||
export class EventDetailPage implements OnInit {
|
||||
|
||||
loadedEvent: Event;
|
||||
|
||||
constructor(private activatedRoute: ActivatedRoute, private eventsService: EventsService) { }
|
||||
|
||||
ngOnInit() {
|
||||
/* Emit new data when something changes */
|
||||
this.activatedRoute.paramMap.subscribe(paramMap =>{
|
||||
if(!paramMap.has('eventId')){
|
||||
//Redirect
|
||||
return;
|
||||
}
|
||||
const eventId = paramMap.get('eventId');
|
||||
/* Load my event detail */
|
||||
this.loadedEvent = this.eventsService.getEvent(eventId);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { EventsPage } from './events.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: EventsPage
|
||||
},
|
||||
{
|
||||
path: 'event-detail',
|
||||
loadChildren: () => import('./event-detail/event-detail.module').then( m => m.EventDetailPageModule)
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class EventsPageRoutingModule {}
|
||||
@@ -0,0 +1,21 @@
|
||||
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EventsPageRoutingModule } from './events-routing.module';
|
||||
|
||||
import { EventsPage } from './events.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
EventsPageRoutingModule
|
||||
],
|
||||
declarations: [EventsPage],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
||||
})
|
||||
export class EventsPageModule {}
|
||||
@@ -0,0 +1,149 @@
|
||||
<ion-header translucent="true">
|
||||
<ion-toolbar>
|
||||
<ion-title>
|
||||
<ion-item class="ion-text-header-top" lines="none">
|
||||
<div class="div-logo">
|
||||
<img src='assets/images/logo.png' alt='logo'>
|
||||
</div>
|
||||
<ion-label>
|
||||
<h6 class="header-xsmall">Presidente da República</h6>
|
||||
<h2 class="header-large">GABINETE DIGITAL</h2>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-item class="ion-text-right" lines="none">
|
||||
<ion-label class="ion-text-wrap">
|
||||
<h3 class="header-medium"> {{greetting}} Sua Excelência <br />
|
||||
Minístro Director do Gabinete do<br />
|
||||
Presidente da República
|
||||
</h3>
|
||||
<p class="p-small">{{customDate}}</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<!-- TABS -->
|
||||
<ion-toolbar >
|
||||
<ion-segment [(ngModel)]="segment">
|
||||
<ion-segment-button value="combinada">
|
||||
Combinada
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="oficial">
|
||||
Oficial
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="pessoal">
|
||||
Pessoal
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
</ion-toolbar>
|
||||
<!-- List of Text Items -->
|
||||
<div [ngSwitch]="segment">
|
||||
<ion-list *ngSwitchCase="'combinada'">
|
||||
|
||||
<ion-item-group>
|
||||
<!-- [routerLink]="['/events', event.id]"
|
||||
(click)="gotTo(event.id)"-->
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none"
|
||||
*ngFor="let event of events"
|
||||
[routerLink]="['/home/events', event.EventId]">
|
||||
|
||||
<div class="div-item">
|
||||
<div class="div-up">
|
||||
<div class="div-icon">
|
||||
<ion-icon slot="start" name="reader"></ion-icon>
|
||||
</div>
|
||||
<div class="div-content-oficial">
|
||||
<h3>{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate}} - {{event.EndDate}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-botton">
|
||||
<div class="div-botton-left">
|
||||
<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>
|
||||
</div>
|
||||
<div class="div-botton-right">
|
||||
<ion-icon class="ion-icon-attach" slot="end" name="attach-outline"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
|
||||
</ion-item-group>
|
||||
|
||||
</ion-list>
|
||||
<!-- OFICIAL -->
|
||||
<ion-list *ngSwitchCase="'oficial'">
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item-divider>
|
||||
<ion-label>8:00 am</ion-label>
|
||||
</ion-item-divider>
|
||||
<ion-item lines="none" *ngFor="let event of events">
|
||||
<div class="div-item">
|
||||
<div class="div-up">
|
||||
<div class="div-icon">
|
||||
<ion-icon slot="start" name="reader"></ion-icon>
|
||||
</div>
|
||||
<div class="div-content-oficial">
|
||||
<h3>{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate}} - {{event.EndDate}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-botton">
|
||||
<div class="div-botton-left">
|
||||
<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>
|
||||
</div>
|
||||
<div class="div-botton-right">
|
||||
<ion-icon class="ion-icon-attach" slot="end" name="attach"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</ion-item-group>
|
||||
</ion-list>
|
||||
|
||||
<ion-list *ngSwitchCase="'pessoal'">
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none" *ngFor="let event of events">
|
||||
<div class="div-item">
|
||||
<div class="div-up">
|
||||
<div class="div-icon">
|
||||
<ion-icon slot="start" name="reader"></ion-icon>
|
||||
</div>
|
||||
<div class="div-content-pessoal">
|
||||
<h3>{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate}} - {{event.EndDate}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-botton">
|
||||
<div class="div-botton-left">
|
||||
<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>
|
||||
</div>
|
||||
<div class="div-botton-right">
|
||||
<ion-icon class="ion-icon-attach" slot="end" name="attach"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</ion-item-group>
|
||||
|
||||
</ion-list>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@@ -0,0 +1,135 @@
|
||||
/* HEADER */
|
||||
.ion-text-header-top{
|
||||
text-align: center;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.div-logo{
|
||||
width: 98px;
|
||||
}
|
||||
.div-logo img{
|
||||
width: 100%;
|
||||
}
|
||||
.header-large{
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 16pt;
|
||||
/* font-weight: 600; */
|
||||
}
|
||||
.header-medium{
|
||||
font-size: 16pt;
|
||||
font-family: roboto;
|
||||
}
|
||||
.header-xsmall{
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12.7pt;
|
||||
font-weight: bold;
|
||||
padding-bottom: 3.5px;
|
||||
margin-bottom: 3.5px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
.p-small{
|
||||
font-size: 12pt;
|
||||
margin-top: 25px;
|
||||
color:#000;
|
||||
}
|
||||
|
||||
/* CONTENT */
|
||||
.item-list-small{
|
||||
font-size: 14px;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-class{
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
.label-text{
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
//DIV
|
||||
.div-item{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin: 10px 0 5px 0;
|
||||
}
|
||||
.div-up{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.div-up h3{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 17px;
|
||||
width: 100%;
|
||||
}
|
||||
.div-icon{
|
||||
width: 10%;
|
||||
font-size: 22px;
|
||||
float: left;
|
||||
color: #808080;
|
||||
}
|
||||
.div-icon ion-icon{
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
.div-content-oficial{
|
||||
width: 85%;
|
||||
float: left;
|
||||
border-left: 3px solid #cab0dc;
|
||||
padding: 0 0 0 12px;
|
||||
}
|
||||
.div-content-pessoal{
|
||||
width: 85%;
|
||||
float: left;
|
||||
border-left: 3px solid #cbeecb;
|
||||
padding: 0 0 0 12px;
|
||||
}
|
||||
.div-content-oficial h3, .div-content-pessoal h3{
|
||||
font-size: 16pt;
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
.div-content-oficial p, .div-content-pessoal p{
|
||||
font-size: 14pt;
|
||||
color: rgb(94, 92, 92);
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
.div-botton{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
margin: 10px 0 5px 0;
|
||||
}
|
||||
.div-botton-left{
|
||||
width: 10%;
|
||||
float: left;
|
||||
}
|
||||
.ion-icon-location{
|
||||
text-align: center;
|
||||
display: block;
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.div-botton-middle{
|
||||
width: 75%;
|
||||
float: left;
|
||||
margin-top: 0.5px;
|
||||
}
|
||||
.div-botton-middle p{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.div-botton-right{
|
||||
width: 10%;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ion-icon-attach{
|
||||
color: #666666;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EventsPage } from './events.page';
|
||||
|
||||
describe('EventsPage', () => {
|
||||
let component: EventsPage;
|
||||
let fixture: ComponentFixture<EventsPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ EventsPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(EventsPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,62 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
import { Event } from '../../models/event.model';
|
||||
import { EventsService } from 'src/app/services/events.service';
|
||||
import { Router } from '@angular/router';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-events',
|
||||
templateUrl: './events.page.html',
|
||||
styleUrls: ['./events.page.scss'],
|
||||
})
|
||||
export class EventsPage implements OnInit {
|
||||
|
||||
/* Get current system date */
|
||||
today = new Date();
|
||||
months = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
|
||||
days = ["Domingo", "Segunda-feira", "Terça-feira", "Quarta-feira", "Quinta-feira", "Sexta-feira", "Sábado"];
|
||||
customDate = this.days[this.today.getDay()]+ ", "
|
||||
+ this.today.getDate() +" de "
|
||||
+ ( this.months[this.today.getMonth()]);
|
||||
/* Setting appropriate greeting according to the time */
|
||||
grettings = ["Bom dia", "Boa tarde", "Boa noite"];
|
||||
greetting='';
|
||||
timeDate = this.today.getHours() + ":" + this.today.getMinutes();
|
||||
/* Set segment variable */
|
||||
segment:string;
|
||||
|
||||
events: Event[];
|
||||
|
||||
constructor(private eventService: EventsService, private router: Router, public activatedRoute: ActivatedRoute) { }
|
||||
|
||||
ngOnInit() {
|
||||
//Inicializar segment
|
||||
this.segment = "combinada";
|
||||
this.showGreeting();
|
||||
/* Call Get events method */
|
||||
this.events = this.eventService.getAllEvents();
|
||||
}
|
||||
|
||||
showGreeting(){
|
||||
if(this.today.getHours() >= 6 && this.today.getHours() < 12){
|
||||
console.log(this.grettings[0]+this.today.getHours());
|
||||
this.greetting = this.grettings[0];
|
||||
}
|
||||
else if(this.today.getHours() >= 12 && this.today.getHours() < 18){
|
||||
console.log(this.grettings[1]+this.today.getHours());
|
||||
this.greetting = this.grettings[1];
|
||||
}
|
||||
else /* if(this.today.getHours() < 6 && this.today.getHours() >= 18) */{
|
||||
console.log(this.grettings[2]+this.today.getHours());
|
||||
this.greetting = this.grettings[2];
|
||||
|
||||
}
|
||||
}
|
||||
gotTo(ev){
|
||||
this.router.navigate(['/home/events']);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,11 +1,4 @@
|
||||
/* .div-logo{
|
||||
width: 100px;
|
||||
border: 1px solid blue;
|
||||
} */
|
||||
/* img{
|
||||
width: 100px;
|
||||
border: 1px solid red;
|
||||
} */
|
||||
|
||||
/* HEADER */
|
||||
.ion-text-header-top{
|
||||
text-align: center;
|
||||
@@ -20,7 +13,7 @@
|
||||
.header-large{
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 16pt;
|
||||
font-weight: bold;
|
||||
/* font-weight: 600; */
|
||||
}
|
||||
.header-medium{
|
||||
font-size: 16pt;
|
||||
|
||||
@@ -85,7 +85,7 @@ export class LoginPage implements OnInit {
|
||||
//Go to our home in home/feed.
|
||||
|
||||
if(this.validateInput()){
|
||||
this.router.navigate(['/home/feed']);
|
||||
this.router.navigate(['/home/events']);
|
||||
/* if (await this.authService.login(this.postData))
|
||||
{
|
||||
this.router.navigate(['/home/feed']);
|
||||
|
||||
Reference in New Issue
Block a user