Требование зависимости ToastUI Calendar - PullRequest
Новая
       61

Требование зависимости ToastUI Calendar

0 голосов
/ 16 апреля 2020

Я пытался работать с календарем Toast UI, доступным здесь: https://github.com/nhn/tui.calendar Я пытался использовать его через CDN, который требует от нас вставить следующее: 

<link rel="stylesheet" type="text/css" href="https://uicdn.toast.com/tui-calendar/latest/tui-calendar.css" />

<!-- If you use the default popups, use this. -->
<link rel="stylesheet" type="text/css" href="https://uicdn.toast.com/tui.date-picker/latest/tui-date-picker.css" />
<link rel="stylesheet" type="text/css" href="https://uicdn.toast.com/tui.time-picker/latest/tui-time-picker.css" />

<script src="https://uicdn.toast.com/tui.code-snippet/latest/tui-code-snippet.js"></script>
<script src="https://uicdn.toast.com/tui.dom/v3.0.0/tui-dom.js"></script>
<script src="https://uicdn.toast.com/tui.time-picker/latest/tui-time-picker.min.js"></script>
<script src="https://uicdn.toast.com/tui.date-picker/latest/tui-date-picker.min.js"></script>
<script src="https://uicdn.toast.com/tui-calendar/latest/tui-calendar.js"></script>

Когда я Попытавшись создать календарь в моем файле html, я заметил, что в нем отсутствуют некоторые функции, такие как указатель даты, диапазон отображения или даже всплывающее окно планировщика событий. Я также заметил, что они говорят о tui-code-snippet как о зависимости для этого календаря: https://github.com/nhn/tui.calendar# -dependency Однако я не уверен, что именно включить из tui-code-snippet, так как там есть множество функций, и они заявляют, что мы должны импортировать только те функции, которые нам нужны: https://github.com/nhn/tui.code-snippet# -usage

Любая помощь в этом будет принята с благодарностью.

РЕДАКТИРОВАТЬ : Я также добавил следующий файл tui-code-snippet, и это только помогло мне получить календарь для отображения / рендеринга, но все функции по-прежнему отсутствуют: 

<script src="https://uicdn.toast.com/tui.code-snippet/latest/tui-code-snippet.js"></script>

1 Ответ

0 голосов
/ 17 апреля 2020

В коде отсутствуют несколько js ссылок, таких как: 

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
    crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/chance/1.0.13/chance.min.js"></script>

После того, как эти ссылки присоединены, нам просто нужно создать экземпляр tui.calendar и затем опубликовать пользовательские параметры по мере необходимости. Примером такого может быть: 

    <script type="text/javascript">
    var cal, resizeThrottled;
    var useCreationPopup = true;
    var useDetailPopup = true;
    var datePicker, selectedCalendar;

    cal = new tui.Calendar('#calendar', {
    defaultView: 'week',
    useCreationPopup: useCreationPopup,
    useDetailPopup: useDetailPopup,
    calendars: CalendarList,
    template: {
        milestone: function(model) {
            return '<span class="calendar-font-icon ic-milestone-b"></span> <span style="background-color: ' + model.bgColor + '">' + model.title + '</span>';
        },
        allday: function(schedule) {
            return getTimeTemplate(schedule, true);
        },
        time: function(schedule) {
            return getTimeTemplate(schedule, false);
        }
    }
});
</script>

, и он должен нормально загружать календарь и позволять добавлять события в планировщик. Я надеюсь, что это поможет кому-то еще столкнуться с подобной проблемой.

...