出于某种原因,Fullcalendar会显示从午夜开始的事件,例如'24:15'。我们希望它显示为“ 00:15”。我认为这是一个新问题,因为我们已经有一年的日历了,这是我第一次听到。但是我找不到任何解决方法。
我们正在使用fullcalendar v4.2.0。我没有编写原始代码,但是我对此非常熟悉。我们使用REST API提取事件,并使用ServiceNow。使用12小时制(am / pm)时,显示12a15。我尝试更改eventTimeFormat,但是没有运气。这是客户端脚本的一部分:
/* Calendar */
c.funcs.loadCalendar = function() {
var calendarEl = document.getElementById('calendar');
c.calendar = new FullCalendar.Calendar(calendarEl, {
contentHeight: 'auto',
plugins: [ 'dayGrid','timeGrid', 'list'],
header: {
left: 'prev next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek,listMonth'
},
buttonText: {
dayGridMonth: 'Month',
timeGridWeek: 'Week',
timeGridDay: 'Day',
listWeek: 'List Week',
listMonth: 'List Month',
today: 'Today'
},
editable: false,
eventTimeFormat: {
hour: '2-digit',
minute: '2-digit',
hour12: false
},
eventOverlap: false,
firstDay: 1,
weekNumbers: true,
// Scripted REST API which sends Start and End date-time of current view as parameters and gets current events.
//events: '/api/tnas/fullcalendar_fetch_data',
events: function(info, successCallback, failureCallback) {
$http({
method: 'GET',
url: '/api/tnas/fullcalendar_fetch_data',
headers: {
'X-UserToken': window.g_ck // Authorization
},
params: {
systems: c.vars.selectedSystems.map(function(system) { return system.value; }).toString(),
excludedTypes: c.vars.types.filter(function(type) {return !type.checked}).map(function(type) { if(!type.checked) return type.type }).toString(),
start: info.start,
end: info.end
}
}).success(function(data, status) {
successCallback(data.result.events);
}).error(function(data, status) {failureCallback(data)});
},
loading: function(isLoading) {
c.vars.calendarIsLoading = isLoading;
$scope.$evalAsync();
},
// When event is rendered and put into the DOM, add a tippy.js tooltip to that element.
eventRender: function(info) {
tippy(info.el, {
theme: 'light-border',
content: info.event.extendedProps.tooltipContent,
arrow: true,
animation: 'fade',
flip: false,
boundary: 'window'
});
},
eventClick: function(info){
info.jsEvent.preventDefault();
var p = $scope.data.page_id || 'form';
var url = '/sp?id=' + p + '&table=' + info.event.extendedProps.table + '&sys_id=' + info.event.id + '&view=sp';
window.open(url, "_blank");
},
navLinks: true,
navLinkDayClick: function(date, jsEvent) {
//c.calendar.gotoDate(date);
c.calendar.changeView('timeGridDay', date);
}
});
c.calendar.render();
}
/* Calendar End */
事件的JSON:
title: "Metro IN-Applikasjoner - test"
number: "SREL0004789"
start: "2020-04-15 00:15:00"
end: "2020-04-16 14:00:00"
downtime_start: ""
downtime_end: ""
className: "SystemRelease"
type: "system_release"
table: "release"
id: "4a393c2b298c54903eaa786081948e7c"
state: "New"
state_reason: null
downtime_type: "Soft"
color: "rgb(163, 222, 255, 0.5)"
tooltipContent: "<div style='text-align:left; font-size:1.5em'><p>Metro IN-Applikasjoner - test</p><p><strong>Start:</strong> 00:15, 15. apr 20</p><p><strong>End:</strong> 14:00, 16. apr 20</p></div>"
希望有人曾经遇到过同样的问题。任何帮助将不胜感激!
答案 0 :(得分:3)
已修复:在eventTimeFormat中将hour12属性替换为hourCycle:'h23'可以解决问题!
eventTimeFormat: {
hour: '2-digit',
minute: '2-digit',
hourCycle: 'h23'
},