Question

问题：我正在使用FullCalendar 4，我想创建一个“约会日历”，并且使用rrule来保存可用空间以进行选择。

如果我为日期添加新约会，我想删除现有的可用空间并插入一个新事件。

赞：开始时间：2019-10-10T10：00 标题：可用空间

开始：2019-10-10T10：00 标题：被客户屏蔽

第一个应该消失，第二个应该显示。

现在同时显示2个事件。

我该如何解决？

编辑：

因此，第一个事件使用rrule，并且每个星期一，星期二和星期五重复一次。

但是我也在星期二上午7点（第二个）进行了一次活动。现在，我想在该日期使用rrule删除事件。

我该怎么做？

document.addEventListener('DOMContentLoaded', function () {
  var calendarEl = document.getElementById('calendar');

  var calendar = new FullCalendar.Calendar(calendarEl, {
    plugins: ['interaction', 'dayGrid', 'timeGrid', 'list', 'rrule'],
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay,listMonth'
    },
    defaultDate: '2019-09-12',
    editable: true,
    events: [
      {
        "title": "Free",
        rrule: {
          freq: 'weekly',
          byweekday: ['mo', 'tu', 'fr'],
          dtstart: '2019-09-02T07:00',
          until: '2022-06-01'
        },
      },
      {
        "title": "Blocked",
        "type": "call",
        "start": "2019-09-03T07:00"
      }
    ],
    eventTimeFormat: { // like '14:30:00'
      hour: '2-digit',
      minute: '2-digit',
      hour12: false
    },
    eventColor: '#378006',
    eventClick: function (info) {
      alert('Event: ' + info.event.start);
      alert('Coordinates: ' + info.jsEvent.pageX + ',' + info.jsEvent.pageY);
      alert('View: ' + info.view.type);

      // change the border color just for fun
      info.el.style.borderColor = 'red';
    },
  });

  calendar.render();
});

Answer 1

您要查找的异常是EXDATE。我不是FullCalendar用户，但是从快速浏览文档来看，您似乎正在使用rrule插件，该插件连接到以下库：https://github.com/jakubroztocil/rrule

EXDATE在那里显示，但是在我看来rrule插件可能无法让您访问该功能（因为它支持创建RRule，而不是RRuleSet）。如果您可以使用EXDATE，那么它很适合您的用例。

否则，我认为您最好的选择是在发生这种情况时拆分重复发生的事件-在已预订的约会之前将其终止于约会，并创建一个从下一个空位开始的新事件。例如：

events: [
      {
        "title": "Free",
        rrule: {
          freq: 'weekly',
          byweekday: ['mo', 'tu', 'fr'],
          dtstart: '2019-09-02T07:00',
          until: '2019-09-04'
        },
      },
      {
        "title": "Blocked",
        "type": "call",
        "start": "2019-09-06T07:00"
      },
      {
        "title": "Free",
        rrule: {
          freq: 'weekly',
          byweekday: ['mo', 'tu', 'fr'],
          dtstart: '2019-09-09T07:00',
          until: '2022-06-01'
        },
      }
    ]

请注意，我已为该示例移动了“阻止”约会，因此我可以实际显示我所描述的内容。由于在您的示例中，被阻止的约会是该系列中的第二个约会，因此仅具有两个事件（第一个空闲时段和被阻止的一个）和一个针对其余部分的重复系列会更有意义。

删除重复的事件

1 个答案: