Unable to create schedule

[LoSunny]

Version

latest (cdn)

Development Environment

Chrome 78.0.3904.70
macOS Catalina 10.15

Current Behavior

I've wanted to create schedules. But it doesn't work
(I've changed how the data/schedules.js worked. Others remain unchanged)

function generateScheduleDetails(data) {
    data.activities.forEach((value, index, array) => {
      console.log('Adding ', value);
      var schedule = new ScheduleInfo();

      schedule.id = value.id;
      schedule.calendarId = value.calendarId;

      schedule.title = value.title;
      schedule.body = value.body;

      schedule.start = new Date(value.start);
      schedule.end = new Date(value.end);

      var calendar = findCalendar(value.calendarId);

      schedule.color = calendar.color;
      schedule.bgColor = calendar.bgColor;
      schedule.dragBgColor = calendar.dragBgColor;
      schedule.borderColor = calendar.borderColor;

      if (value.isAllday) {
        schedule.category = 'allday';
      } else {
        schedule.category = 'time';
      }

      if (schedule.category === 'milestone') {
        schedule.color = schedule.bgColor;
        schedule.bgColor = 'transparent';
        schedule.dragBgColor = 'transparent';
        schedule.borderColor = 'transparent';
      }
      console.log(schedule);

      ScheduleList.push(schedule);
    });
  }

An example of the log adding

Expected Behavior

The calendar should have some schedule pop up.

I've also tried to use the chrome console to fetch the schedule by cal.getSchedule(id, calendarId). But it said undefined

[jungeun-cho]

@LoYungSum
Check the createSchedules method

https://github.com/nhn/tui.calendar/blob/master/docs/getting-started.md#usage

 var cal = new tui.Calendar('#calendar', {
    ...
    useCreationPopup: true, // Did you turn this option on?
    useDetailPopup: true
  });

https://nhn.github.io/tui.calendar/latest/Calendar#createSchedules

[LoSunny]

I've turned the settings on

  defaultView: 'month',
  taskView: true,
  template: templates,
  useCreationPopup: true,
  useDetailPopup: true,
  calendars: calCalendars,
});

I think I've coded the createSchedules correctly. Is there something wrong that I've missed?

I've tried to check the array before the above method is executed.

function setSchedules() {
    cal.clear();
    generateSchedule(cal.getViewName(), cal.getDateRangeStart(), cal.getDateRangeEnd());
    cal.createSchedules(ScheduleList);
    console.log('The ScheduleList',ScheduleList);
    refreshScheduleVisibility();
  }

And the output is as follows

[LoSunny]

Does the ID of a schedule must be a UUID?

[LoSunny]

@jungeun-cho Do you know how to solve the problem?

[jungeun-cho]

@LoYungSum
Can you give me information with codepen or jsfiddle so that I can understand the scenario?

The codesandbox is fine too.

[LoSunny]

I'm hosting with Google Cloud, but there seems to be a shortage which caused the app to crash. I'll upload the code as soon as it's fixed.

https://status.cloud.google.com/

[LoSunny]

http://stlouis-cloud.web.app/calendar
There you go

[dongsik-yoo]

@LoYungSum Your sequence of function calls is wrong. Your post API returns ScheduleList data after setSchedules() called. It's asynchronous method problem.

[LoSunny]

Oh. Thanks for the help @dongsik-yoo . But now I get another problem.

Uncaught (in promise) TypeError: end.getTime is not a function
    at Object.range (tui-calendar.js:3085)
    at tui-calendar.js:24942
    at forEachArray (tui-code-snippet.js:947)
    at Object.forEach (tui-code-snippet.js:1024)
    at tui-calendar.js:24933
    at forEachArray (tui-code-snippet.js:947)
    at Object.forEach (tui-code-snippet.js:1024)
    at tui-calendar.js:24932
    at forEachArray (tui-code-snippet.js:947)
    at Object.forEach (tui-code-snippet.js:1024)

The error occurs when I switch a month (From Nov -> Oct)

[stale]

This issue has been automatically marked as inactive because there hasn’t been much going on it lately. It is going to be closed after 7 days. Thanks!

[stale]

This issue will be closed due to inactivity. Thanks for your contribution!