Convert calendar to VueJS component
Update to FullCalendar 3.1.0 as well.
This commit is contained in:
2
assets/js/app.min.js
vendored
2
assets/js/app.min.js
vendored
File diff suppressed because one or more lines are too long
50
assets/js/components/calendar.js
Normal file
50
assets/js/components/calendar.js
Normal file
@@ -0,0 +1,50 @@
|
||||
Vue.component('calendar', {
|
||||
props: ['saveUrl', 'checkUrl'],
|
||||
template: '<div id="calendar"></div>',
|
||||
ready: function() {
|
||||
var self = this;
|
||||
var calendar = $('#calendar');
|
||||
|
||||
calendar.fullCalendar({
|
||||
locale: $("body").data("js-lang"),
|
||||
editable: true,
|
||||
eventLimit: true,
|
||||
defaultView: "month",
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
eventDrop: function(event) {
|
||||
$.ajax({
|
||||
cache: false,
|
||||
url: self.saveUrl,
|
||||
contentType: "application/json",
|
||||
type: "POST",
|
||||
processData: false,
|
||||
data: JSON.stringify({
|
||||
"task_id": event.id,
|
||||
"date_due": event.start.format()
|
||||
})
|
||||
});
|
||||
},
|
||||
viewRender: function() {
|
||||
var url = self.checkUrl;
|
||||
var params = {
|
||||
"start": calendar.fullCalendar('getView').start.format(),
|
||||
"end": calendar.fullCalendar('getView').end.format()
|
||||
};
|
||||
|
||||
for (var key in params) {
|
||||
url += "&" + key + "=" + params[key];
|
||||
}
|
||||
|
||||
$.getJSON(url, function(events) {
|
||||
calendar.fullCalendar('removeEvents');
|
||||
calendar.fullCalendar('addEventSource', events);
|
||||
calendar.fullCalendar('rerenderEvents');
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -1,55 +0,0 @@
|
||||
Kanboard.Calendar = function(app) {
|
||||
this.app = app;
|
||||
};
|
||||
|
||||
Kanboard.Calendar.prototype.execute = function() {
|
||||
var calendar = $('#calendar');
|
||||
|
||||
if (calendar.length == 1) {
|
||||
this.show(calendar);
|
||||
}
|
||||
};
|
||||
|
||||
Kanboard.Calendar.prototype.show = function(calendar) {
|
||||
calendar.fullCalendar({
|
||||
lang: $("body").data("js-lang"),
|
||||
editable: true,
|
||||
eventLimit: true,
|
||||
defaultView: "month",
|
||||
header: {
|
||||
left: 'prev,next today',
|
||||
center: 'title',
|
||||
right: 'month,agendaWeek,agendaDay'
|
||||
},
|
||||
eventDrop: function(event) {
|
||||
$.ajax({
|
||||
cache: false,
|
||||
url: calendar.data("save-url"),
|
||||
contentType: "application/json",
|
||||
type: "POST",
|
||||
processData: false,
|
||||
data: JSON.stringify({
|
||||
"task_id": event.id,
|
||||
"date_due": event.start.format()
|
||||
})
|
||||
});
|
||||
},
|
||||
viewRender: function() {
|
||||
var url = calendar.data("check-url");
|
||||
var params = {
|
||||
"start": calendar.fullCalendar('getView').start.format(),
|
||||
"end": calendar.fullCalendar('getView').end.format()
|
||||
};
|
||||
|
||||
for (var key in params) {
|
||||
url += "&" + key + "=" + params[key];
|
||||
}
|
||||
|
||||
$.getJSON(url, function(events) {
|
||||
calendar.fullCalendar('removeEvents');
|
||||
calendar.fullCalendar('addEventSource', events);
|
||||
calendar.fullCalendar('rerenderEvents');
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
874
assets/js/vendor.min.js
vendored
874
assets/js/vendor.min.js
vendored
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user