mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Add shared component header MD in events page
This commit is contained in:
@@ -1,234 +1,20 @@
|
||||
<ion-header class="ion-no-border">
|
||||
<ion-toolbar class="ion-no-border" class="bg-blue">
|
||||
<div class="div-top-header">
|
||||
<div class="div-search">
|
||||
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="div-logo">
|
||||
<img src='assets/images/logo-no-bg.png' alt='logo'>
|
||||
</div>
|
||||
<div class="div-profile">
|
||||
<ion-icon src='assets/images/icons-profile.svg'></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-header translucent="true">
|
||||
<ion-toolbar class="bg-blue">
|
||||
<ion-buttons slot="end">
|
||||
<div class="toggleBox">
|
||||
<div (click)="changeProfile()" class="toggle">
|
||||
<input type="checkbox">
|
||||
<label for="" class="onbtn">PR</label>
|
||||
<label for="" class="ofbtn">MDGPR</label>
|
||||
</div>
|
||||
</div>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
<ion-toolbar class="bg-blue">
|
||||
<ion-label>
|
||||
<ion-item class="ion-text-right" lines="none">
|
||||
<ion-label class="ion-text-wrap">
|
||||
<h3 class="header-medium"> {{greetting}} Excelência <br />
|
||||
Ministro Director do Gabinete do<!-- <br /> -->
|
||||
Presidente da República
|
||||
</h3>
|
||||
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ion-label>
|
||||
</ion-toolbar>
|
||||
<!-- TABS -->
|
||||
<ion-toolbar>
|
||||
<ion-segment [(ngModel)]="segment" (ionChange)="onSegmentChange()">
|
||||
<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>
|
||||
<app-header></app-header>
|
||||
</ion-header>
|
||||
|
||||
<ion-content >
|
||||
<ion-content class="main bg-blue">
|
||||
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
|
||||
|
||||
<ion-label>
|
||||
<p class="p-small">{{customDate}}</p>
|
||||
<p class="p-small ion-text-center">{{customDate}}</p>
|
||||
</ion-label>
|
||||
<ion-label>
|
||||
<p class="p-small ion-text-center"> <bold>5</bold> eventtos agendados para hoje</p>
|
||||
</ion-label>
|
||||
<app-calendar></app-calendar>
|
||||
<!-- <ion-item lines="none">
|
||||
<ion-icon slot="start" src="assets/images/icons-agenda.svg"></ion-icon>
|
||||
<label>A sua Agenda</label>
|
||||
</ion-item> -->
|
||||
<!-- COMBINADA -->
|
||||
<div [ngSwitch]="segment">
|
||||
<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>
|
||||
<!-- <ion-list *ngSwitchCase="'Combinada'" >
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none"
|
||||
*ngFor="let event of eventsList"
|
||||
[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 class="capitalizeText">{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate | date: 'hh:mm'}} - {{event.EndDate| date: 'hh:mm'}}</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 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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</ion-item-group>
|
||||
</ion-list> -->
|
||||
<ion-list *ngSwitchCase="'Combinada'">
|
||||
<div *ngIf="eventsList">
|
||||
<ion-item-sliding>
|
||||
<ion-item class="Rectangle" lines="none"
|
||||
*ngFor="let event of eventsList"
|
||||
[routerLink]="['/home/events', event.EventId, 'events']">
|
||||
<div class="content-{{profile}}-{{event.CalendarName}}">
|
||||
<div class="approve-event-time">
|
||||
<p>{{event.StartDate | date: 'hh:mm'}}</p>
|
||||
<p>{{event.EndDate | date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
<div class="approve-event-detail">
|
||||
<p>{{event.Location}}</p>
|
||||
<h3>{{event.Subject}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</div>
|
||||
</ion-list>
|
||||
<!-- OFICIAL -->
|
||||
<!-- <ion-list *ngSwitchCase="'Oficial'">
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none"
|
||||
*ngFor="let event of officialeventsList"
|
||||
[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 class="capitalizeText">{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate | date: 'hh:mm'}} - {{event.EndDate | date: 'hh:mm'}}</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 capitalizeText">{{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> -->
|
||||
<ion-list *ngSwitchCase="'Oficial'">
|
||||
<div *ngIf="officialeventsList">
|
||||
<ion-item-sliding>
|
||||
<ion-item class="Rectangle" lines="none"
|
||||
*ngFor="let event of officialeventsList"
|
||||
[routerLink]="['/home/events', event.EventId, 'events']">
|
||||
<div class="content-{{profile}}-{{event.CalendarName}}">
|
||||
<div class="approve-event-time">
|
||||
<p>{{event.StartDate | date: 'hh:mm'}}</p>
|
||||
<p>{{event.EndDate | date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
<div class="approve-event-detail">
|
||||
<p>{{event.Location}}</p>
|
||||
<h3>{{event.Subject}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</div>
|
||||
</ion-list>
|
||||
<!-- OFICIAL -->
|
||||
<!-- <ion-list *ngSwitchCase="'Pessoal'">
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none"
|
||||
*ngFor="let event of personaleventsList"
|
||||
[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 class="capitalizeText">{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate | date: 'hh:mm' }} - {{event.EndDate | date: 'hh:mm'}}</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 capitalizeText">{{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> -->
|
||||
<ion-list *ngSwitchCase="'Pessoal'">
|
||||
<div *ngIf="personaleventsList">
|
||||
<ion-item-sliding>
|
||||
<ion-item class="Rectangle" lines="none"
|
||||
*ngFor="let event of personaleventsList"
|
||||
[routerLink]="['/home/events', event.EventId, 'events']">
|
||||
<div class="content-{{profile}}-{{event.CalendarName}}">
|
||||
<div class="approve-event-time">
|
||||
<p>{{event.StartDate | date: 'hh:mm'}}</p>
|
||||
<p>{{event.EndDate | date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
<div class="approve-event-detail">
|
||||
<p>{{event.Location}}</p>
|
||||
<h3>{{event.Subject}}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</div>
|
||||
</ion-list>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
<div class="next-meeting">
|
||||
<div class="meeting-time">08:30</div>
|
||||
<div class="meeting-description">Reunião de Conselho de Ministros no Palácio Presidencial</div>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
Reference in New Issue
Block a user