Question

我正在使用FullCalendar编写约会调度模块。因此，主要目标是利用两种类型的事件：

预约 - 实际预约
可用 - 可用时间段

我修改了FullCalendar，以便约会类型事件呈现某种颜色，而可用类型事件呈现另一种颜色。

主要目标是允许某人 - 查看可用的时隙
- 选择该时间段的全部或部分以安排约会类型事件
- 禁止重叠约会的能力
- 用户在可用时间段外单击时不执行任何操作

首先呈现可用事件，然后最后呈现约会类型事件我修改了fullcalendar，以便重叠事件不会并排显示 - 而是将约会事件放在可用事件之上。

在eventClick中我首先检查事件类型。如果是约会事件，那么我只想编辑所选的约会事件。

如果是可用事件，那么我想创建一个新的约会类型事件。

如果只是dayClick事件，则忽略

最初，我会在选择
上调用function：CreateEvent 并在eventClick上调用UpdateClick 像这样：

select : CreateEvent,
eventClick : UpdateClick,

这些功能会弹出一个对话框，可以在其中添加或编辑事件由于我只希望他们能够在现有的可用事件插槽中安排约会，我想也许我可以调用相同的程序如下：

eventClick: function(calEvent, jsEvent, view) {

if (calEvent.type=='AVAILABLE') {
 CreateEvent;      // schedule new appt.
} else if (calEvent.type=='APPOINTMENT') {

 UpdateClick;   // edit existing appt.
}

}

该代码的问题在于例程：CreateEvent需要开始和结束时间。

    function CreateEvent(start, end, allDay) {
 $('#calendar').fullCalendar('unselect');
 var id = $(formStart + formEnd);

 $(id).dialog( {
  title : 'Create',
  modal : true,
  autoOpen : true,
  width : "340px",
  resizable : false,
  close : function(event, ui) {
   $(id).html('');
  },
  buttons : {
   "Ok" : function() {
    title = document.getElementById('titleId').value;

    $(id).dialog("close");
    ev = {
     title : title,
     start : start.getTime() / 1000,
     end : end.getTime() / 1000,
     allDay : allDay
    };
    if (!title) {
     return;
    }
    serverSave(ev);
   },
   "Cancel" : function() {
    $(id).dialog("close");
   }
  }
 });}

我不想使用事件开始和事件结束，因为这将是完整的可用时间段。在安排约会时，他们可能只使用该可用时间段的一部分。

那么，您知道如何将实际鼠标指针Y坐标转换为约会的开始时间吗？

和/或

您是否看到使用FullCalendar处理此类预约安排的更简单方法？

由于

Answer 1

我知道jsEvent包含很多信息，包括日历插槽中click事件的坐标。（见eventClick documentation about PageX & pageY）它谈到坐标。

另一个想到的解决方案是切换到日视图，以便更容易选择/查看可用的时间。这个开关甚至可以通过模态弹出窗口来处理。

希望有所帮助。

FullCalendar：我可以获得与EventClick坐标相关的开始时间吗？

1 个答案: