Fullcalendar добавить изображение только в 1 столбец ресурса - PullRequest
0 голосов
/ 11 февраля 2019

Fullcalendar отлично, и я могу добавить изображение к resourceObject с помощью обратного вызова resourceRender.Я использую календарь на основе демонстрации группирования ресурсов.https://fullcalendar.io/docs/v4/resourceColumns-grouping-demo

Но проблема в том, что я хочу добавить изображение только в 3-й столбец - Занятость, но не в первый 2.

Когда я добавляю следующий код, он добавляет изображениедля всех столбцов, а не только для столбца занятости.

resourceRender: function(resourceObj, labelTds, bodyTds) {
   labelTds.append(
     '<div style="text-align:center">' + 
     '<img src="../../images/icon.png" width="30" height="30">' +                    
     '</div>'
    };
},

Может кто-нибудь подсказать, как это сделать только с элементом tcc Occupancy?

1 Ответ

0 голосов
/ 11 февраля 2019

Нашел это.Во-первых, как предложил Джон, добавьте дополнительные ресурсы в resourceObj, чтобы вы могли выбрать, какие строки также добавлять изображения.Затем используйте функции списка jQuery для перебора массива labelTds, чтобы добавить изображение в нужный элемент td в массиве labelTds.В этом примере последняя строка - Occupancy была элементом td, который нужно заменить изображением.Кроме того, вы можете добавить в изображение javascript «onclick» для выполнения дополнительных действий.

Пример кода ниже.

resourceRender: function(resourceObj, labelTds, bodyTds) {
    if(resourceObj.roomtype != 'Manage' ) {
        var roomid = resourceObj.id;
        var roomno = resourceObj.roomno;
        var msg = 'Peform some action on '+roomno+' ?';
        if(resourceObj.roomstatus == 'C') {
            labelTds.last().empty();
            labelTds.last().append(
                '<div style="text-align:center">' +
                '<img src="../../images/image1.png" width="20" height="20" onclick="confirm(\''+msg+'\');">' +
                '</div>'
            );
        };
        if(resourceObj.roomstatus == 'L') {
            labelTds.last().empty();
            labelTds.last().append(
                '<div style="text-align:center">' +
                '<img src="../../images/image2.png" width="20" height="20">' +
                '</div>'
            );
        };
    };
},
...