peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-21 05:45:50 +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%);
src/app/shared/agenda/event-list/event-list.page.ts
+1 -1
View File
@@ -44,7 +44,7 @@ export class EventListPage implements OnInit {
this.segment = this.loggeduser.Profile;
this.LoadToApproveEvents();
//this.LoadToApproveEvents();
const pathname = window.location.pathname
src/global.scss
+27 -27
View File
@@ -62,7 +62,7 @@ td.monthview-current{
td.monthview-selected {
background-color: lightskyblue !important;
color: white !important;
}
}
td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-dwf-c153] {
background-color: white !important;
@@ -86,7 +86,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.cal-hour-segment {
border-bottom: none !important;
}
.cal-current-time-marker {
background-color: #42b9fe !important;
}
@@ -216,7 +216,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
font-size: 36px
}
/* angular-cli file: src/styles.css */
@import "../node_modules/angular-calendar/css/angular-calendar.css";
@import "./style/main.scss";
@@ -266,7 +266,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
height: unset !important;
}
}
.modal-desktop{
.modal-wrapper{
@@ -275,7 +275,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
}
}
@media screen and (min-width: 1200px) {
@media screen and (min-width: 1200px) {
.hide-desktop{
display: none !important;
}
@@ -306,7 +306,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
width: 100%;
border-right: 1px solid #d8d8d8;
}
.aside-right{
display: none;
}
@@ -332,7 +332,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
width: 65%;
border-right: 1px solid #d8d8d8;
}
.aside-right{
width: 35%;
}
@@ -353,7 +353,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
width: 75%;
border-right: 1px solid #d8d8d8;
}
.aside-right{
width: 25%;
}
@@ -524,7 +524,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
}
}
.search-submodal{
background-color: rgb(0 0 0 / 55%);
}
@@ -572,7 +572,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.cal-current-time-marker::before {
display: none !important;
}
.timeline-box{
left: -13%;
position: relative;
@@ -589,7 +589,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.calendar-component .monthview-container table.table {
td {
width: 50px;
height: 40px;
@@ -621,8 +621,8 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
-moz-border-radius: 3px !important;
-ms-border-radius: 3px !important;
-o-border-radius: 3px !important;
}
}
.attendee-search-bar .searchbar-input {
border: 1px solid #cecece !important;
box-shadow: none !important;
@@ -654,8 +654,8 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
// center
app-diploma-assinar ion-content .main-content,
app-approve-event ion-content .main-content,
app-diploma-assinar ion-content .main-content,
app-approve-event ion-content .main-content,
app-view-event ion-content .main-content,
app-expediente-pr .main-content{
max-width: 1366px !important;
@@ -762,7 +762,7 @@ ion-content {
right: 0 !important;
top: calc(100% - 160px) !important;
max-height: 160px;
min-height: 160px;
min-height: 160px;
}
@@ -783,11 +783,11 @@ ion-icon{
width: 500px;
height: fit-content;
height: 300px;
}
}
}
@media only screen and (max-width: 500px) {
@media only screen and (max-width: 500px) {
::-webkit-scrollbar {
width: 5px !important;
@@ -800,7 +800,7 @@ ion-icon{
width: 7px;
height: 7px;
}
/* Track */
::-webkit-scrollbar-track {
background: #f1f1f1;
@@ -831,7 +831,7 @@ background: rgb(92, 92, 92);
.hide-scroll::-webkit-scrollbar {
display: none !important;
}
/* Track */
.hide-scroll::-webkit-scrollbar-track {
display: none !important;
@@ -964,15 +964,15 @@ background: rgb(92, 92, 92);
.date-hour-picker {
margin-top: -6px;
label#mat-form-field-label-7 {
display: none;
}
.span.ng-tns-c193-4, .ng-star-inserted {
// display: none;
}
.ng-star-inserted{
// display: none;
position: absolute;
@@ -988,7 +988,7 @@ background: rgb(92, 92, 92);
width: 100%;
height: 100%;
}
.mat-datepicker-toggle, mat-datepicker-toggle {
width: 100%;
}
@@ -1027,7 +1027,7 @@ ngx-mat-datetime-content{
.mat-button-disabled {
background-color: #ff5a5a59 !important;
}
}
}
}
@@ -1053,7 +1053,7 @@ ngx-mat-datetime-content{
}
}
@media only screen and (min-width: 665px) {
@media only screen and (min-width: 665px) {
.loading-blocker {
.loading-blocker-container {
@@ -1072,7 +1072,7 @@ ngx-mat-datetime-content{
border-bottom: 3px solid transparent !important;
}
}
.calendar-segment-pr {
.calendar-mdgpr-event-type-Pessoal {
border-top: 3px solid transparent !important;