Merge branch 'feature/calendar' into feature/chat

This commit is contained in:
tiago.kayaya
2021-03-25 10:10:12 +01:00
24 changed files with 539 additions and 322 deletions
+58 -28
View File
@@ -6,7 +6,7 @@
<div class="d-flex bg-blue container-wrapper"> <div class="d-flex bg-blue container-wrapper">
<div class="calendar-timeline bg-blue"> <div class="calendar-timeline d-flex flex-column height-100 bg-blue">
<div class="calendar-wrapper"> <div class="calendar-wrapper">
<div class="main-content"> <div class="main-content">
@@ -42,8 +42,8 @@
</ion-row> </ion-row>
<ion-row class="ion-align-items-center"> <ion-row class="ion-align-items-center">
<ion-icon *ngIf="profile == 'mdgpr' " (click)="changeProfile()" class="right-icons" src="assets/images/icons-profile-calendar-md.svg"></ion-icon> <ion-icon *ngIf="profile == 'mdgpr' " (click)="changeProfile()" class="right-icons d-md-none" src="assets/images/icons-profile-calendar-md.svg"></ion-icon>
<ion-icon *ngIf="profile == 'pr' " (click)="changeProfile()" class="right-icons" src="assets/images/icons-profile-calendar-pr.svg"></ion-icon> <ion-icon *ngIf="profile == 'pr' " (click)="changeProfile()" class="right-icons d-md-none" src="assets/images/icons-profile-calendar-pr.svg"></ion-icon>
<ion-icon (click)="viewEventsToApprove()" class="right-icons" src="assets/images/icons-received-event.svg"></ion-icon> <ion-icon (click)="viewEventsToApprove()" class="right-icons" src="assets/images/icons-received-event.svg"></ion-icon>
<ion-icon (click)="openAddEvent()" class="right-icons" src="assets/images/icons-add-new-event.svg" ></ion-icon> <ion-icon (click)="openAddEvent()" class="right-icons" src="assets/images/icons-add-new-event.svg" ></ion-icon>
</ion-row> </ion-row>
@@ -83,11 +83,12 @@
<!-- Adding a customized ng-template --> <!-- Adding a customized ng-template -->
<ng-template #template let-view="view" let-row="row" let-col="col"> <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"> <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">
{{ view.dates[row*7+col].label }}
<div class="indicator-container"> <div class="day">
<!-- <div class="event-indicator" *ngFor="let e of view.dates[row*7+col].events"></div> --> {{ view.dates[row*7+col].label }}
</div> </div>
</div> </div>
</ng-template> </ng-template>
</div> </div>
@@ -230,10 +231,10 @@
<!-- Calendar currente date --> <!-- Calendar currente date -->
<ion-row class="timeline-header ion-justify-content-between ion-align-items-center currente-date-timelien"> <ion-row class="timeline-header ion-justify-content-between ion-align-items-center currente-date-timelien pb-5">
<ion-row class="timeline-date align-center"> <ion-row class="timeline-date align-center">
<ion-icon *ngIf="showCalendar" (click)="calendarHeight='75px';showCalendar=false" class="collaps" src="assets/images/icons-collaps-up.svg" ></ion-icon> <ion-icon *ngIf="showCalendar" (click)="calendarHeight='75px';showCalendar=false" class="collaps" src="assets/images/icons-collaps-up.svg" ></ion-icon>
<ion-icon *ngIf="!showCalendar" (click)="calendarHeight='430.5px';showCalendar=true" class="collaps" src="assets/images/icons-collaps-down.svg" ></ion-icon> <ion-icon *ngIf="!showCalendar" (click)="calendarHeight='333px';showCalendar=true" class="collaps" src="assets/images/icons-collaps-down.svg" ></ion-icon>
</ion-row> </ion-row>
<ion-row class="timeline-date align-center"> <ion-row class="timeline-date align-center">
<span *ngIf="timelineIsCurrentDate()">Hoje, &nbsp;</span> {{ timelineDate }} <span *ngIf="timelineIsCurrentDate()">Hoje, &nbsp;</span> {{ timelineDate }}
@@ -250,11 +251,23 @@
</ul> </ul>
</ion-row> </ion-row>
</ion-row> </ion-row>
<div class="pb-5 d-none d-md-flex">
<div class="flex-grow-1 text-grey d-flex justify-center align-center">
<div>Prória</div>
</div>
<div class="flex-grow-1 text-black">
<div class="flex-grow-1 text-grey d-flex justify-center align-center">
<div>Presidente da Republica</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="timeline-wrapper" [style.height]="sanitizer.bypassSecurityTrustStyle('calc(100% - ('+calendarHeight+' + 84.5px))')" > <div class="timeline-wrapper flex-grow-1" >
<!-- Progress bar --> <!-- Progress bar -->
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)"> <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content> <ion-refresher-content>
@@ -262,24 +275,44 @@
</ion-refresher> </ion-refresher>
<!-- Timeline --> <!-- Timeline -->
<div class="timeline-container" *ngIf="showTimeline"> <div>
<mwl-demo-utils-calendar-header class="timeline" <div class="timeline-container d-flex" >
[(view)]="view"
[(viewDate)]="viewDate" <div [ngSwitch]="view" class="fs-timeline timeline-mobile flex-grow-1 d-md-none" *ngIf="showTimeline">
[dayStartHour]="0" <mwl-calendar-day-view
[dayEndHour]="23"> *ngSwitchCase="'day'"
</mwl-demo-utils-calendar-header> [viewDate]="viewDate"
[events]="events"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div>
<div [ngSwitch]="view" class="fs-timeline flex-grow-1 d-none d-md-block"
*ngIf="showTimelineMD">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="TimelineMD"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div>
<div [ngSwitch]="view" class="sd-timeline flex-grow-1 d-none d-md-block timeline-md"
*ngIf="showTimelinePR">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="TimelinePR"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div>
<div [ngSwitch]="view">
<mwl-calendar-day-view
*ngSwitchCase="'day'"
[viewDate]="viewDate"
[events]="events"
(eventClicked)="eventClicked($event)"
>
</mwl-calendar-day-view>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@@ -299,7 +332,6 @@
<!-- New --> <!-- New -->
<app-new-event *ngIf="mobileComponent.showAddNewEvent" <app-new-event *ngIf="mobileComponent.showAddNewEvent"
[profile]="profile" [profile]="profile"
[selectedSegment]=segment [selectedSegment]=segment
[selectedDate]="eventSelectedDate" [selectedDate]="eventSelectedDate"
@@ -308,7 +340,6 @@
></app-new-event> ></app-new-event>
<!-- Edit --> <!-- Edit -->
<app-edit-event *ngIf="mobileComponent.showEditEvent" <app-edit-event *ngIf="mobileComponent.showEditEvent"
[profile]="profile" [profile]="profile"
[selectedSegment]="segment" [selectedSegment]="segment"
[postEvent]="postEvent" [postEvent]="postEvent"
@@ -320,7 +351,6 @@
<app-view-event *ngIf="mobileComponent.showEventDitails" <app-view-event *ngIf="mobileComponent.showEventDitails"
[profile]="profile" [profile]="profile"
[eventId]="selectedEventId" [eventId]="selectedEventId"
(viewEventDetailDismiss)="viewEventDetailDismiss($event)" (viewEventDetailDismiss)="viewEventDetailDismiss($event)"
></app-view-event> ></app-view-event>
+6 -2
View File
@@ -501,7 +501,6 @@ td.monthview-primary-with-event {
.container-wrapper{ .container-wrapper{
height: 100%; height: 100%;
.calendar-timeline{ .calendar-timeline{
flex-wrap: wrap;
border-top-right-radius: 24px; border-top-right-radius: 24px;
width: calc(100%); width: calc(100%);
@@ -535,10 +534,14 @@ td.monthview-primary-with-event {
height: 100%; height: 100%;
.calendar-timeline{ .calendar-timeline{
flex-wrap: wrap;
border-top-right-radius: 0px; border-top-right-radius: 0px;
width: calc(100% - 40%); width: calc(100% - 40%);
border-right: 1px solid #d8d8d8; border-right: 1px solid #d8d8d8;
display: flex;
flex-direction: column;
height: 100%;
flex-wrap: unset;
} }
} }
.event-details{ .event-details{
@@ -601,3 +604,4 @@ app-approve-event{
align-items: center; align-items: center;
height: 100%; height: 100%;
} }
+273 -172
View File
@@ -58,10 +58,16 @@ export class AgendaPage implements OnInit {
// for timeline // for timeline
events: CalendarEvent[] = []; events: CalendarEvent[] = [];
TimelinePR: CalendarEvent[] = [];
TimelineMD: CalendarEvent[] = [];
showTimelinePR = false;
showTimelineMD = false;
// timeline filter // timeline filter
timelineFilterState: string = 'Todos'; timelineFilterState: string = 'Todos';
showTimelineFilterState: boolean; showTimelineFilterState: boolean;
showTimeline: boolean; showTimeline=true;
/* List of events of our calendar */ /* List of events of our calendar */
eventSource = []; eventSource = [];
@@ -127,7 +133,7 @@ export class AgendaPage implements OnInit {
private sanitizer: DomSanitizer private sanitizer: DomSanitizer
) { ) {
this.calendarHeight = "347px"; this.calendarHeight = "333px";
this.showCalendar = true; this.showCalendar = true;
this.timelineDate = momentG(new Date(),'dd MMMM yyyy'); this.timelineDate = momentG(new Date(),'dd MMMM yyyy');
@@ -135,7 +141,7 @@ export class AgendaPage implements OnInit {
this.showTimelineFilterState = false; this.showTimelineFilterState = false;
this.showTimeline = false; this.showTimeline = false;
} }
ngOnInit() { ngOnInit() {
this.profile = "mdgpr"; this.profile = "mdgpr";
@@ -276,25 +282,25 @@ export class AgendaPage implements OnInit {
currentDayEventDisplayBorder(day: any, id: any){ currentDayEventDisplayBorder(day: any, id: any){
const events = day[id].events; const events = day[id].events;
if (events.length == 0) { if (events.length == 0) {
return ""; return "";
} else if (events.length >= 1) { } else if (events.length >= 1) {
/** @description store all event type */ let classs = [];
let eventType = {};
let eventTypeNum: number;
events.forEach(element => { 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 return classs.join(' ');
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 ""; return "";
@@ -326,7 +332,7 @@ export class AgendaPage implements OnInit {
} }
// for timeline // for timeline
timeLineTemplate(startTime: string, eventlocation: string, eventDiscription: any, calendarName: string, subject: string, startTimeWisthS: string, endTime: string, eventIndex: number): string{ timeLineTemplate(startTime: string, eventlocation: string, eventDiscription: any, calendarName: string, subject: string, startTimeWisthS: string, endTime: string, eventIndex: number, profile: string): string{
const startHours = parseInt(startTimeWisthS.split(':')[0]); const startHours = parseInt(startTimeWisthS.split(':')[0]);
const startMinutos = parseInt(startTimeWisthS.split(':')[1]); const startMinutos = parseInt(startTimeWisthS.split(':')[1]);
@@ -342,8 +348,13 @@ export class AgendaPage implements OnInit {
} }
} }
console.log(profile);
const profile_ = profile == 'md'? 'mdgpr': 'pr';
return ` return `
<div class="timeline-box timeline-box-event-${eventIndex} timeline-${this.profile}-box-${calendarName} calendar-top${top}"> <div class="timeline-box timeline-box-event-${eventIndex} timeline-${profile_}-box-${calendarName} calendar-top${top}">
<div> <div>
<span class="timeline-start-time">${startTimeWisthS}</span><span class="timeline-location">${eventlocation}</span> <span class="timeline-start-time">${startTimeWisthS}</span><span class="timeline-location">${eventlocation}</span>
</div> </div>
@@ -366,7 +377,26 @@ export class AgendaPage implements OnInit {
var minutes = ((endEvent.getTime() - startEvent.getTime()) / 1000) / 60; var minutes = ((endEvent.getTime() - startEvent.getTime()) / 1000) / 60;
const top = (startEvent.getTime() - (new Date(2020, 1, 3)).getTime()) /60; const top = (startEvent.getTime() - (new Date(2020, 1, 3)).getTime()) /60;
document.querySelectorAll('.timeline-box').forEach(ele => { document.querySelectorAll('.fs-timeline .timeline-box').forEach(ele => {
if(ele.className.indexOf(`timeline-box-event-${eventIndex}`)>=0){
ele.setAttribute('style',`height:${minutes}px`);
}
});
});
},timeout)
setTimeout(()=>{
this.TimelinePR.forEach((el, eventIndex)=>{
const startEvent = new Date(el['startTime']);
const endEvent = new Date(el['endTime']);
var minutes = ((endEvent.getTime() - startEvent.getTime()) / 1000) / 60;
const top = (startEvent.getTime() - (new Date(2020, 1, 3)).getTime()) /60;
document.querySelectorAll('.sd-timeline .timeline-box').forEach(ele => {
if(ele.className.indexOf(`timeline-box-event-${eventIndex}`)>=0){ if(ele.className.indexOf(`timeline-box-event-${eventIndex}`)>=0){
ele.setAttribute('style',`height:${minutes}px`); ele.setAttribute('style',`height:${minutes}px`);
@@ -379,14 +409,18 @@ export class AgendaPage implements OnInit {
// for timeline // for timeline
timelineFilter(calendarName){ timelineFilter(calendarName, eventsList, profile){
this.timelineFilterState = calendarName; this.timelineFilterState = calendarName;
// remove all event // remove all event
this.events = []; let events = [];
this.eventsList.forEach((element, eventIndex) => { console.log(eventsList);
this.showTimelineFilterState = false;
eventsList.forEach((element, eventIndex) => {
// timeline start // timeline start
const startHours = new Date(element.StartDate).getHours().toLocaleString(); const startHours = new Date(element.StartDate).getHours().toLocaleString();
@@ -395,202 +429,269 @@ export class AgendaPage implements OnInit {
const startHoursOtherFormate = new Date(element.StartDate).getHours().toLocaleString()+':'+new Date(element.StartDate).getMinutes().toLocaleString(); const startHoursOtherFormate = new Date(element.StartDate).getHours().toLocaleString()+':'+new Date(element.StartDate).getMinutes().toLocaleString();
const EndHoursOtherFormate = formatDate(new Date(element.EndDate), 'HH:mm', 'pt'); const EndHoursOtherFormate = formatDate(new Date(element.EndDate), 'HH:mm', 'pt');
if (element.CalendarName == calendarName) { events.push({
this.events.push({ title: this.timeLineTemplate(startHours, element.Location, element.Body, element.CalendarName, element.Subject,startHoursOtherFormate,EndHoursOtherFormate, eventIndex, profile),
title: this.timeLineTemplate(startHours, element.Location, element.Body, element.CalendarName, element.Subject,startHoursOtherFormate,EndHoursOtherFormate, eventIndex), start: setHours(setMinutes(new Date(element.StartDate), 0), parseInt(startHours)),
start: setHours(setMinutes(new Date(element.StartDate), 0), parseInt(startHours)), end: setHours(setMinutes(new Date(element.EndDate), 0), parseInt(EndHours)),
end: setHours(setMinutes(new Date(element.EndDate), 0), parseInt(EndHours)), color: {
color: { primary: 'white',
primary: 'white', secondary: 'white'
secondary: 'white' },
}, id: element.EventId,
id: element.EventId });
});
} else if (calendarName == 'Todos'){
this.events.push({
title: this.timeLineTemplate(startHours, element.Location, element.Body, element.CalendarName, element.Subject,startHoursOtherFormate,EndHoursOtherFormate, eventIndex),
start: setHours(setMinutes(new Date(element.StartDate), 0), parseInt(startHours)),
end: setHours(setMinutes(new Date(element.EndDate), 0), parseInt(EndHours)),
color: {
primary: 'white',
secondary: 'white'
},
id: element.EventId
});
}
}); });
this.onCurrentChanged(this.eventSelectedDate); this.onCurrentChanged(this.eventSelectedDate);
//
this.showTimelineFilterState = false; return events;
} }
loadRangeEvents(startTime: Date, endTime: Date){ loadRangeEvents(startTime: Date, endTime: Date){
this.showTimeline = false;
this.showLoader = true; this.showLoader = true;
switch (this.segment) if(window.innerWidth < 1024){
{
case "Combinada": this.showTimeline = false;
//Inicializa o array eventSource
this.eventSource=[]; switch (this.segment) {
case "Combinada":
//Inicializa o array eventSource
this.eventSource=[];
if(this.profile == "mdgpr"){ if(this.profile == "mdgpr"){
this.eventService.getAllMdEvents( momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59') ).subscribe( this.eventService.getAllMdEvents( momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59') ).subscribe(
response => { response => {
this.eventSource=[]; this.eventSource=[];
this.eventsList = response; this.eventsList = response;
// loop // loop
this.eventsList.forEach((element, eventIndex) => { this.eventsList.forEach((element, eventIndex) => {
this.eventSource.push({ this.eventSource.push({
title: element.Subject, title: element.Subject,
startTime: new Date(element.StartDate), startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate), endTime: new Date(element.EndDate),
allDay: false, allDay: false,
event: element, event: element,
calendarName: element.CalendarName calendarName: element.CalendarName,
}); profile: 'md'
}); });
this.timelineFilter(this.timelineFilterState);
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
this.showTimeline = true;
this.timelineBoxCorrectHeight(500);
this.centralizeTimeline(500);
});
}
else{
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(
response => {
this.eventSource=[];
this.eventsList = response;
this.eventsList.forEach((element, eventIndex) => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
calendarName: element.CalendarName
}); });
this.events = this.timelineFilter(this.timelineFilterState, this.eventsList, 'md');
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
this.showTimeline = true;
this.timelineBoxCorrectHeight(500);
this.centralizeTimeline(500);
}); });
this.timelineFilter(this.timelineFilterState); }
else{
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(
response => {
this.myCal.update(); this.eventSource=[];
this.myCal.loadEvents();
this.showLoader = false;
this.showTimeline = true;
this.timelineBoxCorrectHeight(500); this.eventsList = response;
this.centralizeTimeline(500); this.eventsList.forEach((element, eventIndex) => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
calendarName: element.CalendarName,
profile: 'pr'
});
}); });
}
break;
case "Pessoal": this.events = this.timelineFilter(this.timelineFilterState, this.eventsList, 'pr');
//Inicializa o array eventSource
this.eventSource=[];
if(this.profile == "mdgpr"){
this.eventService.getAllMdEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(response => {
this.eventSource=[]; this.myCal.update();
this.eventsListPessoal = response.filter(data => data.CalendarName == "Pessoal"); this.myCal.loadEvents();
this.eventsListPessoal.forEach(element => { this.showLoader = false;
this.showTimeline = true;
this.timelineBoxCorrectHeight(500);
this.centralizeTimeline(500);
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element
}); });
}); }
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
});
}
else{
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(response => {
this.eventSource=[];
this.eventsListPessoal = response.filter(data => data.CalendarName == "Pessoal");
this.eventsListPessoal.forEach(element => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element
});
});
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
});
}
break; break;
case "Oficial": case "Pessoal":
//Inicializa o array eventSource //Inicializa o array eventSource
this.eventSource=[]; this.eventSource=[];
if(this.profile == "mdgpr"){ if(this.profile == "mdgpr"){
this.eventService.getAllMdEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(res => { this.eventService.getAllMdEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(response => {
this.eventSource=[];
this.eventsListOficial = res.filter(data => data.CalendarName == "Oficial"); this.eventSource=[];
this.eventsListPessoal = response.filter(data => data.CalendarName == "Pessoal");
this.eventsListPessoal.forEach(element => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
profile: 'md'
});
});
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
});
}
else{
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(response => {
this.eventSource=[];
this.eventsListPessoal = response.filter(data => data.CalendarName == "Pessoal");
this.eventsListPessoal.forEach(element => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
profile: 'pr'
});
});
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
});
}
break;
case "Oficial":
//Inicializa o array eventSource
this.eventSource=[];
if(this.profile == "mdgpr"){
this.eventService.getAllMdEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(res => {
this.eventSource=[];
this.eventsListOficial = res.filter(data => data.CalendarName == "Oficial");
this.eventsListOficial.forEach(element => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
profile: 'md'
});
});
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
});
}else{
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(res => {
this.eventSource=[];
this.eventsListOficial = res.filter(data => data.CalendarName == "Oficial");
this.eventsListOficial.forEach(element => { this.eventsListOficial.forEach(element => {
this.eventSource.push({ this.eventSource.push({
title: element.Subject, title: element.Subject,
startTime: new Date(element.StartDate), startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate), endTime: new Date(element.EndDate),
allDay: false, allDay: false,
event: element event: element,
profile: 'pr'
}); });
}); });
this.myCal.update(); this.myCal.update();
this.myCal.loadEvents(); this.myCal.loadEvents();
this.showLoader = false; this.showLoader = false;
}); });
}else{ }
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(res => { break;
this.eventSource=[];
this.eventsListOficial = res.filter(data => data.CalendarName == "Oficial"); }
this.eventsListOficial.forEach(element => { } else {
this.eventSource.push({
title: element.Subject, this.showTimelinePR = false;
startTime: new Date(element.StartDate), this.showTimelineMD = false;
endTime: new Date(element.EndDate), this.eventSource=[];
allDay: false,
event: element this.eventService.getAllMdEvents( momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59') ).subscribe(
}); response => {
this.eventsList = response;
// loop
this.eventsList.forEach((element, eventIndex) => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
calendarName: element.CalendarName,
profile: 'md'
}); });
this.myCal.update();
this.myCal.loadEvents();
this.showLoader = false;
}); });
}
break;
this.TimelineMD = this.timelineFilter(this.timelineFilterState, this.eventsList, 'md');
this.events = this.timelineFilter(this.timelineFilterState, this.eventsList, 'md');
this.myCal.update();
this.myCal.loadEvents();
this.showTimelineMD = true;
this.timelineBoxCorrectHeight(500);
this.centralizeTimeline(500);
});
this.eventService.getAllPrEvents(momentG(new Date(startTime),'yyyy-MM-dd HH:mm:ss'), momentG(new Date(endTime),'yyyy-MM-dd 23:59:59')).subscribe(
response => {
this.eventsList = response;
this.eventsList.forEach((element, eventIndex) => {
this.eventSource.push({
title: element.Subject,
startTime: new Date(element.StartDate),
endTime: new Date(element.EndDate),
allDay: false,
event: element,
calendarName: element.CalendarName,
profile:'pr'
});
});
this.TimelinePR = this.timelineFilter(this.timelineFilterState, this.eventsList, 'pr');
console.log(this.TimelinePR);
this.myCal.update();
this.myCal.loadEvents();
this.showTimelinePR = true;
this.timelineBoxCorrectHeight(500);
this.centralizeTimeline(500);
this.showLoader = false;
});
} }
} }
actions(){ actions(){
-1
View File
@@ -55,7 +55,6 @@
</div> </div>
<div class="content"> <div class="content">
<!-- (click)="viewEventDetail(event.EventId)" -->
<ul> <ul>
<li *ngFor="let event of eventsList" <li *ngFor="let event of eventsList"
(click)="viewEventDetail(event.EventId)" (click)="viewEventDetail(event.EventId)"
@@ -54,7 +54,6 @@ export class NewPublicationPage implements OnInit {
private camera: Camera, private camera: Camera,
) { ) {
alert('!!!!!')
this.publicationType = this.navParams.get('publicationType'); this.publicationType = this.navParams.get('publicationType');
this.folderId = this.navParams.get('folderId'); this.folderId = this.navParams.get('folderId');
this.publicationTitle = 'Nova Publicação'; this.publicationTitle = 'Nova Publicação';
@@ -76,6 +76,7 @@
class="height-100 d-flex flex-column overflow-hidden flex-grow-1" class="height-100 d-flex flex-column overflow-hidden flex-grow-1"
(addNewPublication)="addNewPublication($event)" (addNewPublication)="addNewPublication($event)"
(openPublicationDetails)="openPublicationDetails($event)" (openPublicationDetails)="openPublicationDetails($event)"
(goBacktoPublicationDetails)="goBacktoPublicationDetails($event)"
(goBackToViewPublications)="goBackToViewPublications($event)" (goBackToViewPublications)="goBackToViewPublications($event)"
(closeDesktopComponent)="closeDesktopComponent($event)" (closeDesktopComponent)="closeDesktopComponent($event)"
> >
@@ -107,7 +107,8 @@ export class PublicationsPage implements OnInit {
async AddPublicationFolder(item:any) { async AddPublicationFolder(item:any) {
this.closeDesktopComponent(); this.closeDesktopComponent();
if(window.innerHeight >= 1024){ if(window.innerWidth <= 1024){
const modal = await this.modalController.create({ const modal = await this.modalController.create({
component: NewActionPage, component: NewActionPage,
componentProps:{ componentProps:{
@@ -179,31 +180,42 @@ export class PublicationsPage implements OnInit {
} }
} }
// called from view publications
// called from publications details
// Emittter
goBackToViewPublications(){ goBackToViewPublications(){
this.closeDesktopComponent(); this.closeDesktopComponent();
this.desktopComponent.showViewPublication = true; this.desktopComponent.showViewPublication = true;
} }
// called from publications details
// Emitters
goBackToPubications(){ goBackToPubications(){
this.closeDesktopComponent(); this.closeDesktopComponent();
this.desktopComponent.showViewPublication = true; this.desktopComponent.showViewPublication = true;
} }
// called from edit publication (Emitters only)
// Emitters
async goBacktoPublicationDetails(){ async goBacktoPublicationDetails(){
this.closeDesktopComponent(); this.closeDesktopComponent();
this.desktopComponent.showPublicationDetail = true; this.desktopComponent.showPublicationDetail = true;
} }
// add new publication or edit publicaton
async addNewPublication({publicationType, folderId, publication}){ async addNewPublication({publicationType, folderId, publication}){
this.closeDesktopComponent(); this.closeDesktopComponent();
// propr to add new publication // propr to add new publication
this.publicationType = publicationType; this.publicationType = publicationType;
this.folderId = folderId; // edit publication will send null
if (folderId != undefined) {
this.folderId = folderId;
}
this.publication = publication; this.publication = publication;
this.desktopComponent.showAddNewPublication = true; this.desktopComponent.showAddNewPublication = true;
@@ -1,9 +1,9 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border px-20">
<div class="header-content"> <div class="header-content d-flex justify-space-between">
<div class="header-icon-left"> <div class="header-icon-left">
<ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon> <ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
</div> </div>
<div class="header-title"> <div class="header-title flex-grow-1">
<label>{{loadedEvent.workflowInstanceDataFields.Subject}}</label> <label>{{loadedEvent.workflowInstanceDataFields.Subject}}</label>
</div> </div>
<div class="header-icon-right"> <div class="header-icon-right">
@@ -37,7 +37,7 @@
<ion-content id="main-content"> <ion-content id="main-content">
<div class="upper-content"> <div class="upper-content">
<div class="content-location"> <div class="content-location d-flex justify-space-between">
<div class="location-detail"> <div class="location-detail">
<ion-label >{{loadedEvent.workflowInstanceDataFields.Location}}</ion-label> <ion-label >{{loadedEvent.workflowInstanceDataFields.Location}}</ion-label>
</div> </div>
@@ -8,8 +8,6 @@ ion-content{
--height: 225px; --height: 225px;
} }
.header-content{ .header-content{
width: 360px;
overflow: auto;
margin: 25px auto; margin: 25px auto;
} }
.header-icon-left{ .header-icon-left{
@@ -19,7 +17,6 @@ ion-content{
float: left; float: left;
} }
.header-title{ .header-title{
width: 264px;
font-family: Roboto; font-family: Roboto;
font-size: 25px; font-size: 25px;
margin: 0 5px 0 5px; margin: 0 5px 0 5px;
@@ -31,18 +28,14 @@ ion-content{
width: 45px; width: 45px;
font-size: 45px; font-size: 45px;
float: left; float: left;
overflow: auto;
} }
.upper-content{ .upper-content{
margin-left: 50px; margin-left: 50px;
overflow: auto;
font-size: 18px; font-size: 18px;
.content-location{ .content-location{
width: 360px;
margin: 0 auto; margin: 0 auto;
padding: 0; padding: 0;
overflow: auto;
} }
.location-detail{ .location-detail{
@@ -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-content">
<div class="header-icon-left"> <div class="header-icon-left">
<ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon> <ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
@@ -59,7 +59,7 @@
<ion-list *ngSwitchCase="'PR'"> <ion-list *ngSwitchCase="'PR'">
<div *ngIf="eventsPRList"> <div *ngIf="eventsPRList">
<ion-item-sliding> <ion-item-sliding>
<ion-item class="Rectangle" lines="none" <ion-item class="Rectangle width-100" lines="none"
*ngFor="let event of eventsPRList" (click)="openApproveModal(event.serialNumber)"> *ngFor="let event of eventsPRList" (click)="openApproveModal(event.serialNumber)">
<div class="content-pr-{{event.workflowInstanceDataFields.Agenda}}"> <div class="content-pr-{{event.workflowInstanceDataFields.Agenda}}">
<div class="approve-event-time"> <div class="approve-event-time">
@@ -1,17 +1,15 @@
.header-content{ .header-content{
width: 360px;
overflow: auto; overflow: auto;
margin: 0 auto; margin: 0 auto;
padding-top: 25px; padding-top: 25px;
} }
.header-icon-left{ .header-icon-left{
width: 36px;
font-size: 33px; font-size: 33px;
color: #42b9fe; color: #42b9fe;
float: left; float: left;
} }
.header-title{ .header-title{
width: 300px;
font-family: Roboto; font-family: Roboto;
font-size: 25px; font-size: 25px;
margin: 0 5px 0 5px; margin: 0 5px 0 5px;
@@ -23,36 +21,30 @@
margin-top: 5px; margin-top: 5px;
} }
.Rectangle { .Rectangle {
width: 360px;
border-radius: 15px; border-radius: 15px;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
border: solid 1px #e9e9e9; border: solid 1px #e9e9e9;
background-color: var(--white); background-color: var(--white);
margin: 0 auto;
padding: 10px; padding: 10px;
margin-bottom: 10px; margin-bottom: 10px;
overflow: auto; overflow: auto;
} }
.content-mdgpr-Oficial{ .content-mdgpr-Oficial{
width: 340px;
border-radius: 5px; border-radius: 5px;
border-right: 5px solid #99e47b; border-right: 5px solid #99e47b;
overflow: auto; overflow: auto;
} }
.content-mdgpr-Pessoal{ .content-mdgpr-Pessoal{
width: 340px;
border-radius: 5px; border-radius: 5px;
border-right: 5px solid #958bfc; border-right: 5px solid #958bfc;
overflow: auto; overflow: auto;
} }
.content-pr-Oficial{ .content-pr-Oficial{
width: 340px;
border-radius: 5px; border-radius: 5px;
border-right: 5px solid #ffb703; border-right: 5px solid #ffb703;
overflow: auto; overflow: auto;
} }
.content-pr-Pessoal{ .content-pr-Pessoal{
width: 340px;
border-radius: 5px; border-radius: 5px;
border-right: 5px solid #f05d5e; border-right: 5px solid #f05d5e;
overflow: auto; overflow: auto;
@@ -79,7 +71,6 @@
margin-left: 10px; margin-left: 10px;
} }
.approve-event-detail p{ .approve-event-detail p{
width: 250px;
font-family: Roboto; font-family: Roboto;
font-size: 13px; font-size: 13px;
font-weight: normal; font-weight: normal;
@@ -92,7 +83,6 @@
padding: 0; padding: 0;
} }
.approve-event-detail h3{ .approve-event-detail h3{
width: 250px;
font-family: Roboto; font-family: Roboto;
font-size: 15px; font-size: 15px;
font-weight: bold; font-weight: bold;
@@ -16,11 +16,11 @@
<ion-input placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input> <ion-input placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input>
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-input placeholder="Localização" [(ngModel)]="postEvent.Location"></ion-input> <ion-input placeholder="Localização" [(ngModel)]="postEvent.Location"></ion-input>
</div> </div>
</div> </div>
@@ -32,11 +32,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-select placeholder="Selecione agenda" <ion-select placeholder="Selecione agenda"
selectedText="{{postEvent.CalendarName}}" selectedText="{{postEvent.CalendarName}}"
[(ngModel)]="postEvent.CalendarName" [(ngModel)]="postEvent.CalendarName"
@@ -50,11 +50,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-select placeholder="Selecione tipo" <ion-select placeholder="Selecione tipo"
[(ngModel)]="postEvent.Categories[0]" [(ngModel)]="postEvent.Categories[0]"
interface="action-sheet" interface="action-sheet"
@@ -69,11 +69,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-datetime <ion-datetime
placeholder="Início" placeholder="Início"
[(ngModel)]="postEvent.StartDate" [(ngModel)]="postEvent.StartDate"
@@ -90,11 +90,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-datetime <ion-datetime
placeholder="Fim" placeholder="Fim"
[(ngModel)]="postEvent.EndDate" [(ngModel)]="postEvent.EndDate"
@@ -111,11 +111,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-refresh.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-refresh.svg"></ion-icon>
</div> </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 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="false">Não se repete</ion-select-option>
<ion-select-option value="true">Repete</ion-select-option> <ion-select-option value="true">Repete</ion-select-option>
@@ -125,11 +125,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-person.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-person.svg"></ion-icon>
</div> </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"> <div class="list-people">
<ion-item lines="none"> <ion-item lines="none">
<ion-list> <ion-list>
@@ -146,11 +146,11 @@
</div> </div>
<div hidden class="container-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"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-people-cc.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-people-cc.svg"></ion-icon>
</div> </div>
<div class="ion-input-class-no-height"> <div class="ion-input-class flex-grow-1-no-height">
<div class="list-people"> <div class="list-people">
<ion-item lines="none"> <ion-item lines="none">
<ion-list> <ion-list>
@@ -167,11 +167,11 @@
</div> </div>
<div class="container-div"> <div class="container-div">
<div class="ion-item-class-2"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
</div> </div>
<div class="ion-input-class"> <div class="ion-input-class flex-grow-1">
<ion-input placeholder="Detalhes" [(ngModel)]="postEvent.Body.Text"></ion-input> <ion-input placeholder="Detalhes" [(ngModel)]="postEvent.Body.Text"></ion-input>
</div> </div>
</div> </div>
@@ -203,8 +203,8 @@
</div> </div>
</div> </div>
</ion-content> </ion-content>
<ion-footer class="ion-no-border d-flex justify-center"> <ion-footer class="ion-no-border px-20">
<ion-toolbar class="btn-div "> <ion-toolbar class="d-flex justify-space-between">
<ion-buttons slot="start"> <ion-buttons slot="start">
<ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()"> <ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
<ion-label>Cancelar</ion-label> <ion-label>Cancelar</ion-label>
@@ -18,7 +18,6 @@ ion-content{
transform: translate3d(0, 1px, 0); transform: translate3d(0, 1px, 0);
.title-content{ .title-content{
width: 360px;
margin: 0px auto; margin: 0px auto;
overflow: auto; overflow: auto;
padding: 0 !important; padding: 0 !important;
@@ -46,7 +45,6 @@ ion-content{
padding: 15px 20px 0 20px; padding: 15px 20px 0 20px;
.ion-item-container{ .ion-item-container{
width: 360px;
margin: 15px auto; margin: 15px auto;
border: 1px solid #ebebeb; border: 1px solid #ebebeb;
border-radius: 5px; border-radius: 5px;
@@ -63,7 +61,6 @@ ion-content{
overflow: auto; overflow: auto;
} }
.ion-item-class-2{ .ion-item-class-2{
width: 360px;
margin: 0px auto; margin: 0px auto;
} }
.ion-icon-class{ .ion-icon-class{
@@ -78,7 +75,6 @@ ion-content{
margin-left: 0; margin-left: 0;
} }
.ion-input-class{ .ion-input-class{
width: 315px;
height: 45px; height: 45px;
border: 1px solid #ebebeb; border: 1px solid #ebebeb;
border-radius: 5px; border-radius: 5px;
@@ -1,11 +1,11 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border">
<ion-toolbar class="header-toolbar"> <ion-toolbar class="header-toolbar">
<div class="main-header"> <div class="main-header px-20">
<div class="title-content"> <div class="title-content d-flex" >
<div class="left"> <div class="left">
<ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon> <ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
</div> </div>
<div class="middle"> <div class="middle flex-grow-1">
<ion-label class="title">{{loadedEvent.Subject}}</ion-label> <ion-label class="title">{{loadedEvent.Subject}}</ion-label>
</div> </div>
<div class="div-icon"> <div class="div-icon">
@@ -20,7 +20,7 @@
<ion-content> <ion-content>
<div class="main-content"> <div class="main-content">
<div class="upper-content"> <div class="upper-content">
<div class="content-location"> <div class="content-location d-flex justify-space-between ">
<div class="location-detail"> <div class="location-detail">
<ion-label >{{loadedEvent.Location}}</ion-label> <ion-label >{{loadedEvent.Location}}</ion-label>
</div> </div>
@@ -25,9 +25,7 @@ ion-menu{
transform: translate3d(0, 1px, 0); transform: translate3d(0, 1px, 0);
.title-content{ .title-content{
width: 360px;
margin: 0px auto; margin: 0px auto;
overflow: auto;
padding: 0 !important; padding: 0 !important;
background: #fff; background: #fff;
@@ -79,37 +77,31 @@ ion-menu{
font-family: Roboto; font-family: Roboto;
margin: 0 auto; margin: 0 auto;
background-color: #fff; background-color: #fff;
overflow:auto;
padding: 15px 0px 0 0px; padding: 15px 0px 0 0px;
.upper-content{ .upper-content{
margin-left: 50px; margin-left: 50px;
overflow: auto;
font-size: 18px; font-size: 18px;
.content-location{ .content-location{
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
padding: 0; padding: 0;
overflow: auto;
} }
.location-detail{ .location-detail{
width: 210px;
font-weight: 700; font-weight: 700;
font-size: 18px; font-size: 18px;
float: left; float: left;
margin: 5px 5px 5px 0px; margin: 5px 5px 5px 0px;
} }
.button-mdgpr-Oficial{ .button-mdgpr-Oficial{
width: 91px;
--border-radius: 20px; --border-radius: 20px;
--background: #ffb703; --background: #ffb703;
margin-left: 5px; margin-left: 5px;
float: left; float: left;
} }
.button-mdgpr-Pessoal{ .button-mdgpr-Pessoal{
width: 91px;
--border-radius: 20px; --border-radius: 20px;
--background: #f05d5e; --background: #f05d5e;
margin-left: 5px; margin-left: 5px;
@@ -153,7 +145,6 @@ ion-menu{
} }
.bottom-content{ .bottom-content{
width: 360px;
margin: 0 auto; margin: 0 auto;
.bottom-content h3{ .bottom-content h3{
@@ -55,6 +55,12 @@ export class ViewEventPage implements OnInit {
this.getAttachments(); this.getAttachments();
} }
ngOnChanges(changes: any): void {
this.loadEvent();
this.getAttachments();
}
close(){ close(){
console.log(this.isEventEdited); console.log(this.isEventEdited);
@@ -1,8 +1,8 @@
<ion-header class="ion-no-border background-white px-20 pt-25"> <ion-header class="ion-no-border background-white px-20 pt-25">
<div class="title-content d-flex"> <div class="title-content d-flex">
<div class="back-icon"> <!-- <div class="back-icon">
<ion-icon class="font-35" (click)="goBack()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon> <ion-icon class="font-35" (click)="goBack()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
</div> </div> -->
<div class="div-title"> <div class="div-title">
<ion-label class="title">{{publicationTitle}}</ion-label> <ion-label class="title">{{publicationTitle}}</ion-label>
</div> </div>
@@ -16,7 +16,9 @@
<ion-input [(ngModel)]="pub.Title" name="title" ngDefaultControl placeholder="Título" ></ion-input> <ion-input [(ngModel)]="pub.Title" name="title" ngDefaultControl placeholder="Título" ></ion-input>
</div> </div>
<div *ngIf="publicationType!='1'" class="container-div">
<div *ngIf="publicationType!='1'" class="container-div pb-20">
<div class="ion-item-class-2 d-flex"> <div class="ion-item-class-2 d-flex">
<div class="ion-icon-class"> <div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon> <ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
@@ -26,6 +28,23 @@
</div> </div>
</div> </div>
</div> </div>
<div class="container-title py-10">Fotografia Anexada</div>
<div class="picture d-flex pb-5" *ngIf="publication.FileBase64.length > 10">
<div class="post-img">
<img src="{{publication.FileBase64}}" alt="image" >
</div>
<div class="d-flex flex-column pl-10">
<div class="picture-file-name">{{publication.OriginalFileName}}.{{publication.FileExtension}}</div>
<div class="size">75 Kb</div>
</div>
<div class="flex-grow-1 d-flex align-center justify-end">
<div style="color: red;">X</div>
</div>
</div>
<div *ngIf="capturedImage != ''" class="ion-item-container-no-border"> <div *ngIf="capturedImage != ''" class="ion-item-container-no-border">
<ion-label class="attached-title">Fotografia Anexada</ion-label> <ion-label class="attached-title">Fotografia Anexada</ion-label>
<ion-item lines="none"> <ion-item lines="none">
@@ -73,6 +73,7 @@ font-size: 25px;
.container-div{ .container-div{
margin-bottom: 15px; margin-bottom: 15px;
overflow: auto; overflow: auto;
border-bottom: 1px solid #ebebeb;
} }
.ion-item-container{ .ion-item-container{
margin: 15px auto; margin: 15px auto;
@@ -132,3 +133,23 @@ font-size: 25px;
letter-spacing: normal; letter-spacing: normal;
color: #000; color: #000;
} }
.picture{
.post-img{
width: 60px;
}
.picture-file-name{
font-size: 15px;
color: #0d89d1;
}
.size{
color: #cecece;
font-size: 13px;
}
}
.container-title{
font-size: 15px;
font-weight: bold;
}
@@ -39,8 +39,9 @@ export class NewPublicationPage implements OnInit {
@Input() publicationType: string; @Input() publicationType: string;
@Input() folderId: string; @Input() folderId: string;
@Output() closeDesktopComponent = new EventEmitter<any>(); @Output() closeDesktopComponent = new EventEmitter<any>();
@Output() goBacktoPublicationDetails = new EventEmitter(); @Output() openPublicationDetails = new EventEmitter<any>();
@Output() goBackToViewPublications = new EventEmitter<any>();
@Output() goBacktoPublicationDetails = new EventEmitter<any>();
guestPicture:any; guestPicture:any;
@@ -121,7 +122,7 @@ export class NewPublicationPage implements OnInit {
console.log('Edit change image'); console.log('Edit change image');
console.log(this.publication); console.log(this.publication);
this.publications.UpdatePublication(this.publication.ProcessId, this.publication); this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
this.closeDesktopComponent.emit(); this.goBack();
} }
else{ else{
this.publication = { this.publication = {
@@ -138,7 +139,7 @@ export class NewPublicationPage implements OnInit {
console.log('Edit - keep image'); console.log('Edit - keep image');
console.log(this.publication); console.log(this.publication);
this.publications.UpdatePublication(this.publication.ProcessId, this.publication); this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
this.closeDesktopComponent.emit(); this.goBack();
} }
} }
else{ else{
@@ -164,7 +165,7 @@ export class NewPublicationPage implements OnInit {
close(){ close(){
this.closeDesktopComponent.emit('!???____!!'); this.goBack();
} }
clear(){ clear(){
this.capturedImage = ''; this.capturedImage = '';
@@ -184,7 +185,12 @@ export class NewPublicationPage implements OnInit {
async goBack(){ async goBack(){
this.goBacktoPublicationDetails.emit(); if(this.publicationType == '2'){
this.goBackToViewPublications.emit();
} else {
this.goBacktoPublicationDetails.emit();
}
} }
/* async openGallery() { /* async openGallery() {
@@ -74,7 +74,6 @@
} }
.post-img{ .post-img{
width: 100%; width: 100%;
height: 400px;
margin: 0 auto; margin: 0 auto;
border-radius: 0px!important; border-radius: 0px!important;
overflow: hidden; overflow: hidden;
@@ -85,7 +84,6 @@
object-fit: cover; object-fit: cover;
} }
.post-description{ .post-description{
width: 360px;
margin: 0 auto; margin: 0 auto;
margin-bottom: 35px; margin-bottom: 35px;
} }
@@ -89,7 +89,7 @@ export class PublicationDetailPage implements OnInit {
async editPost(publicationType:any) { async editPost(publicationType:any) {
console.log(this.publication); console.log(this.publication);
if(window.innerHeight >= 1024){ if(window.innerWidth <= 1024){
const modal = await this.modalController.create({ const modal = await this.modalController.create({
component: NewPublicationPage, component: NewPublicationPage,
componentProps:{ componentProps:{
@@ -2,11 +2,11 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border">
<div class="main-header"> <div class="main-header">
<div class="title-content"> <div class="title-content d-flex flex-end">
<div class="back-icon" (click)="goBack()"> <!-- <div class="back-icon" (click)="goBack()">
<ion-icon slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon> <ion-icon slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
</div> </div> -->
<div class="div-title"> <div class="div-title flex-grow-1">
<ion-label class="title">{{item.Description}}</ion-label> <ion-label class="title">{{item.Description}}</ion-label>
<p class="item-content-detail">{{item.Detail}}</p> <p class="item-content-detail">{{item.Detail}}</p>
<p class="item-content-date">{{item.DateBegin}}</p> <p class="item-content-date">{{item.DateBegin}}</p>
@@ -149,9 +149,5 @@ export class ViewPublicationsPage implements OnInit {
} }
async goBack(){
console.log('!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!')
this.goBacktoPublicationDetails.emit();
}
} }
+63 -8
View File
@@ -178,32 +178,44 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
.calendar-event-border{ .calendar-event-border{
border-radius: 21px !important;
color: black !important; color: black !important;
margin: 0px auto !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{ .calendar-mdgpr-event-type-Oficial{
border-left: 3px solid #ffb703 !important; border-left: 3px solid #ffb703 !important;
} }
.calendar-mdgpr-event-type-Pessoal{ .calendar-mdgpr-event-type-Pessoal{
border-right: 3px solid #f05d5e !important; border-top: 3px solid #f05d5e !important;
} }
.calendar-mdgpr-event-type-both{ .calendar-mdgpr-event-type-both{
border-left: 3px solid #ffb703 !important; border-left: 3px solid #ffb703 !important;
border-right: 3px solid #f05d5e !important; border-top: 3px solid #f05d5e !important;
} }
.calendar-pr-event-type-both{ .calendar-pr-event-type-both{
border-left: 3px solid #99e47b !important; border-right: 3px solid #99e47b !important;
border-right: 3px solid #958bfc !important; border-bottom: 3px solid #958bfc !important;
} }
.calendar-pr-event-type-Oficial{ .calendar-pr-event-type-Oficial{
border-left: 3px solid #99e47b !important; border-right: 3px solid #99e47b !important;
} }
.calendar-pr-event-type-Pessoal{ .calendar-pr-event-type-Pessoal{
border-left: 3px solid #958bfc !important; border-bottom: 3px solid #958bfc !important;
} }
.cal-hour-segment { .cal-hour-segment {
@@ -415,3 +427,46 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
._xl{ ._xl{
width: 1140px; width: 1140px;
} }
// timeline
.timeline-md{
.cal-time{
display: none;
}
.cal-current-time-marker::before {
display: none !important;
}
.timeline-box{
left: -17%;
position: relative;
width: 115%;
}
}
.timeline-mobile{
.timeline-box {
position: relative;
left: -4%;
width: 102%;
}
}
.timeline{
div.cal-event:focus{
outline: none !important;
}
}
.calendar-component{
td{
padding: 8px !important;
div{
padding-left: 0px;
}
}
}