FullCalendar fc-more 在弹出窗口中显示大量重复项
FullCalendar fc-more shows lots of duplicates in popup
我正在使用 FullCalendar，并且 fc-more links 有一个持续存在的错误，显示日历中列出的事件的重复项。
基础 mysql 调用不会产生重复项。当事件跨越多天时，我认为日历中的某些东西正在创建重复项。不确定。有趣的是，为 fc-more 显示的数字是准确的，但是一旦单击，弹出窗口就会产生重复项。
我附上了几张图片来展示正在发生的事情。我想知道是否有人 运行 遇到过类似的问题。
这是生成提要数据的代码
while($row = mysqli_fetch_array($data)) {
$uniqueid = base64_encode($row['id']);
$a_json_row["id"] = $row['JobID'];
$projectid = base64_encode($row['JobID']);
$company = new Company();
$company->load($mysqli,$row['CompanyID']);
$a_json_row["start"] = htmlentities(stripslashes($row['ShowOpen']));
$a_json_row["end"] = htmlentities(stripslashes($row['ShowClose']));
$show = htmlentities(stripslashes($row['Show']));
$project = htmlentities(stripslashes($row['JobID']));
$mycompany = htmlentities(stripslashes($company->CompanyName));
$BoothSize = htmlentities(stripslashes($row['BoothSize']));
if($userid == ''){
$user = new User();
$user->load($mysqli, $row['AccountManager']);
$initials = getInitials($user->name);
$initials = "($initials)";
}else{
$initials = '';
}
$a_json_row["title"] = "$initials $BoothSize $project"; // $mycompany
if($row['Status'] == 7){
$a_json_row["color"] = htmlentities("#F1C40F"); // yellow
$a_json_row["textColor"] = htmlentities('black');
}elseif(($row['Status'] == 6)||($row['Status'] == 2)){
$a_json_row["color"] = htmlentities("#1a6fad");
$a_json_row["textColor"] = htmlentities('white');
}elseif(($row['Status'] == 8)||($row['Status'] == 9)){
$a_json_row["color"] = htmlentities("#93AFBF"); // bluish
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 4){
$a_json_row["color"] = htmlentities("#28B463"); // green
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 1){
$a_json_row["color"] = htmlentities("#beb098"); // tan
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 13){
$a_json_row["color"] = htmlentities("#922B21"); // red
$a_json_row["textColor"] = htmlentities('white');
}else{ // "Opportunity" = 1
$a_json_row["color"] = htmlentities("#717D7E"); // gray
$a_json_row["textColor"] = htmlentities('white');
}
$a_json_row["url"] = "project.php?j=$projectid";
array_push($a_json, $a_json_row);
}
这是 jQuery
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
defaultDate: (new Date()).toISOString().substring(0, 10),
navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
events: 'include/feed.php',
eventClick: function(event) {
if (event.url) {
window.open(event.url);
return false;
}
}
});
$('#calendar').fullCalendar({
events: function(callback) {
$.ajax({
url: 'include/feed.php',
success: function(doc) {
var events = [];
$(doc).find('event').each(function(){
events.push({
id: $(this).attr('id'),
title: $(this).attr('title'),
start: $(this).attr('start'), // will be parsed
url: $(this).attr('url'),
color: $(this).attr('color'),
textColor: $(this).attr('textColor')
});
});
callback(events);
}
});
}
});
});
这是一些示例数据
[{"id":"100041","start":"2019-07-30","end":"2019-07-31","title":"(JG) permanent install-office 100041","color":"#F1C40F","textColor":"black","url":"link.php?j=MTAwMDQx"},{"id":"100063","start":"2019-01-13","end":"2019-01-15","title":"(TJ) 20x20 100063","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMDYz"},{"id":"100070","start":"2019-02-12","end":"2019-02-14","title":"(KS) 50x80 100070","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMDcw"},{"id":"100129","start":"2019-05-20","end":"2019-05-22","title":"(AB) 20 x 30 100129","color":"#93AFBF","textColor":"white","url":"link.php?j=MTAwMTI5"},{"id":"100131","start":"2019-06-19","end":"2019-06-21","title":"(ME) 10x10 100131","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTMx"},{"id":"100132","start":"2019-06-19","end":"2019-06-21","title":"(ME) 10x10 100132","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTMy"},{"id":"100138","start":"2019-06-24","end":"2019-06-26","title":"(ML) 20x20 (2 of 2) 100138","color":"#F1C40F","textColor":"black","url":"link.php?j=MTAwMTM4"},{"id":"100139","start":"2019-08-25","end":"2019-08-27","title":"(ML) 10x20 (2 of 3) 100139","color":"#28B463","textColor":"white","url":"link.php?j=MTAwMTM5"},{"id":"100163","start":"2018-11-03","end":"2018-11-07","title":"(JG) 20x30 pull & prep 100163","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTYz"}]
Feed 数据不包含任何重复项。并且数字 "more + " link 不会多次计算条目。但是弹出窗口包含重复项。
这里有几个屏幕截图可以特别强调一天，即 2019 年 6 月 6 日。这一天有 6 个事件，其中一个 100996 在弹出窗口中重复了 6 次，而其他则没有。提要数据不包括 100996 的 6 个条目，只有一个。
弹出代码中有一些重复事件，可能与事件跨越数天或数周的时间有关。
为了解决这个问题，我更改了 fullcalendar.js 函数，该函数通过在显示之前从弹出窗口中删除重复事件来生成日期弹出窗口，代码块大约在第 8390 行。希望这可以帮助其他人节省一些时间。在 fullcalendar github 页面上看到了类似的错误报告。
原创
resliceDaySegs: function(segs, dayDate) {
var dayStart = dayDate.clone();
var dayEnd = dayStart.clone().add(1, 'days');
var dayRange = new UnzonedRange(dayStart, dayEnd);
var newSegs = [];
var i;
for (i = 0; i < segs.length; i++) {
newSegs.push.apply(newSegs, this.eventFootprintToSegs(segs[i].footprint, dayRange));
}
this.sortEventSegs(newSegs);
return newSegs;
},
到这个
resliceDaySegs: function(segs, dayDate) {
var dayStart = dayDate.clone();
var dayEnd = dayStart.clone().add(1, 'days');
var dayRange = new UnzonedRange(dayStart, dayEnd);
var newSegs = [];
var i;
for (i = 0; i < segs.length; i++) {
newSegs.push.apply(newSegs, // append
this.eventFootprintToSegs(segs[i].footprint, dayRange)
);
}
var unique = [];
var newSegsX = [];
$.each(newSegs, function(i,el){
if($.inArray(el.footprint.eventDef.id, unique) === -1){
unique.push(el.footprint.eventDef.id);
newSegsX.push(el);
}
});
this.sortEventSegs(newSegsX);
return newSegsX;
},
我正在使用 FullCalendar，并且 fc-more links 有一个持续存在的错误，显示日历中列出的事件的重复项。
基础 mysql 调用不会产生重复项。当事件跨越多天时，我认为日历中的某些东西正在创建重复项。不确定。有趣的是，为 fc-more 显示的数字是准确的，但是一旦单击，弹出窗口就会产生重复项。
我附上了几张图片来展示正在发生的事情。我想知道是否有人 运行 遇到过类似的问题。
这是生成提要数据的代码
while($row = mysqli_fetch_array($data)) {
$uniqueid = base64_encode($row['id']);
$a_json_row["id"] = $row['JobID'];
$projectid = base64_encode($row['JobID']);
$company = new Company();
$company->load($mysqli,$row['CompanyID']);
$a_json_row["start"] = htmlentities(stripslashes($row['ShowOpen']));
$a_json_row["end"] = htmlentities(stripslashes($row['ShowClose']));
$show = htmlentities(stripslashes($row['Show']));
$project = htmlentities(stripslashes($row['JobID']));
$mycompany = htmlentities(stripslashes($company->CompanyName));
$BoothSize = htmlentities(stripslashes($row['BoothSize']));
if($userid == ''){
$user = new User();
$user->load($mysqli, $row['AccountManager']);
$initials = getInitials($user->name);
$initials = "($initials)";
}else{
$initials = '';
}
$a_json_row["title"] = "$initials $BoothSize $project"; // $mycompany
if($row['Status'] == 7){
$a_json_row["color"] = htmlentities("#F1C40F"); // yellow
$a_json_row["textColor"] = htmlentities('black');
}elseif(($row['Status'] == 6)||($row['Status'] == 2)){
$a_json_row["color"] = htmlentities("#1a6fad");
$a_json_row["textColor"] = htmlentities('white');
}elseif(($row['Status'] == 8)||($row['Status'] == 9)){
$a_json_row["color"] = htmlentities("#93AFBF"); // bluish
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 4){
$a_json_row["color"] = htmlentities("#28B463"); // green
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 1){
$a_json_row["color"] = htmlentities("#beb098"); // tan
$a_json_row["textColor"] = htmlentities('white');
}elseif($row['Status'] == 13){
$a_json_row["color"] = htmlentities("#922B21"); // red
$a_json_row["textColor"] = htmlentities('white');
}else{ // "Opportunity" = 1
$a_json_row["color"] = htmlentities("#717D7E"); // gray
$a_json_row["textColor"] = htmlentities('white');
}
$a_json_row["url"] = "project.php?j=$projectid";
array_push($a_json, $a_json_row);
}
这是 jQuery
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
defaultDate: (new Date()).toISOString().substring(0, 10),
navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
events: 'include/feed.php',
eventClick: function(event) {
if (event.url) {
window.open(event.url);
return false;
}
}
});
$('#calendar').fullCalendar({
events: function(callback) {
$.ajax({
url: 'include/feed.php',
success: function(doc) {
var events = [];
$(doc).find('event').each(function(){
events.push({
id: $(this).attr('id'),
title: $(this).attr('title'),
start: $(this).attr('start'), // will be parsed
url: $(this).attr('url'),
color: $(this).attr('color'),
textColor: $(this).attr('textColor')
});
});
callback(events);
}
});
}
});
});
这是一些示例数据
[{"id":"100041","start":"2019-07-30","end":"2019-07-31","title":"(JG) permanent install-office 100041","color":"#F1C40F","textColor":"black","url":"link.php?j=MTAwMDQx"},{"id":"100063","start":"2019-01-13","end":"2019-01-15","title":"(TJ) 20x20 100063","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMDYz"},{"id":"100070","start":"2019-02-12","end":"2019-02-14","title":"(KS) 50x80 100070","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMDcw"},{"id":"100129","start":"2019-05-20","end":"2019-05-22","title":"(AB) 20 x 30 100129","color":"#93AFBF","textColor":"white","url":"link.php?j=MTAwMTI5"},{"id":"100131","start":"2019-06-19","end":"2019-06-21","title":"(ME) 10x10 100131","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTMx"},{"id":"100132","start":"2019-06-19","end":"2019-06-21","title":"(ME) 10x10 100132","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTMy"},{"id":"100138","start":"2019-06-24","end":"2019-06-26","title":"(ML) 20x20 (2 of 2) 100138","color":"#F1C40F","textColor":"black","url":"link.php?j=MTAwMTM4"},{"id":"100139","start":"2019-08-25","end":"2019-08-27","title":"(ML) 10x20 (2 of 3) 100139","color":"#28B463","textColor":"white","url":"link.php?j=MTAwMTM5"},{"id":"100163","start":"2018-11-03","end":"2018-11-07","title":"(JG) 20x30 pull & prep 100163","color":"#717D7E","textColor":"white","url":"link.php?j=MTAwMTYz"}]
Feed 数据不包含任何重复项。并且数字 "more + " link 不会多次计算条目。但是弹出窗口包含重复项。
这里有几个屏幕截图可以特别强调一天，即 2019 年 6 月 6 日。这一天有 6 个事件，其中一个 100996 在弹出窗口中重复了 6 次，而其他则没有。提要数据不包括 100996 的 6 个条目，只有一个。
弹出代码中有一些重复事件，可能与事件跨越数天或数周的时间有关。
为了解决这个问题，我更改了 fullcalendar.js 函数，该函数通过在显示之前从弹出窗口中删除重复事件来生成日期弹出窗口，代码块大约在第 8390 行。希望这可以帮助其他人节省一些时间。在 fullcalendar github 页面上看到了类似的错误报告。
原创
resliceDaySegs: function(segs, dayDate) {
var dayStart = dayDate.clone();
var dayEnd = dayStart.clone().add(1, 'days');
var dayRange = new UnzonedRange(dayStart, dayEnd);
var newSegs = [];
var i;
for (i = 0; i < segs.length; i++) {
newSegs.push.apply(newSegs, this.eventFootprintToSegs(segs[i].footprint, dayRange));
}
this.sortEventSegs(newSegs);
return newSegs;
},
到这个
resliceDaySegs: function(segs, dayDate) {
var dayStart = dayDate.clone();
var dayEnd = dayStart.clone().add(1, 'days');
var dayRange = new UnzonedRange(dayStart, dayEnd);
var newSegs = [];
var i;
for (i = 0; i < segs.length; i++) {
newSegs.push.apply(newSegs, // append
this.eventFootprintToSegs(segs[i].footprint, dayRange)
);
}
var unique = [];
var newSegsX = [];
$.each(newSegs, function(i,el){
if($.inArray(el.footprint.eventDef.id, unique) === -1){
unique.push(el.footprint.eventDef.id);
newSegsX.push(el);
}
});
this.sortEventSegs(newSegsX);
return newSegsX;
},