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

Update improve agenda

Browse Source
This commit is contained in:
Peter Maquiran
2021-03-19 15:56:58 +01:00
parent 2798d162f4
commit 733c485e5d
8 changed files with 74 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/agenda/agenda.page.html
+6 -5
View File
@@ -83,11 +83,12 @@
<!-- Adding a customized ng-template -->
<ng-template #template let-view="view" let-row="row" let-col="col">
<div [className]="currentDayEventDisplayBorder(view.dates, row*7+col)" [class.with-event]="view.dates[row*7+col].events.length">
{{ view.dates[row*7+col].label }}
<div class="indicator-container">
<!-- <div class="event-indicator" *ngFor="let e of view.dates[row*7+col].events"></div> -->
</div>
<div [className]="currentDayEventDisplayBorder(view.dates, row*7+col)" class="d-flex justify-center align-center" [class.with-event]="view.dates[row*7+col].events.length">
<div class="day">
{{ view.dates[row*7+col].label }}
</div>
</div>
</ng-template>
</div>
src/app/pages/agenda/agenda.page.ts
+15 -16
View File
@@ -280,28 +280,27 @@ export class AgendaPage implements OnInit {
// for calendar
currentDayEventDisplayBorder(day: any, id: any){
const events = day[id].events;
if (events.length == 0) {
return "";
} else if (events.length >= 1) {
/** @description store all event type */
let eventType = {};
let eventTypeNum: number;
return "";
} else if (events.length >= 1) {
let classs = [];
events.forEach(element => {
eventType[element.calendarName] = 1;
const profile_ = element.profile == 'md'? 'mdgpr': 'pr';
const eventtype = element.event.CalendarName;
classs.push(`calendar-event-border calendar-${profile_}-event-type-${eventtype}`);
});
eventTypeNum = (Object.keys(eventType)).length
if (eventTypeNum == 2) {
return ` calendar-event-border calendar-${this.profile}-event-type-both`;
} else {
return ` calendar-event-border calendar-${this.profile}-event-type-`+(Object.keys(eventType))[0];
}
return classs.join(' ');
}
return "";
@@ -419,6 +418,8 @@ export class AgendaPage implements OnInit {
console.log(eventsList);
this.showTimelineFilterState = false;
eventsList.forEach((element, eventIndex) => {
// timeline start
@@ -442,8 +443,6 @@ export class AgendaPage implements OnInit {
});
this.onCurrentChanged(this.eventSelectedDate);
//
this.showTimelineFilterState = false;
return events;
}
src/app/shared/agenda/event-list/event-list.component.html
+1 -1
View File
@@ -1,4 +1,4 @@
<ion-header class="ion-no-border">
<ion-header class="ion-no-border px-20">
<div class="header-content">
<div class="header-icon-left">
<ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
src/app/shared/agenda/event-list/event-list.component.scss
+1 -3
View File
@@ -1,17 +1,15 @@
.header-content{
width: 360px;
overflow: auto;
margin: 0 auto;
padding-top: 25px;
}
.header-icon-left{
width: 36px;
font-size: 33px;
color: #42b9fe;
float: left;
}
.header-title{
width: 300px;
font-family: Roboto;
font-size: 25px;
margin: 0 5px 0 5px;
src/app/shared/agenda/new-event/new-event.component.html
+20 -20
View File
@@ -16,11 +16,11 @@
<ion-input placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input>
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-input placeholder="Localização" [(ngModel)]="postEvent.Location"></ion-input>
</div>
</div>
@@ -32,11 +32,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-select placeholder="Selecione agenda"
selectedText="{{postEvent.CalendarName}}"
[(ngModel)]="postEvent.CalendarName"
@@ -50,11 +50,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-select placeholder="Selecione tipo"
[(ngModel)]="postEvent.Categories[0]"
interface="action-sheet"
@@ -69,11 +69,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-datetime
placeholder="Início"
[(ngModel)]="postEvent.StartDate"
@@ -90,11 +90,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-datetime
placeholder="Fim"
[(ngModel)]="postEvent.EndDate"
@@ -111,11 +111,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-refresh.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-select placeholder="Selecione repetição" value="false" interface="action-sheet" Cancel-text="Cancelar" required>
<ion-select-option value="false">Não se repete</ion-select-option>
<ion-select-option value="true">Repete</ion-select-option>
@@ -125,11 +125,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-person.svg"></ion-icon>
</div>
<div (click)="openAttendees()" class="ion-input-class-no-height">
<div (click)="openAttendees()" class="ion-input-class-no-height flex-grow-1">
<div class="list-people">
<ion-item lines="none">
<ion-list>
@@ -146,11 +146,11 @@
</div>
<div hidden class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-people-cc.svg"></ion-icon>
</div>
<div class="ion-input-class-no-height">
<div class="ion-input-class flex-grow-1-no-height">
<div class="list-people">
<ion-item lines="none">
<ion-list>
@@ -167,11 +167,11 @@
</div>
<div class="container-div">
<div class="ion-item-class-2">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-input placeholder="Detalhes" [(ngModel)]="postEvent.Body.Text"></ion-input>
</div>
</div>
@@ -203,8 +203,8 @@
</div>
</div>
</ion-content>
<ion-footer class="ion-no-border d-flex justify-center">
<ion-toolbar class="btn-div ">
<ion-footer class="ion-no-border px-20">
<ion-toolbar class="d-flex justify-space-between">
<ion-buttons slot="start">
<ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
<ion-label>Cancelar</ion-label>
src/app/shared/agenda/new-event/new-event.component.scss
-4
View File
@@ -18,7 +18,6 @@ ion-content{
transform: translate3d(0, 1px, 0);
.title-content{
width: 360px;
margin: 0px auto;
overflow: auto;
padding: 0 !important;
@@ -46,7 +45,6 @@ ion-content{
padding: 15px 20px 0 20px;
.ion-item-container{
width: 360px;
margin: 15px auto;
border: 1px solid #ebebeb;
border-radius: 5px;
@@ -63,7 +61,6 @@ ion-content{
overflow: auto;
}
.ion-item-class-2{
width: 360px;
margin: 0px auto;
}
.ion-icon-class{
@@ -78,7 +75,6 @@ ion-content{
margin-left: 0;
}
.ion-input-class{
width: 315px;
height: 45px;
border: 1px solid #ebebeb;
border-radius: 5px;
src/app/shared/agenda/view-event/view-event.page.html
+1 -1
View File
@@ -20,7 +20,7 @@
<ion-content>
<div class="main-content">
<div class="upper-content">
<div class="content-location d-flex justify-space-between">
<div class="content-location d-flex justify-space-betweenu">
<div class="location-detail">
<ion-label >{{loadedEvent.Location}}</ion-label>
</div>
src/global.scss
+30 -8
View File
@@ -178,32 +178,44 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.calendar-event-border{
border-radius: 21px !important;
color: black !important;
margin: 0px auto !important;
width: 35px !important;
border: 1px solid #fff;
border-radius: 50px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
border-radius: 106px;
width: 30px !important;
height: 30px;
padding: 0px !important;
div.day{
padding: 0px !important;
transform: rotate(-45deg);
}
}
.calendar-mdgpr-event-type-Oficial{
border-left: 3px solid #ffb703 !important;
}
.calendar-mdgpr-event-type-Pessoal{
border-right: 3px solid #f05d5e !important;
border-top: 3px solid #f05d5e !important;
}
.calendar-mdgpr-event-type-both{
border-left: 3px solid #ffb703 !important;
border-right: 3px solid #f05d5e !important;
border-top: 3px solid #f05d5e !important;
}
.calendar-pr-event-type-both{
border-left: 3px solid #99e47b !important;
border-right: 3px solid #958bfc !important;
border-right: 3px solid #99e47b !important;
border-bottom: 3px solid #958bfc !important;
}
.calendar-pr-event-type-Oficial{
border-left: 3px solid #99e47b !important;
border-right: 3px solid #99e47b !important;
}
.calendar-pr-event-type-Pessoal{
border-left: 3px solid #958bfc !important;
border-bottom: 3px solid #958bfc !important;
}
.cal-hour-segment {
@@ -447,4 +459,14 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
div.cal-event:focus{
outline: none !important;
}
}
.calendar-component{
td{
padding: 8px !important;
div{
padding-left: 0px;
}
}
}