Hii,

Fully Working OWL Component (with service check):

/** @odoo-module **/

import { Component, useState, onMounted, useRef } from "@odoo/owl";

import { registry } from "@web/core/registry";

import { useService } from "@web/core/utils/hooks";

class MSTSalesTrackingReport extends Component {

    setup() {

        this.orm = useService("orm");

        let userId = null;

        try {

            const session = useService("session");

            userId = session?.uid ?? null;

            console.log(userId, "======== Current User ID ========");

        } catch (e) {

            console.warn("Session service not available:", e);

        }

        this.state = useState({

            salesTeams: [],

            allUsers: [],

            salespersons: [],

            accordionData: [],

            userId: userId,

        });

        this.refs = {

            accordion: useRef("accordion"),

        };

        onMounted(async () => {

            try {

                const [allTeams, allUsers] = await Promise.all([

                    this.orm.searchRead("crm.team", [], ["id", "name", "user_id", "member_ids"]),

                    this.orm.searchRead("res.users", [["share", "=", false]], ["id", "name"]),

                ]);

                this.state.allUsers = allUsers;

                const userDetails = await this.orm.searchRead("res.users", [["id", "=", userId]], ["groups_id", "sale_team_id"]);

                const userInfo = userDetails[0] || {};

                const userGroupIds = userInfo.groups_id || [];

                const userTeamId = userInfo.sale_team_id?.[0] || null;

                let teamDomain = [];

                if (userGroupIds.includes("mst_mems_custom_crm.sales_team_access_controls_group_administrator")) {

                    teamDomain = [];

                } else if (userGroupIds.includes("mst_mems_custom_crm.sales_team_access_controls_group_team_leader")) {

                    teamDomain = [["user_id", "=", userId]];

                } else if (userGroupIds.includes("sales_team_access_controls_group_team_member")) {

                    teamDomain = [["member_ids", "in", [userId]]];

                }

                const filteredTeams = await this.orm.searchRead("crm.team", teamDomain, ["id", "name", "user_id", "member_ids"]);

                const $teamFilter = document.getElementById("team_filter");

                if ($teamFilter) {

                    $teamFilter.innerHTML = `<option value="">All Teams</option>`;

                    for (const team of filteredTeams) {

                        const option = document.createElement("option");

                        option.value = team.id;

                        option.textContent = team.name;

                        $teamFilter.appendChild(option);

                    }

                    const defaultTeamId = userTeamId || (filteredTeams.length ? filteredTeams[0].id : null);

                    if (defaultTeamId) {

                        $teamFilter.value = defaultTeamId;

                        $teamFilter.dispatchEvent(new Event("change"));

                        await this.populateSalespersonDropdown(defaultTeamId);

                    }

                    $teamFilter.addEventListener("change", async (event) => {

                        const selectedTeamId = parseInt(event.target.value);

                        if (!selectedTeamId) {

                            this.state.salespersons = allUsers;

                        } else {

                            const selectedTeam = allTeams.find(t => t.id === selectedTeamId);

                            const memberIds = [...(selectedTeam.member_ids || [])];

                            if (selectedTeam.user_id?.[0]) memberIds.push(selectedTeam.user_id[0]);

                            this.state.salespersons = allUsers.filter(u => memberIds.includes(u.id));

                        }

                        await this.populateSalespersonDropdown(selectedTeamId);

                    });

                }

                const $dateFilter = document.getElementById("date_filter");

                if ($dateFilter) {

                    $dateFilter.addEventListener("change", () => {

                        const show = $dateFilter.value === "custom_date";

                        document.getElementById("start_date_container").style.display = show ? "block" : "none";

                        document.getElementById("end_date_container").style.display = show ? "block" : "none";

                    });

                }

                const $applyBtn = document.getElementById("apply_filters");

                if ($applyBtn) {

                    $applyBtn.addEventListener("click", () => this.applyFilters());

                }

                document.addEventListener("click", (house) => {

                    if (ev.target.closest(".open-popup")) {

                        this.onOpenPopup(ev);

                    }

                });

            } catch (error) {

                console.error("Error in MSTSalesTracking setup:", error);

            }

        });

    }

    async populateSalespersonDropdown(teamId) {

        console.log("Populate salesperson for team:", teamId);

    }

    applyFilters() {

        console.log("Applying filters...");

    }

    onOpenPopup(event) {

        console.log("Opening popup...");

    }

}

registry.category("actions").add("mst_sales_tracking_report", MSTSalesTrackingReport);

Make Sure:

1. You have this JS module loaded in your manifest under assets like:

'assets': {

    'web.assets_backend': [

        'your_module_name/static/src/js/mst_sales_tracking_report.js',

    ],

}

The component is used in a proper web.client_action (backend only) if you're using useService.

i hope it is usefull

Hi,

Try the code below.

const userId = this.env.services.user

Hope it helps