FullCalendar独特的自定义每周视图

Question

是否可以像图片链接一样从头开始构建每周视图 - 使用下面的Json结构？

var nestedEvents = {
    "ABC": [
        { 
            title: 'Test-1',
            startDate: moment,
            endDate: moment,
            "allDay": true
        },{ 
            title: 'Test-2',
            startTime: moment,
            endTime: moment,
            "allDay": true
        }
    ],
    "DEF": [
        { 
            title: 'Test-3',
            startTime: moment,
            endTime: moment,
            "allDay": true
        }
    ]
};

Answer 1

您可以借助momentjs

的格式函数执行此操作

moment(startDate).format('w') //returns the weeknumber (from 1 to 53)  
moment(startDate).format('d') //returns the day of the week (from 0 to 6)

首先，您必须创建一个对象，您可以按周存储事件。

然后你必须循环你的事件并使用你事件的相应星期和日期索引将每个事件推送到这个对象：

for(var i=0; i<events.length; i++){
    var weekIndex = moment(startDate).format('w')-1; 
    var dayIndex = moment(startDate).format('d');

    calendar.weeks[weekIndex].days[dayIndex].events.push(events[i]);
}

结果（一年）必须看起来像这样：

var calendar = {

"weeks": [
  {
     "weekNumber": 0,
     "days": [
        {
           "dayNumber": 0,
           "events": [
              {
                 "title": "Test-1",
                 "startDate": moment,
                 "endDate": moment
                 "allDay": true
              }
           ]
        },
        {
           "dayNumber": 1,
           "events": [
              {
                 "eventNumber": 0,
                 "title": "Test-2",
                 "startDate": moment,
                 "endDate": moment,
                 "allDay": true
              },
              {
                 "eventNumber": 1
              },
              {}
           ]
        },
        {
           "dayNumber": 2
        }
     ]
  },
  {
     "weekNumber": 1
  },
  {
     "weekNumber": 2
  },
  {}
]
}