Compact Calendar

GridMate provides a lightning component GM - Compact calendar to display the Event, Task, or any Objects on the calendar as activities.

In this tutorial, we will configure the GM - Compact calendar component to display Task and Events object on the Calendar.

• Select an Opportunity and edit the page in the Lightning App Builder.

• From components list, drag and drop the component GM - Compact calendar.

• The GM - Calendar component is now ready for configuration in the Lightning App Builder.

• The property values can be configured to tailor the component to the needs of the end-user.

• To perform a quick configuration, populate the properties below:

  • Title : Opportunity Calendar.

  • Custom Icon : standard:task.

  • Json config : See Json config.

Below is the JSON Config configured for the demo

[
    {
        "objectApiName": "Task",
        "dateField": "ActivityDate",
        "fromDateField": "",
        "toDateField": "",
        "iconName": "standard:task",
        "backgroundColor": "",
        "filter": "{\"WhatId\": {\"operator\" : \"=\", \"value\" : \"$recordId\"}}",
        "titleField": "Subject",
        "detailFields": [
            "Description"
        ]
    },
    {
        "objectApiName": "Event",
        "dateField": "ActivityDate",
        "fromDateField": "StartDateTime",
        "toDateField": "EndDateTime",
        "iconName": "standard:event",
        "backgroundColor": "#94baf7",
        "filter": "{\"WhatId\": {\"operator\" : \"=\", \"value\" : \"$recordId\"}}",
        "titleField": "Subject",
        "detailFields": [
            "Description"
        ]
    }
]

Below is a step by step tutorial to configure the GM - Compact Calendar 👇.

GridMate - Compact Calendar