Add fieds in the pop over of view calendar

Question

I had a calendar view to my custom model in Odoo V17. I just want to add more field in the calendar pop-up.

This is a part of the xml file who is using for the pop-up (addon web) :

    <t t-name="web.CalendarCommonPopover.body">
    <ul class="list-group list-group-flush">
        <li t-if="date" class="list-group-item">
            <i class="fa fa-fw fa-calendar text-400" />
            <span class="fw-bold ms-2" t-esc="date" /> <small t-if="dateDuration != 'All day'"><b t-esc="dateDuration" /></small>
        </li>
        <li t-if="time" class="list-group-item">
            <i class="fa fa-fw fa-clock-o text-400" />
            <span class="fw-bold ms-2" t-esc="time" /> <small t-if="timeDuration"><b t-esc="`(${timeDuration})`" /></small>
        </li>
    </ul>
    <ul class="list-group list-group-flush o_cw_popover_fields_secondary">
        <Record resModel="props.model.resModel" resId="props.record.id" fields="props.model.fields" activeFields="activeFields" mode="'readonly'" values="props.record.rawRecord" t-slot-scope="slot">
            <t t-foreach="Object.keys(props.model.popoverFieldNodes)" t-as="fieldId" t-key="fieldId">
                <t t-set="fieldInfo" t-value="props.model.popoverFieldNodes[fieldId]"/>
                <t t-if="!isInvisible(fieldInfo, slot.record)">
                    <li class="list-group-item d-flex text-nowrap align-items-center" t-att-class="fieldInfo.attrs.class"  t-att-data-tooltip="getFormattedValue(fieldId, slot.record)">
                        <span class="fw-bold me-2" t-if="!fieldInfo.options.noLabel">
                            <t t-if="fieldInfo.options.icon">
                                <i t-attf-class="fa-fw {{fieldInfo.options.icon}} text-400" />
                            </t>
                            <t t-else="">
                                <t t-esc="fieldInfo.string" />
                            </t>
                        </span>
                        <div class="flex-grow-1 role-container text-truncate">
                            <Field name="fieldInfo.name" class="'w-100'" record="slot.record" fieldInfo="fieldInfo" type="fieldInfo.widget" />
                        </div>
                    </li>
                </t>
            </t>
        </Record>
    </ul>
</t>

As you can see, it foreach -> Object.keys(props.model.popoverFieldNodes) I think, i need to add the customs fields in popoverFieldNodes to show it in the pop-up.

This is the setup method of the js file 'calendar_model' from addon web:

export class CalendarModel extends Model {
setup(params, services) {
    /** @protected */
    this.user = services.user;

    /** @protected */
    this.keepLast = new KeepLast();

    const formViewFromConfig = (this.env.config.views || []).find((view) => view[1] === "form");
    const formViewIdFromConfig = formViewFromConfig ? formViewFromConfig[0] : false;
    const fieldNodes = params.popoverFieldNodes;
    const { activeFields, fields } = extractFieldsFromArchInfo({ fieldNodes }, params.fields);
    this.meta = {
        ...params,
        activeFields,
        fields,
        firstDayOfWeek: (localization.weekStart || 0) % 7,
        formViewId: params.formViewId || formViewIdFromConfig,
    };

    this.data = {
        filters: {},
        filterSections: {},
        hasCreateRight: null,
        range: null,
        records: {},
        unusualDays: [],
    };
}

But i don't understand how to properly add customs fields. I try to pass fields with the search_read in python but i think i need to do something in js to show it next.

Do you have any idea to do it ?

Thank's in advance :)

Answer 1

Just add a view of type calendar to your custom model. An example from Odoo itself for model calendar.event (src click):

<record id="view_calendar_event_calendar" model="ir.ui.view">
    <field name="name">calendar.event.calendar</field>
    <field name="model">calendar.event</field>
    <field name="priority" eval="2"/>
    <field name="arch" type="xml">
        <calendar js_class="attendee_calendar" string="Meetings" banner_route="/onboarding/calendar" date_start="start" date_stop="stop" date_delay="duration" all_day="allday"
            event_open_popup="true"
            event_limit="5"
            quick_create="true"
            quick_create_view_id="%(calendar.view_calendar_event_form_quick_create)d"
            color="partner_ids">
            <field name="location" invisible="not location" options="{'icon': 'fa fa-map-marker'}"/>
            <field name="attendees_count" invisible="1"/>
            <field name="accepted_count" invisible="1"/>
            <field name="declined_count" invisible="1"/>
            <field name="user_can_edit" invisible="1"/>
            <field name="partner_ids" options="{'block': True, 'icon': 'fa fa-users'}"
                    filters="1" widget="many2manyattendeeexpandable" write_model="calendar.filters"
                    write_field="partner_id" filter_field="partner_checked" avatar_field="avatar_128"
            />
            <field name="videocall_location" widget="url" text="Join Video Call" options="{'icon': 'fa fa-lg fa-video-camera'}" invisible="not videocall_location"/>
            <field name="is_highlighted" invisible="1"/>
            <field name="is_organizer_alone" invisible="1"/>
            <field name="display_description" invisible="1"/>
            <field name="description" invisible="not display_description" options="{'icon': 'fa fa-bars'}"/>
            <field name="privacy" invisible="1"/>
            <field name="res_model_name" invisible="not res_model_name"
                    options="{'icon': 'fa fa-link', 'shouldOpenRecord': true}"/>
            <field name="alarm_ids" invisible="not alarm_ids" options="{'icon': 'fa fa-bell-o'}"/>
            <field name="categ_ids" invisible="not categ_ids" options="{'icon': 'fa fa-tag', 'color_field': 'color'}"/>
            <!-- For recurrence update Dialog -->
            <field name="recurrency" invisible="1"/>
            <field name="recurrence_update" invisible="1"/>
            <field name="partner_id" string="Organizer" options="{'icon': 'fa fa-user-o'}"/>
        </calendar>
    </field>
</record>

Keep in mind, that the example is very complex. Start with a simple one.