();
diff --git a/projects/truly-ui/src/components/editor/editor.ts b/projects/truly-ui/src/components/editor/editor.ts
index f18f81f7e..83b1000ca 100644
--- a/projects/truly-ui/src/components/editor/editor.ts
+++ b/projects/truly-ui/src/components/editor/editor.ts
@@ -20,7 +20,7 @@
SOFTWARE.
*/
import {
- AfterContentInit,
+ AfterContentInit, ChangeDetectorRef,
Component,
ElementRef,
EventEmitter,
@@ -36,7 +36,7 @@ import {trigger, transition, style, animate} from '@angular/animations';
import {ToolbarConfigModel} from './model/toolbar-config.model';
import {ToolbarConfig} from './interfaces/toolbar-config';
import {I18nService} from '../i18n/i18n.service';
-import {ControlValueAccessor, NG_VALUE_ACCESSOR, NgControl} from '@angular/forms';
+import {ControlValueAccessor, NgControl} from '@angular/forms';
import {DomSanitizer, SafeHtml} from '@angular/platform-browser';
import {Subscription} from 'rxjs';
import {EditorService} from './services/editor.service';
@@ -154,6 +154,7 @@ export class TlEditor implements ControlValueAccessor, AfterContentInit, OnChang
private renderer: Renderer2,
private editorService: EditorService,
private sanitizer: DomSanitizer,
+ private cd: ChangeDetectorRef,
@Optional() @Self() public ngControl: NgControl) {
this.setControl();
this.fontCollection = [
@@ -195,18 +196,18 @@ export class TlEditor implements ControlValueAccessor, AfterContentInit, OnChang
listenChangeControl() {
if ( this.control ) {
this.subscription.add(this.control.valueChanges.subscribe(( values ) => {
- if (!this.listenerRegistered) {
- this.handleFieldsPropagation();
- }
+
}));
}
}
handleFieldsPropagation() {
- const fields = this.contentEditor.nativeElement.querySelectorAll('.ui-field');
- for (const item of fields) {
- this.preventPropagation(item);
- }
+ setTimeout(() => {
+ const fields = this.contentEditor.nativeElement.querySelectorAll('.ui-field');
+ for (const item of fields) {
+ this.preventPropagation(item);
+ }
+ }, 100);
}
alignContent(align) {
@@ -581,7 +582,10 @@ export class TlEditor implements ControlValueAccessor, AfterContentInit, OnChang
writeValue(value: any): void {
this.content = this.sanitizer.bypassSecurityTrustHtml(value);
+ this.handleFieldsPropagation();
this.recoverCursorPosition();
+ this.cd.detectChanges();
+
}
registerOnChange(fn: any): void {
diff --git a/projects/truly-ui/src/components/editor/parts/editor-header/editor-header.html b/projects/truly-ui/src/components/editor/parts/editor-header/editor-header.html
index 05db0db32..ce9ea17a3 100644
--- a/projects/truly-ui/src/components/editor/parts/editor-header/editor-header.html
+++ b/projects/truly-ui/src/components/editor/parts/editor-header/editor-header.html
@@ -1,95 +1,95 @@
diff --git a/projects/truly-ui/src/components/schedule/views/day/view-day.component.scss b/projects/truly-ui/src/components/schedule/views/day/view-day.component.scss
index 00507bd59..fccfe35ba 100644
--- a/projects/truly-ui/src/components/schedule/views/day/view-day.component.scss
+++ b/projects/truly-ui/src/components/schedule/views/day/view-day.component.scss
@@ -36,6 +36,10 @@
>.ui-schedule-row{
background-color: #f5f5f5;
border-bottom: 1px #D6D6D6 dotted;
+ cursor: pointer;
+ &.selected {
+ background-color: #EDEDED;
+ }
&:first-child{
border-bottom: 1px #D6D6D6 dotted;
}
@@ -170,7 +174,7 @@
#FFFFFF 20px
);
> .ui-event-title{
- font-size: 0.9em;
+ font-size: 1.1em;
font-weight: 600;
color: #454e58;
white-space: nowrap;
@@ -178,7 +182,7 @@
font-variant-caps: all-petite-caps;
}
> .ui-event-hour{
- font-size: 1.0em;
+ font-size: 1.1em;
color: #454e58;
justify-content: center;
margin-right: 0;
diff --git a/projects/truly-ui/src/components/schedule/views/day/view-day.component.ts b/projects/truly-ui/src/components/schedule/views/day/view-day.component.ts
index 1d58e1d1a..d7874c021 100644
--- a/projects/truly-ui/src/components/schedule/views/day/view-day.component.ts
+++ b/projects/truly-ui/src/components/schedule/views/day/view-day.component.ts
@@ -43,6 +43,8 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
@Output() onRowDbClick = new EventEmitter();
+ @Output() onRowClick = new EventEmitter();
+
@Output() onEventDbClick = new EventEmitter();
@Output() onEventClick = new EventEmitter();
@@ -59,6 +61,8 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
public currentTime = new Date();
+ public indexRowSelected = null;
+
public eventsWithPositions: {
positions: {id: string, top: number, left: number, height: number, width: number},
data: ScheduleDataSource
@@ -75,12 +79,14 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
this.subscriptions.add(this.workScaleService.updateScale.subscribe(( timesCollection) => {
this.timesCollection = timesCollection;
this.changeDetectionRef.detectChanges();
+ this.indexRowSelected = null;
}));
this.subscriptions.add(this.eventService.updateEvents.subscribe(( event ) => {
this.generateEventsPositions( event );
this.inicializeNowIndicator( );
this.changeDetectionRef.detectChanges();
+ this.indexRowSelected = null;
}));
}
@@ -93,24 +99,25 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
if ( changes['currentDate'] !== undefined ) {
this.workScaleService.currentDate = changes[ 'currentDate' ].currentValue;
+ this.indexRowSelected = null;
this.eventService.getEventsOfDay();
}
if ( changes['workScale'] !== undefined ) {
+ this.indexRowSelected = null;
this.workScaleService.reload( changes[ 'workScale' ].currentValue );
}
-
if ( changes['events'] !== undefined ) {
- this.createWorkScaleByEvents(changes[ 'events' ].currentValue, this.workScale as WorkScaleType[] );
- this.eventService.loadEvents( changes[ 'events' ].currentValue );
- this.eventService.getEventsOfDay();
+ this.createWorkScaleByEvents(changes[ 'events' ].currentValue, this.workScale as WorkScaleType[] );
+ this.indexRowSelected = null;
+ this.eventService.loadEvents( changes[ 'events' ].currentValue );
+ this.eventService.getEventsOfDay();
}
-
this.changeDetectionRef.detectChanges();
}
- rowDbClick( time, index, periodIndex) {
+ rowDbClick( time, index, periodIndex ) {
const workScaleInterval = this.workScaleService.workScale[periodIndex].interval;
const minutesToStart = index > 0 ? ( workScaleInterval / this.slotSettings.slotCount ) * ( index ) : 0;
const minutesToEnd = ( workScaleInterval / this.slotSettings.slotCount ) * ( index + 1 );
@@ -121,6 +128,18 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
});
}
+
+ rowClick( time, index, periodIndex, scheduleRow) {
+ const workScaleInterval = this.workScaleService.workScale[periodIndex].interval;
+ const minutesToStart = index > 0 ? ( workScaleInterval / this.slotSettings.slotCount ) * ( index ) : 0;
+ const minutesToEnd = ( workScaleInterval / this.slotSettings.slotCount ) * ( index + 1 );
+ this.indexRowSelected = scheduleRow.getAttribute('data-row-index');
+ this.onRowClick.emit({
+ start: new Date(time).setMinutes( new Date(time).getMinutes( ) + minutesToStart ),
+ end: new Date(time).setMinutes( new Date(time).getMinutes( ) + minutesToEnd ),
+ });
+ }
+
private inicializeNowIndicator() {
// this.nowIndicatorPositionTop = this.showNowIndicator ? this.generateEvents.convertMillisecondsToPixel() : -1000;
this.changeDetectionRef.detectChanges();
@@ -176,8 +195,32 @@ export class ViewDayComponent implements OnInit, AfterViewInit, OnChanges, OnDes
}
});
}
- this.workScaleService.reload( this.reduceScales( scales ) );
+ this.workScaleService.reload( this.addMiddleScales(events, this.reduceScales( scales) ) );
+ }
+ }
+
+ private addMiddleScales(events: ScheduleDataSource[], workScale: WorkScaleType[]) {
+ const scales = workScale.filter( work => work);
+ for (let workScaleIndex = 0; workScaleIndex < workScale.length - 1; workScaleIndex++ ) {
+ for (let e = 0; e < events.length - 1; e++ ) {
+ const eventStartDate = new Date(events[e].date.start).setSeconds(0, 0);
+ const eventEndDate = new Date(events[e].date.end).setSeconds(0, 0);
+ const workStartDate = this.workScaleService.transformHourToMileseconds(workScale[workScaleIndex].end, new Date(eventStartDate));
+ const workEndDate = this.workScaleService.transformHourToMileseconds(workScale[workScaleIndex + 1].start, new Date(eventEndDate));
+
+ // Horario dentro do intervalo
+ if ( eventStartDate >= workStartDate && eventEndDate <= workEndDate ) {
+ scales.push({
+ start: this.workScaleService.transformMilesecondsToHour(workStartDate),
+ end: this.workScaleService.transformMilesecondsToHour(workEndDate),
+ interval: (scales[workScaleIndex].interval),
+ expansed: true,
+ }); break;
+ }
+
+ }
}
+ return this.reduceScales( scales);
}
private reduceScales( scales: WorkScaleType[] ) {
diff --git a/projects/truly-ui/src/components/time-available-picker/index.ts b/projects/truly-ui/src/components/time-available-picker/index.ts
index 4a6d9c199..dc0de4710 100644
--- a/projects/truly-ui/src/components/time-available-picker/index.ts
+++ b/projects/truly-ui/src/components/time-available-picker/index.ts
@@ -7,6 +7,8 @@ import { ButtonModule } from '../button/index';
import { MiscModule } from '../misc/index';
import { IconsModule } from '../icons/index';
import { LoaderModule } from '../loader/index';
+import { CalendarModule } from '../calendar/index';
+import { TooltipModule } from '../tooltip/index';
@NgModule({
imports: [
@@ -15,7 +17,9 @@ import { LoaderModule } from '../loader/index';
ButtonModule,
MiscModule,
IconsModule,
- LoaderModule
+ LoaderModule,
+ CalendarModule,
+ TooltipModule
],
declarations: [
TlTimeAvailablePicker
diff --git a/projects/truly-ui/src/components/time-available-picker/time-available-picker-theme.scss b/projects/truly-ui/src/components/time-available-picker/time-available-picker-theme.scss
index 212ea2f41..d13a058b7 100644
--- a/projects/truly-ui/src/components/time-available-picker/time-available-picker-theme.scss
+++ b/projects/truly-ui/src/components/time-available-picker/time-available-picker-theme.scss
@@ -3,6 +3,8 @@
@mixin _tl-time-available-picker-theme-schema( $theme, $action ) {
$primary: map-deep-get($theme, 'primary');
+ $danger: map-deep-get($theme, 'danger');
+
border: 1px solid map-deep-get($theme, $action, "default", "border");
.ui-empty-data {
@@ -14,6 +16,9 @@
> .ui-date-selected {
color: map-deep-get($primary, "default", "background");
}
+ > .ui-date-selected.holiday{
+ color: map-deep-get($danger, "default", "background");
+ }
> .ui-time-selected {
span {
background: linear-gradient(45deg, map-deep-get($primary, "lighter", "background") 0%, map-deep-get($primary, "darker", "background") 100%);
diff --git a/projects/truly-ui/src/components/time-available-picker/time-available-picker.html b/projects/truly-ui/src/components/time-available-picker/time-available-picker.html
index 7f2848c55..efd3e7a16 100644
--- a/projects/truly-ui/src/components/time-available-picker/time-available-picker.html
+++ b/projects/truly-ui/src/components/time-available-picker/time-available-picker.html
@@ -1,9 +1,11 @@
diff --git a/src/app/components/time-available-picker/time-available-pickerdemo.component.ts b/src/app/components/time-available-picker/time-available-pickerdemo.component.ts
index 8b7415cc7..e3a2f2ae5 100644
--- a/src/app/components/time-available-picker/time-available-pickerdemo.component.ts
+++ b/src/app/components/time-available-picker/time-available-pickerdemo.component.ts
@@ -37,6 +37,14 @@ export class TimeAvailablePickerDemoComponent {
public loading = true;
+ public holidaysArray = [
+ {
+ date: new Date(),
+ description: 'Some Holiday Today',
+ tooltip: true
+ }
+ ];
+
public data = [
{
start: new Date( 1999, 1, 1, 8, 0 ),