2018-12-04 12:18:27 +00:00
|
|
|
import ngModule from '../module';
|
2019-10-24 10:44:36 +00:00
|
|
|
import Component from 'core/lib/component';
|
2019-06-26 11:35:38 +00:00
|
|
|
import './style.scss';
|
2018-09-24 12:51:27 +00:00
|
|
|
|
2019-10-24 10:44:36 +00:00
|
|
|
class Controller extends Component {
|
2019-11-18 15:31:37 +00:00
|
|
|
constructor($element, $, vnWeekDays) {
|
2019-10-24 10:44:36 +00:00
|
|
|
super($element, $);
|
2019-11-18 15:31:37 +00:00
|
|
|
this.vnWeekDays = vnWeekDays;
|
2019-10-23 15:38:35 +00:00
|
|
|
this.nMonths = 4;
|
2019-09-25 18:06:42 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
let date = new Date();
|
|
|
|
date.setDate(1);
|
|
|
|
date.setHours(0, 0, 0, 0);
|
|
|
|
this.date = date;
|
2018-11-12 10:31:58 +00:00
|
|
|
}
|
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
get date() {
|
|
|
|
return this._date;
|
2019-10-01 11:45:43 +00:00
|
|
|
}
|
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
set date(value) {
|
|
|
|
this._date = value;
|
|
|
|
let stamp = value.getTime();
|
|
|
|
|
|
|
|
let firstDay = new Date(stamp);
|
|
|
|
firstDay.setDate(1);
|
|
|
|
this.firstDay = firstDay;
|
|
|
|
|
|
|
|
let lastDay = new Date(stamp);
|
|
|
|
lastDay.setMonth(lastDay.getMonth() + this.nMonths);
|
|
|
|
lastDay.setDate(0);
|
|
|
|
this.lastDay = lastDay;
|
|
|
|
|
|
|
|
this.months = [];
|
|
|
|
for (let i = 0; i < this.nMonths; i++) {
|
|
|
|
let monthDate = new Date(stamp);
|
|
|
|
monthDate.setMonth(value.getMonth() + i);
|
|
|
|
this.months.push(monthDate);
|
|
|
|
}
|
|
|
|
|
|
|
|
this.refreshEvents();
|
2019-01-21 10:45:53 +00:00
|
|
|
}
|
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
step(direction) {
|
|
|
|
let date = new Date(this.date.getTime());
|
|
|
|
date.setMonth(date.getMonth() + (this.nMonths * direction));
|
|
|
|
this.date = date;
|
2021-11-17 12:15:59 +00:00
|
|
|
|
|
|
|
this.emit('step');
|
2019-01-21 10:45:53 +00:00
|
|
|
}
|
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
get data() {
|
|
|
|
return this._data;
|
|
|
|
}
|
2019-06-26 11:35:38 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
set data(value) {
|
|
|
|
this._data = value;
|
|
|
|
|
|
|
|
value = value || {};
|
2019-11-18 15:31:37 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
this.events = value.events;
|
2019-11-18 15:31:37 +00:00
|
|
|
|
|
|
|
function toStamp(date) {
|
|
|
|
return date && new Date(date).setHours(0, 0, 0, 0);
|
|
|
|
}
|
|
|
|
|
2019-11-19 12:49:10 +00:00
|
|
|
this.exclusions = {};
|
2019-11-18 15:31:37 +00:00
|
|
|
let exclusions = value.exclusions;
|
|
|
|
|
|
|
|
if (exclusions) {
|
2019-11-19 12:49:10 +00:00
|
|
|
for (let exclusion of exclusions) {
|
|
|
|
let stamp = toStamp(exclusion.dated);
|
|
|
|
if (!this.exclusions[stamp]) this.exclusions[stamp] = [];
|
|
|
|
this.exclusions[stamp].push(exclusion);
|
|
|
|
}
|
2019-11-18 15:31:37 +00:00
|
|
|
}
|
|
|
|
|
2022-05-16 05:17:29 +00:00
|
|
|
this.geoExclusions = {};
|
|
|
|
let geoExclusions = value.geoExclusions;
|
|
|
|
|
|
|
|
if (geoExclusions) {
|
|
|
|
for (let geoExclusion of geoExclusions) {
|
|
|
|
let stamp = toStamp(geoExclusion.dated);
|
|
|
|
if (!this.geoExclusions[stamp]) this.geoExclusions[stamp] = [];
|
|
|
|
this.geoExclusions[stamp].push(geoExclusion);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-11-18 15:31:37 +00:00
|
|
|
let events = value.events;
|
|
|
|
|
|
|
|
if (events) {
|
2020-06-22 08:01:55 +00:00
|
|
|
for (let event of events) {
|
2019-11-18 15:31:37 +00:00
|
|
|
event.dated = toStamp(event.dated);
|
|
|
|
event.ended = toStamp(event.ended);
|
|
|
|
event.started = toStamp(event.started);
|
|
|
|
event.wdays = this.vnWeekDays.fromSet(event.weekDays);
|
2019-10-23 15:38:35 +00:00
|
|
|
}
|
2019-09-25 18:06:42 +00:00
|
|
|
}
|
2019-01-21 10:45:53 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
this.refreshEvents();
|
2019-01-21 10:45:53 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
let calendars = this.element.querySelectorAll('vn-calendar');
|
|
|
|
for (let calendar of calendars)
|
|
|
|
calendar.$ctrl.repaint();
|
2019-09-25 18:06:42 +00:00
|
|
|
}
|
2019-04-03 09:34:58 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
refreshEvents() {
|
|
|
|
this.days = {};
|
2019-11-18 15:31:37 +00:00
|
|
|
if (!this.data) return;
|
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
let day = new Date(this.firstDay.getTime());
|
|
|
|
|
2019-11-01 12:02:47 +00:00
|
|
|
while (day <= this.lastDay) {
|
2019-10-23 15:38:35 +00:00
|
|
|
let stamp = day.getTime();
|
|
|
|
let wday = day.getDay();
|
|
|
|
let dayEvents = [];
|
2019-11-19 12:49:10 +00:00
|
|
|
let exclusions = this.exclusions[stamp] || [];
|
2019-10-23 15:38:35 +00:00
|
|
|
|
|
|
|
if (this.events) {
|
|
|
|
for (let event of this.events) {
|
|
|
|
let match;
|
|
|
|
|
2019-11-18 15:31:37 +00:00
|
|
|
switch (event.type) {
|
|
|
|
case 'day':
|
|
|
|
match = event.dated == stamp;
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
match = event.wdays[wday]
|
|
|
|
&& (!event.started || stamp >= event.started)
|
|
|
|
&& (!event.ended || stamp <= event.ended);
|
|
|
|
break;
|
|
|
|
}
|
2019-10-23 15:38:35 +00:00
|
|
|
|
2019-11-19 12:49:10 +00:00
|
|
|
if (match && !exclusions.find(e => e.zoneFk == event.zoneFk))
|
2019-10-23 15:38:35 +00:00
|
|
|
dayEvents.push(event);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-11-19 12:49:10 +00:00
|
|
|
if (dayEvents.length)
|
|
|
|
this.days[stamp] = dayEvents;
|
2019-10-23 15:38:35 +00:00
|
|
|
|
|
|
|
day.setDate(day.getDate() + 1);
|
|
|
|
}
|
2019-09-25 18:06:42 +00:00
|
|
|
}
|
2019-01-21 10:45:53 +00:00
|
|
|
|
2020-02-26 06:02:03 +00:00
|
|
|
onSelection($event, $days, $type, $weekday) {
|
2019-11-19 12:49:10 +00:00
|
|
|
let $events = [];
|
|
|
|
let $exclusions = [];
|
2022-05-26 06:33:45 +00:00
|
|
|
let $geoExclusions = [];
|
2019-11-19 12:49:10 +00:00
|
|
|
|
2019-10-23 15:38:35 +00:00
|
|
|
for (let day of $days) {
|
2019-11-19 12:49:10 +00:00
|
|
|
let stamp = day.getTime();
|
|
|
|
$events = $events.concat(this.days[stamp] || []);
|
|
|
|
$exclusions = $exclusions.concat(this.exclusions[stamp] || []);
|
2022-05-26 06:33:45 +00:00
|
|
|
$geoExclusions = $geoExclusions.concat(this.geoExclusions[stamp] || []);
|
2019-10-23 15:38:35 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
this.emit('selection', {
|
2020-02-26 06:02:03 +00:00
|
|
|
$event,
|
2019-10-23 15:38:35 +00:00
|
|
|
$days,
|
|
|
|
$type,
|
|
|
|
$weekday,
|
2019-11-19 12:49:10 +00:00
|
|
|
$events,
|
2022-05-26 06:33:45 +00:00
|
|
|
$exclusions,
|
|
|
|
$geoExclusions
|
2019-10-23 15:38:35 +00:00
|
|
|
});
|
2019-06-26 11:35:38 +00:00
|
|
|
}
|
2019-01-21 10:45:53 +00:00
|
|
|
|
2019-09-25 18:06:42 +00:00
|
|
|
hasEvents(day) {
|
2019-11-19 12:49:10 +00:00
|
|
|
let stamp = day.getTime();
|
2022-05-16 05:17:29 +00:00
|
|
|
return this.days[stamp] || this.exclusions[stamp] || this.geoExclusions[stamp];
|
2019-01-21 10:45:53 +00:00
|
|
|
}
|
|
|
|
|
2019-09-25 18:06:42 +00:00
|
|
|
getClass(day) {
|
2019-11-19 12:49:10 +00:00
|
|
|
let stamp = day.getTime();
|
2022-06-01 11:47:46 +00:00
|
|
|
if (this.geoExclusions[stamp])
|
2022-05-16 05:17:29 +00:00
|
|
|
return 'geoExcluded';
|
2022-06-01 11:47:46 +00:00
|
|
|
else if (this.exclusions[stamp])
|
2022-05-16 05:17:29 +00:00
|
|
|
return 'excluded';
|
|
|
|
else return '';
|
2018-09-24 12:51:27 +00:00
|
|
|
}
|
|
|
|
}
|
2019-11-18 15:31:37 +00:00
|
|
|
Controller.$inject = ['$element', '$scope', 'vnWeekDays'];
|
2018-09-24 12:51:27 +00:00
|
|
|
|
2020-07-24 12:22:30 +00:00
|
|
|
ngModule.vnComponent('vnZoneCalendar', {
|
2018-09-24 12:51:27 +00:00
|
|
|
template: require('./index.html'),
|
|
|
|
controller: Controller,
|
|
|
|
bindings: {
|
2019-10-23 15:38:35 +00:00
|
|
|
data: '<?'
|
2018-09-24 12:51:27 +00:00
|
|
|
}
|
|
|
|
});
|