Our powerful JS Calendar component


Post by lanpeng »

Hi bryntum team
I am using resourceView in calendar .I set 'dayview' and 'weekview' for it. It can not show data when i swtich mode to 'dayview'. You can reproduce it in your demo ResourceView
https://bryntum.com/examples/calendar/resourceview/


Post by marcio »

Hi,

I couldn't reproduce the behavior that you described. I attached a video of our demo with that view configuration working just fine in our demo.

Which version are you using?

Could you share the changes that you've made in the configuration, please?

I'm sharing also my modes property configuration, for you to check what I did to have that dayview working.

modes : {
        // Let's not show the default views
        day    : null,
        week   : null,
        month  : null,
        year   : null,
        agenda : null,

    // Mode name can be anything if it contains a "type" property.
    weekResources : {
        // Type has the final say over which view type is created
        type               : 'resource',
        title              : 'Week',
        // Specify how wide each resource panel should be
        resourceWidth      : '30em',
        hideNonWorkingDays : true,

        // This is a config object for the subviews
        view : {
            dayStartTime : 8,
            // Dock an additional widget at the end of the header
            strips       : {
                // A simple widget showing location, temperature and a weather icon for each resource
                resourceInfo : {
                    type : 'widget',
                    dock : 'header',
                    cls  : 'b-resource-location',
                    // This method gets called when the panel is created and we return some meta data about the
                    // resource, like weather and city
                    html() {
                        const resource = this.up('weekview').resource;

                        return StringHelper.xss`
                            <span class="weather">${resource.weather}</span>
                            <div class="location">
                                <span class="city">${resource.city}</span>
                                <span>${resource.temperature}F°</span>
                            </div>`;
                    }
                }
            },
            // Show a close icon to filter out the resource
            tools : {
                close : {
                    cls     : 'b-fa b-fa-times',
                    tooltip : 'Filter out this resource',
                    handler() {
                        const
                            calendar       = this.up('calendar'),
                            resourceFilter = calendar.widgetMap.resourceFilter,
                            resource       = this.resource;

                        resourceFilter.selected.remove(resource);
                    }
                }
            }
        },

        // Info to display below a resource name
        meta : resource => resource.title
    },
    monthResources : {
        type               : 'resource',
        title              : 'Month',
        resourceWidth      : '30em',
        hideNonWorkingDays : true,

        view : {
            type : 'monthview'
        },

        meta : resource => resource.title
    },
    dayResources : {
        type               : 'resource',
        title              : 'day',
        resourceWidth      : '30em',
        hideNonWorkingDays : true,

        view : {
            type : 'dayview'
        },

        meta : resource => resource.title
    }
}
Attachments
Bryntum Calendar - ResourceView demo - 1 July 2022.mp4
(1.65 MiB) Downloaded 38 times

Best regards,
Márcio


Post by lanpeng »

Hi Marcio
I am using calendar version is 4.3.3
The demo you provieded looks like ok. But there was some problem when i used it .I would told you the scene where I use it. you may help me find the mistake.
I load the data of a new time period in the event of datechange according to the user switching time.

this.calendar.project.loadInlineData({
        eventsData:totalData,
        resourcesData:this.resourceGroup
      })

I use three different resourceViews to display data in the calendar. dayview weekview and monthview .I provided a screenshot. Which view is placed first, it will not display data. The other two are ok.

Attachments
屏幕截图 2022-07-04 095705.png
屏幕截图 2022-07-04 095705.png (55.26 KiB) Viewed 372 times

Post by marcio »

Hey,

Could you please share a sample project with your current configuration and some sample data that you're using?? In the screenshot that you shared, the configuration is working ok for me here, so probably there is something in another part of the code causing the issue. With the sample project, I could assist you better.

Best regards,
Márcio


Post Reply