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

save

Browse Source
This commit is contained in:
tiago.kayaya
2021-07-15 16:57:19 +01:00
parent 53a1f3b026
commit cab594ff47
4 changed files with 98 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/agenda/agenda.page.html
+57 -57
View File
@@ -2,13 +2,18 @@
<app-header ></app-header>
</ion-header>
<ion-content id="timeline-conteiner agenda-container" class="timeline ">
<!-- Progress bar -->
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<ion-content id="timeline-conteiner agenda-container" class="timeline ">
<div class="d-flex container-wrapper">
<div class="calendar-timeline d-flex flex-column height-100 bg-blue">
<div class="calendar-wrapper">
<div class="main-content">
<!-- Toolbar -->
<ion-progress-bar class="calendar-progress-bar" type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
@@ -16,18 +21,18 @@
<!-- Calendar is here -->
<div class="calendar-segment-{{profile}}">
<div class="calendar-container" [style.height]="calendarHeight">
<ion-row class="ion-justify-content-between calendar-tool-tip">
<ion-row class="ion-align-items-center">
<!-- Move back one screen of the slides -->
<div class="arrow">
<button (click)="back()" class="btn-no-color" >
<ion-icon slot="icon-only" src="assets/images/icons-calendar-arrow-left.svg"></ion-icon>
</button>
</div>
<!-- Move forward one screen of the slides -->
<h2 class="capitaliseText">{{ viewTitle }}</h2>
<!-- <div class="drop-down">
@@ -42,14 +47,14 @@
<div (click)="next()" class="arrow">
<ion-icon slot="icon-only" src="assets/images/icons-calendar-arrow-right.svg"></ion-icon>
</div>
</ion-row>
<ion-row class="ion-align-items-center">
<button *ngIf="profile == 'mdgpr' " (click)="changeProfile()" class="d-md-none btn-no-color">
<ion-icon class="right-icons" src="assets/images/icons-profile-calendar-md.svg"></ion-icon>
</button>
<button *ngIf="profile == 'pr' " (click)="changeProfile()" class="btn-no-color">
<ion-icon class="right-icons d-md-none" src="assets/images/icons-profile-calendar-pr.svg"></ion-icon>
</button>
@@ -57,14 +62,14 @@
<button class="btn-no-color" (click)="viewEventsToApprove()" *ngIf="loggeduser.Profile == 'MDGPR'">
<ion-icon class="right-icons" src="assets/images/icons-received-event.svg"></ion-icon>
</button>
<button class="btn-no-color cy-add-event" (click)="clearContact();openAddEvent();">
<ion-icon class="right-icons" src="assets/images/icons-add-new-event.svg" ></ion-icon>
</button>
</ion-row>
</ion-row>
</ion-row>
</ion-row>
<table class="custom-calendar-header">
<thead>
<th>S</th>
@@ -76,8 +81,8 @@
<th>D</th>
</thead>
</table>
<calendar
<calendar
class="calendar-component"
[eventSource]="eventSource"
[calendarMode]="calendar.mode"
@@ -96,27 +101,27 @@
[monthviewDisplayEventTemplate]="template"
>
</calendar>
<!-- Adding a customized ng-template -->
<ng-template #template let-view="view" let-row="row" let-col="col">
<div class="day-container">
<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">
<div class="number"> {{ view.dates[row*7+col].label }}</div>
</div>
</div>
</div>
</div>
</ng-template>
</div>
</div>
<div class="calendar-border">
</div>
<!-- Calendar currente date -->
<ion-row class="timeline-header pb-0 ion-justify-content-between ion-align-items-center currente-date-timelien">
<ion-row class="timeline-date align-center">
@@ -126,8 +131,8 @@
<button class="btn-no-color" *ngIf="!showCalendar" (click)="calendarHeight='317px';showCalendar=true">
<ion-icon class="collaps btn-no-color" src="assets/images/icons-collaps-down.svg" ></ion-icon>
</button >
</ion-row>
<ion-row class="timeline-date align-center">
<span *ngIf="timelineIsCurrentDate()">Hoje, &nbsp;</span> {{ timelineDate }}
@@ -138,17 +143,17 @@
<button (click)="showTimelineFilterState=!showTimelineFilterState" class="arrow-down btn-no-color">
<ion-icon src="assets/images/icons-arrow-arrow-down.svg"></ion-icon>
</button>
<!-- List -->
<ul *ngIf="showTimelineFilterState">
<li [class.active]="segment == 'Combinado' " (click)="changeSegment('Combinado')">Todos</li>
<li [class.active]="segment == 'Oficial' " (click)="changeSegment('Oficial')">Oficial</li>
<li [class.active]="segment == 'Pessoal' " (click)="changeSegment('Pessoal')">Pessoal</li>
</ul>
</ion-row>
</ion-row>
<div class="d-none d-md-flex" *ngIf="loggeduser.Profile == 'MDGPR'">
<div class="flex-grow-1 text-grey d-flex justify-center align-center">
<div>Própria</div>
@@ -165,11 +170,6 @@
</div>
<div class="timeline-wrapper flex-grow-1 height-100" >
<!-- Progress bar -->
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<!-- Timeline -->
<div class="height-100">
@@ -177,15 +177,15 @@
<div class="ss-timeline timeline-mobile flex-grow-1 d-md-none text-black height-100 width-100 overflow-y-auto" >
<div *ngFor="let events of TimelineMDList | keyvalue;" >
<div class="EventListBox-container" *ngIf="CalendarCurrentDay <= events.key">
<div class="day mt-10" *ngIf="shoeEventDay(events.value)">
{{ TimelineDayEvent(events.key)}}
</div>
<div *ngFor="let event of events.value" class="EventListBox" >
<div class="d-flex content-{{event.profile}}-{{event.event.CalendarName}} mt-10 cursor-pointer width-100 " (click)="eventClicked(event)"
<div class="d-flex content-{{event.profile}}-{{event.event.CalendarName}} mt-10 cursor-pointer width-100 " (click)="eventClicked(event)"
*ngIf="viewEventMonth <= dateMonth(event) && showEventBox(event)">
<div class="schedule-time" *ngIf="!event.event.IsAllDayEvent">
@@ -208,11 +208,11 @@
{{ event.event.CalendarName }}
<div class="location">{{event.event.Location}}</div>
<div class="description">
<p>{{event.event.Subject}}</p>
<p>{{event.event.Subject}}</p>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -220,16 +220,16 @@
<div class="fs-timeline flex-grow-1 d-none d-md-block d-md-block text-black pr-20 width-100 height-100 overflow-y-auto" *ngIf="loggeduser.Profile == 'MDGPR'">
<div *ngFor="let events of TimelineMDList | keyvalue;" >
<div class="EventListBox-container" *ngIf="CalendarCurrentDay <= events.key">
<div class="day EventListBox-day mt-10" *ngIf="shoeEventDay(events.value)">
{{ TimelineDayEvent(events.key)}}
</div>
<div *ngFor="let event of events.value" class="EventListBox" >
<div class="d-flex content-mdgpr-{{event.event.CalendarName}} mt-10 cursor-pointer" (click)="eventClicked(event)"
*ngIf="viewEventMonth <= dateMonth(event) && showEventBox(event)">
<div class="schedule-time" *ngIf="!event.event.IsAllDayEvent">
<div *ngIf="!event.endMany && !event.middle" class="time-start">{{event.event.StartDate | date: 'HH:mm'}}</div>
<div *ngIf="event.endMany && !event.middle" class="time-start">--</div>
@@ -248,7 +248,7 @@
<div class="schedule-details">
<div class="location">{{event.event.Location}}</div>
<div class="description">
<p>{{event.event.Subject}}</p>
<p>{{event.event.Subject}}</p>
</div>
</div>
</div>
@@ -260,9 +260,9 @@
<div class="sd-timeline flex-grow-1 d-none d-md-block timeline-md text-black pl-20 pr-20 width-100 height-100 overflow-y-auto" >
<div *ngFor="let events of TimelinePRList | keyvalue;">
<div class="EventListBox-container" *ngIf="CalendarCurrentDay <= events.key">
<div class="day mt-10" *ngIf="shoeEventDay(events.value)">
{{ TimelineDayEvent(events.key)}}
</div>
@@ -271,7 +271,7 @@
<div class="d-flex content-pr-{{event.event.CalendarName}} mt-10 cursor-pointer" (click)="eventClicked(event)"
*ngIf="viewEventMonth <= dateMonth(event) && showEventBox(event) ">
<div class="schedule-time" *ngIf="!event.event.IsAllDayEvent">
<div *ngIf="!event.endMany && !event.middle" class="time-start">{{event.event.StartDate | date: 'HH:mm'}}</div>
<div *ngIf="event.endMany && !event.middle" class="time-start">--</div>
@@ -281,7 +281,7 @@
<div *ngIf="event.middle" class="time-start"> Todo </div>
<div *ngIf="event.middle" class="time-end text-center"> o dia </div>
</div>
<div class="schedule-time" *ngIf="event.event.IsAllDayEvent">
<div class="time-start">Todo</div>
@@ -289,8 +289,8 @@
</div>
<div class="schedule-details">
<div class="location">{{event.event.Location}}</div>
<div class="description">
<p>{{event.event.Subject}}</p>
<div class="description">
<p>{{event.event.Subject}}</p>
</div>
</div>
</div>
@@ -323,7 +323,7 @@
class="text-black nothing-to-show">
Nenhum evento selecionado
</div>
<!-- New -->
<app-new-event *ngIf="mobileComponent.showAddNewEvent"
[profile]="profile"
@@ -367,9 +367,9 @@
[eventAttendees]="contacts"
></app-view-event>
<app-event-list
[class.transparent]="mobileComponent.transparentEventList"
<app-event-list
[class.transparent]="mobileComponent.transparentEventList"
*ngIf="mobileComponent.showEventList"
[profile]="profile"
(approveEventDismiss) = "approveEventDismiss($event)"
@@ -378,8 +378,8 @@
</app-event-list>
<!-- Edit event to approve -->
<app-approve-event class="d-flex flex-column"
*ngIf="mobileComponent.showEventToApprove"
<app-approve-event class="d-flex flex-column"
*ngIf="mobileComponent.showEventToApprove"
[class.transparent]="mobileComponent.transparentEventToApprove"
[serialNumber] = "eventToaprove.serialNumber"
[InstanceId] = "eventToaprove.InstanceId"
@@ -407,7 +407,7 @@
(setIntervenient)="setIntervenient($event)"
(setIntervenientCC)="setIntervenientCC($event)"
></app-edit-event-to-approve>
<app-attendee-modal
[footer]="true"
class="d-flex flex-column height-100"
@@ -425,5 +425,5 @@
</div>
</div>
</ion-content>
</ion-content>
src/app/pages/agenda/agenda.page.scss
+13 -13
View File
@@ -6,13 +6,13 @@
border-radius: 5px;
display: table-cell;
}
:host ::ng-deep {
.monthview-primary-with-event {
/* background-color: white !important; */
}
.monthview-current{
/* background-color: red; */
border-bottom: 1px solid lightskyblue !important;
@@ -30,7 +30,7 @@
margin-left: 1px solid red;
}
}
.main-header{
width: 100%; /* 400px */
@@ -43,7 +43,7 @@
padding: 15px 5px 0px 5px;
color:#000;
transform: translate3d(0, 1px, 0);
.title-content{
width: 360px;
margin: 0px auto;
@@ -129,7 +129,7 @@ input:checked + .slider:before {
{
display: none;
text-align: left !important;
left: 25px !important;
left: 25px !important;
color: white;
}
.mdgpr
@@ -163,7 +163,7 @@ input:checked + .slider .mdgpr
/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
@@ -293,7 +293,7 @@ td.monthview-primary-with-event {
}
.segment {
}
/* Timeline */
@@ -313,7 +313,7 @@ td.monthview-primary-with-event {
.arrow-down{
font-size: 28px;
}
}
@@ -471,7 +471,7 @@ td.monthview-primary-with-event {
padding: 0px 10px !important;
}
.schedule-time{
margin-right: 10px;
min-width: 33px;
@@ -504,7 +504,7 @@ td.monthview-primary-with-event {
font-family: Roboto;
font-size: 13px;
color: black;
}
.description{
width: 100%;
@@ -568,7 +568,7 @@ td.monthview-primary-with-event {
border-right: 5px solid #f05d5e;
overflow: auto;
}
}
.calendar-timeline{
@@ -612,7 +612,7 @@ td.monthview-primary-with-event {
.timeline-wrapper{
width: 100%;
overflow: auto;
// overflow-x: hidden;
// overflow-x: hidden;
}
}
}
@@ -632,7 +632,7 @@ td.monthview-primary-with-event {
@media only screen and (min-width: 1024px) {
.container-wrapper{
height: 100%;
.calendar-timeline{
border-top-right-radius: 0px;
width: calc(100% - 40%);