window.parent?.postMessage({
    action: "OpenModule",
        actionData: {
            moduleId: 123
    }
});

"use strict";

import { TrackJS } from "trackjs";
import { createApp, ref, isProxy, toRaw } from "vue";
import axios from "axios";

import {AUTH_LOGOUT, AUTH_REQUEST} from "../../../Core/Scripts/store/mutation-types";
import store from "../../../Core/Scripts/store";

// Import services from the shared folder that you need.
import UsersService from "../../../Core/Scripts/shared/users.service";

// Import any components that you need.
import {DropDownList} from "@progress/kendo-vue-dropdowns";

import "../Scss/Main.scss";

(() => {
    class Main {
        constructor() {
            this.vueApp = null;
            this.appSettings = null;

            // Initialize services from the shared folder that you need.
            this.usersService = new UsersService(this);

            // Fire event on page ready for direct actions
            document.addEventListener("DOMContentLoaded", () => {
                this.onPageReady();
            });
        }

        /**
         * Do things that need to wait until the DOM has been fully loaded.
         */
        onPageReady() {
            const configElement = document.getElementById("vue-config");
            this.appSettings = JSON.parse(configElement.innerHTML);

            if (this.appSettings.trackJsToken) {
                TrackJS.install({
                    token: this.appSettings.trackJsToken
                });
            }

            this.api = axios.create({
                baseURL: this.appSettings.apiBase
            });

            this.api.defaults.headers.common["Authorization"] = `Bearer ${localStorage.getItem("accessToken")}`;

            let stopRetrying = false;
            this.api.interceptors.response.use(undefined, async (error) => {
                return new Promise(async (resolve, reject) => {
                    // Automatically re-authenticate with refresh token if login token expired or logout if that doesn't work or it is otherwise invalid.
                    if (error.response.status === 401 && !stopRetrying) {
                        // If we ever get an unauthorized, logout the user.
                        if (error.response.config.url === "/connect/token") {
                            this.vueApp.$store.dispatch(AUTH_LOGOUT);
                        } else {
                            // Re-authenticate with the refresh token.
                            await this.vueApp.$store.dispatch(AUTH_REQUEST, {gotUnauthorized: true});
                            error.config.headers.Authorization = `Bearer ${localStorage.getItem("accessToken")}`;

                            // Retry the original request.
                            this.api.request(error.config).then(response => {
                                stopRetrying = false;
                                resolve(response);
                            }).catch((newError) => {
                                stopRetrying = true;
                                reject(newError);
                            })
                        }
                    }

                    reject(error);
                });
            });

            this.initVue();
        }

        initVue() {
            this.vueApp = createApp({
                data: () => {
                    return {
                        appSettings: this.appSettings,

                        // Any other settings or data that your module might need.
                    }
                },
                // Add any code that needs to run when the Vue app is created/mounted. See https://vuejs.org/api/options-lifecycle.html for more information.
                async created() {
                },
                async mounted() {
                },
                computed: {
                    // Add any computer properties here. See https://vuejs.org/guide/essentials/computed.html for more information.
                },
                components: {
                    // Add any components here. See https://vuejs.org/guide/essentials/component-basics for more information.
                },
                methods: {
                    // Add any custom methods that your module needs.
                }
            });

            // Let Vue know about our store.
            this.vueApp.use(store);

            // Mount our app to the main HTML element.
            this.vueApp = this.vueApp.mount("#app");
        }
    }

    window.main = new Main();
})();

import { TrackJS } from "trackjs";
import { Wiser } from "../../Base/Scripts/Utils.js";

// Add any kendo components or other scripts that you need here. 
// These are just some examples, remove the ones you don't need:
require("@progress/kendo-ui/js/kendo.notification.js");
require("@progress/kendo-ui/js/kendo.numerictextbox.js");
require("@progress/kendo-ui/js/kendo.dropdownlist.js");
require("@progress/kendo-ui/js/kendo.tabstrip.js");
require("@progress/kendo-ui/js/cultures/kendo.culture.nl-NL.js");
require("@progress/kendo-ui/js/messages/kendo.messages.nl-NL.js");

import "../Scss/Main.scss";

(() => {
    /**
     * Main class.
     */
    class Main {
        /**
         * Initializes a new instance of Main.
         */
        constructor() {
            // Set the Kendo culture.
            kendo.culture("nl-NL");

            // Default settings
            this.settings = {
                tenantId: 0,
                username: "Onbekend"
            };
            
            // Add logged in user access token to default authorization headers for all jQuery ajax requests.
            $.ajaxSetup({
                headers: { "Authorization": `Bearer ${localStorage.getItem("accessToken")}` }
            });

            // Fire event on page ready for direct actions
            $(document).ready(() => {
                this.onPageReady();
            });
        }

        /**
         * Event that will be fired when the page is ready.
         */
        async onPageReady() {
            this.mainLoader = $("#mainLoader");
            this.isLoadedInIframe = window.parent && window.parent.main && window.parent.main.vueApp;

            // Setup processing.
            document.addEventListener("processing.Busy", this.toggleMainLoader.bind(this, true));
            document.addEventListener("processing.Idle", this.toggleMainLoader.bind(this, false));
            
            // Setup any settings from the body element data. These settings are added via the Wiser backend and they take preference.
            Object.assign(this.settings, $("body").data());

            if (this.settings.trackJsToken) {
                TrackJS.install({
                    token: this.settings.trackJsToken
                });
            }
            
            const user = JSON.parse(localStorage.getItem("userData"));
            this.settings.oldStyleUserId = user.oldStyleUserId;
            this.settings.adminAccountLoggedIn = !!user.adminAccountName;
            
            const userData = await Wiser.getLoggedInUserData(this.settings.wiserApiRoot);
            this.settings.userId = userData.encryptedId;
            this.settings.tenantId = userData.encryptedTenantId;
            this.settings.plainUserId = userData.id;
            this.settings.zeroEncrypted = userData.zeroEncrypted;
            this.settings.mainDomain = userData.mainDomain;
            
            this.setupBindings();
            await this.initializeComponents();
            
            this.toggleMainLoader(false);
        }

        /**
         * Setup all basis bindings for this module.
         * Specific bindings (for buttons in certain pop-ups for example) will be set when they are needed.
         */
        setupBindings() {
            document.addEventListener("moduleClosing", (event) => {
                // You can do anything here that needs to happen before closing the module.
                event.detail();
            });
            
            // Add any custom event bindings that you need here.
        }

        /**
         * Shows or hides the main (full screen) loader.
         * @param {boolean} show True to show the loader, false to hide it.
         */
        toggleMainLoader(show) {
            this.mainLoader.toggleClass("loading", show);
        }

        /**
         * Initialize components that are used in the module.
         */
        initializeComponents() {
        }
    }

    // Initialize the Search class and make one instance of it globally available.
    window.main = new Main();
})();