Merge remote-tracking branch 'origin/feature/home' into feature/chat

This commit is contained in:
tiago.kayaya
2021-01-04 16:30:55 +01:00
9 changed files with 379 additions and 10 deletions
+2 -1
View File
@@ -8,7 +8,7 @@ import { HomePageRoutingModule } from './home-routing.module';
import { HomePage } from './home.page';
/* import { IonicSelectableModule } from 'ionic-selectable'; */
import { SharedModule } from 'src/app/shared/shared.module';
@NgModule({
imports: [
@@ -16,6 +16,7 @@ import { HomePage } from './home.page';
FormsModule,
IonicModule,
HomePageRoutingModule,
SharedModule
],
declarations: [HomePage]
})
+4 -2
View File
@@ -1,5 +1,7 @@
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tabs class="tab">
<ion-tab-bar class="bottoms" slot="bottom">
<ion-tab-button tab="events">
<!-- <ion-icon name="home"></ion-icon> -->
<ion-icon class="nav-icon" src="assets/images/icons-nav-home.svg"></ion-icon>
+8
View File
@@ -25,4 +25,12 @@ ion-badge {/* */
white-space: nowrap;
vertical-align: baseline; */
}
.tab{
.bottoms{
display: flex;
justify-content: space-around;
}
}
+84 -3
View File
@@ -6,15 +6,96 @@
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-label>
<p class="p-small ion-text-center">{{customDate}}</p>
<p class="time ion-text-center">{{customDate}}</p>
</ion-label>
<ion-label>
<p class="p-small ion-text-center"> <bold>5</bold> eventtos agendados para hoje</p>
<p class="event-number p-small ion-text-center"> <bold>{{totalEvent}}</bold> eventos agendados para hoje</p>
</ion-label>
<div class="next-meeting">
<div class="meeting-time">08:30</div>
<div class="meeting-time">{{hoursMinutes}}</div>
<div class="meeting-description">Reunião de Conselho de Ministros no Palácio Presidencial</div>
</div>
<div class="conteiner-box">
<div class="schedule">
<div class="schedule-header">
<div class="title">
<ion-icon class="icon" slot="end" src="assets/images/icons-nav-agenda-active.svg" ></ion-icon>
<div class="text">A sua Agenda</div>
</div>
<ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
</div>
<div class="content">
<ul>
<li *ngFor="let event of eventsList"
[routerLink]="['/home/events', event.EventId, 'events']">
<div class="d-flex content-{{profile}}-{{event.CalendarName}}">
<div class="schedule-time">
<div class="time-start">{{event.StartDate | date: 'hh:mm'}}</div>
<div class="time-end">{{event.EndDate | date: 'hh:mm'}}</div>
</div>
<div class="schedule-details">
<div class="location">{{event.Location}}</div>
<div class="description">{{event.Subject}}</div>
</div>
</div>
</li>
</ul>
<div class="resume">
<div class="title">
Resumo para Amnahã
</div>
<div class="event-num">4 eventos ageandados para amanhã</div>
<div class="first-event-time">08:30 "Reunião Staff" no Palácio Presidencial</div>
</div>
</div>
</div>
<div class="schedule">
<div class="schedule-header">
<div class="title">
<ion-icon class="icon" slot="end" src="assets/images/icons-nav-agenda-bag.svg"></ion-icon>
<div class="text">Correspondência por ler</div>
</div>
<ion-icon class="icon-next" slot="end" src="assets/images/icons-arrow-circle-arrow-right.svg" ></ion-icon>
</div>
<div class="content">
<ul>
<li>
<div class="schedule-details">
<div class="description">Reunião de Conselho de Ministros</div>
<div class="location">MINEC, MINFIN</div>
</div>
</li>
<li>
<div class="schedule-details">
<div class="description">Reunião de Conselho de Ministros</div>
<div class="location">MINEC, MINFIN</div>
</div>
</li>
<li>
<div class="schedule-details">
<div class="description">Reunião de Conselho de Ministros</div>
<div class="location">MINEC, MINFIN</div>
</div>
</li>
<li>
<div class="schedule-details">
<div class="description">Reunião de Conselho de Ministros</div>
<div class="location">MINEC, MINFIN</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</ion-content>
+197 -1
View File
@@ -1,3 +1,5 @@
@import '~src/function.scss';
/* HEADER */
.bg-blue{
--background:#0782c9;
@@ -269,8 +271,202 @@ ion-toolbar{
}
// new
.main{
padding: 0px em(20px);
}
.event-number{
color: white;
font-family: Roboto;
font-size: 15px;
color: var(--white);
bold{
font-family: Roboto;
font-size: 25px;
text-align: right;
color: var(--white);
}
}
.time{
font-family: Roboto;
font-size: 30px;
text-align: center;
color: var(--white);
line-height: unset;
}
.next-meeting{
display: flex;
justify-content: center;
margin: 0px auto;
margin: 0px 20px;
margin-top: 15px;
.meeting-time {
font-size: em(25px);
font-family: Roboto;
font-weight: 300;
color: var(--white);
margin-right: 7px;
}
.meeting-description {
margin-top: 2px;
font-family: Roboto;
font-size: 15px;
color: var(--white);
}
}
.conteiner-box {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.schedule {
max-width: 400px;
font-family: Roboto;
margin: 10px 0px;
padding: 20px;
background-color: white;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
border: solid 1px #e9e9e9;
margin-bottom: 20px;
border-radius: 25px;
.schedule-header{
display: flex;
margin-bottom: 20px;
justify-content: space-between;
.title {
display: flex;
align-items: center;
.icon{
color: #e8e8e8;
height: 35px;
width: 35px;
margin-right: 10px;
}
.text{
font-family: Roboto;
font-size: 20px;
color: black;
}
}
.icon-next {
color: #e8e8e8;
height: 35px;
width: 35px;
font-size: 35px;
font-size: 35px;
}
}
.content{
ul{
padding: 0px;
margin: 0px;
.d-flex{
height: 40px;
display: flex;
justify-content: space-between;
align-items: center;
}
li{
padding-bottom: 5px;
margin-top: 5px;
border-bottom: 1px solid #ebebeb;
display: flex;
justify-content: space-between;
align-items: center;
.schedule-time{
margin-right: 10px;
.time-start{
color: #797979 !important;
font-family: Roboto;
font-size: 13px;
}
.time-end{
color: #797979 !important;
font-family: Roboto;
font-size: 13px;
}
}
.schedule-details{
display: flex;
flex-wrap: wrap;
align-items: center;
width: 100%;
.location{
font-family: Roboto;
font-size: 13px;
color: black;
width: 100%;
}
.description{
font-family: Roboto;
font-size: 15px;
font-weight: bold;
color: #0d89d1;
}
}
.color{
width: 5px;
height: 40px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
background-color: #f05d5e;
}
}
li:last-child{
//border-bottom: unset !important;
//padding-bottom: unset !important;
}
}
}
.resume{
.title{
font-family: Roboto;
font-size: 15px;
font-weight: 500;
color: #797979;
margin-bottom: 5px;
margin-top: 10px;
}
.event-num, .first-event-time{
font-family: Roboto;
font-size: 15px;
display: block;
color: black;
}
}
}
.d-flex {
display: flex;
}
@media only screen and (min-width: 804px) {
.schedule:first-child {
margin-right: 2%;
}
}
@media only screen and (min-width: 478px) {
.schedule{
width: 400px;
}
}
@media only screen and (max-width: 478px) {
.schedule{
width: 360px;
}
}
+37 -1
View File
@@ -12,6 +12,7 @@ import { AuthConnstants } from 'src/app/config/auth-constants';
import { ModalController } from '@ionic/angular';
import { EventDetailPage } from './event-detail/event-detail.page';
import { EventDetailModalPage } from './event-detail-modal/event-detail-modal.page';
import { ProcessesService } from '../../services/processes.service';
@Component({
selector: 'app-events',
@@ -46,6 +47,8 @@ export class EventsPage implements OnInit {
combinedEvents: Event[];
customText = false;
totalEvent=0;
currentHoursMinutes: String;
showLoader: boolean;
@@ -57,6 +60,15 @@ export class EventsPage implements OnInit {
private modalController: ModalController,
private authService: AuthService) {
this.prEventList = null;
// update hours and time
setInterval(()=> {
let d = new Date();
let n = d.toLocaleTimeString();
this.currentHoursMinutes = n.slice(0,5);
}, 1000);
}
ngOnInit() {
@@ -65,7 +77,21 @@ export class EventsPage implements OnInit {
//Initialize profile as mdgpr
this.profile = "mdgpr";
console.log(this.profile);
// set event list
if(this.profile == "mdgpr"){
this.eventService.getAllMdEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
this.eventsList = res;
this.totalEvent = this.eventsList.length;
});
}
else{
this.eventService.getAllPrEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
this.eventsList = res;
this.totalEvent = this.eventsList.length;
});
}
this.showGreeting();
@@ -201,5 +227,15 @@ export class EventsPage implements OnInit {
return await modal.present();
}
/**
* @returns time in format HH:MM:SS
*/
get hoursMinutes():String {
return this.currentHoursMinutes;
}
}
+3 -2
View File
@@ -25,7 +25,8 @@
}
.div-profile{
font-size: 45px;
float: right;
margin-right: em(10px);
margin-right: 10px;
justify-content: flex-end;
display: flex;
}
}
@@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 35 35">
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g transform="translate(-325 -562) translate(20 542) translate(305 20)">
<circle cx="17.5" cy="17.5" r="17.5" fill="#42B9FE"/>
<path stroke="#FFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M23 9L14 18 23 27" transform="matrix(-1 0 0 1 37 0)"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 544 B

@@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="35" height="35" viewBox="0 0 35 35">
<defs>
<linearGradient id="bqyepfdqpc" x1="0%" x2="100%" y1="50%" y2="50%">
<stop offset="0%" stop-color="#D30A0A"/>
<stop offset="100%" stop-color="#B50202"/>
</linearGradient>
<filter id="cfta7yu3sa" width="117.4%" height="117.4%" x="-8.7%" y="-4.3%" filterUnits="objectBoundingBox">
<feOffset dy="1" in="SourceAlpha" result="shadowOffsetOuter1"/>
<feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation=".5"/>
<feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"/>
<feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.187390734 0"/>
</filter>
<rect id="a1lq6lsipb" width="23" height="23" x="0" y="0" rx="1"/>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<g transform="translate(-40 -265) translate(20 245) translate(20 20) translate(6 6)">
<rect width="21.357" height="23" x=".821" y=".821" fill="#FFF" rx="1"/>
<g>
<use fill="#000" filter="url(#cfta7yu3sa)" xlink:href="#a1lq6lsipb"/>
<rect width="22" height="22" x=".5" y=".5" fill="#FFF" fill-opacity=".6" stroke="#EBEBEB" stroke-linejoin="square" stroke-opacity=".194" rx="1"/>
</g>
<path fill="#797979" stroke="#797979" stroke-linejoin="round" d="M3.286 12.321L3.286 9.036 6.571 9.036 6.571 12.321zM3.286 18.893L3.286 15.607 6.571 15.607 6.571 18.893zM9.857 12.321L9.857 9.036 13.143 9.036 13.143 12.321zM9.857 18.893L9.857 15.607 13.143 15.607 13.143 18.893zM16.429 12.321L16.429 9.036 19.714 9.036 19.714 12.321zM16.429 18.893L16.429 15.607 19.714 15.607 19.714 18.893z"/>
<path fill="url(#bqyepfdqpc)" d="M.5 0h22c.276 0 .5.224.5.5v4.429H0V.5C0 .224.224 0 .5 0z"/>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB