App.vue

<template>
  <div :class="$route.name">
    <div v-if="isUnauthorizedIframe">
      {{ $t('iframe_forbid_message') }}
    </div>
    <div v-if="!isUnauthorizedIframe" class="d-flex">
      <alerts-layer />
      <generic-loader />
      <Navbar v-if="showGlobalModule" />
      <DashboardModule v-if="showGlobalModule" />
      <SettingsModule v-if="showGlobalModule" />

      <!-- @TODO: Refactor/Move to a less centralized place (Used by Location - Identification tab -> Table) -->
      <location-ident-modal :is-open="isIdentBacModalOpen" />

      <b-alert
        v-if="isPrivateMode"
        variant="warning"
        style="margin: 0 auto"
        show
        v-text="$t('error.browser_private_mode')"
      />

      <router-view :key="$route.path" class="router_view d-relative" />

      <portal-target name="MapToolboxPortalTarget"> </portal-target>
      <portal-target name="modal"> </portal-target>
      <MapContextMenu />
      <Toast />
    </div>
  </div>
</template>

<script>
import Navbar from '@/components/shared/Navbar'
import AlertsLayer from '@/components/shared/AlertsLayer'
import GenericLoader from '@/components/shared/GenericLoader'
import detectIframe from './mixins/detectIframe'
import LayoutModesMixin from '@c/location/mixins/location-layout-modes.js'
import DashboardModule from '@c/dashboard_module/DashboardModule.vue'
import LocationIdentModal from '@c/location/LocationIdentBacs/modal/LocationIdentModal.vue'
import { mapGetters } from 'vuex'
import SettingsModule from '@c/settings/SetttingsModule/SettingsModule.vue'
import { isPrivateMode } from '@/utils/browser.js'
import MapContextMenu from '@/components/shared/SimplicitiMap/MapContextMenu.vue'
import Toast from '@c/shared/Toast.vue'
/**
 * @description Application entry point
 * @todo Move computed isIdentBacModalOpen somewhere else
 * @namespace components
 * @category core
 * @subcategory bootstrap
 * @module App
 **/
export default {
  name: 'App',
  components: {
    Navbar,
    AlertsLayer,
    GenericLoader,
    DashboardModule,
    LocationIdentModal,
    SettingsModule,
    MapContextMenu,
    Toast,
  },
  mixins: [detectIframe, LayoutModesMixin],
  data() {
    return {
      isPrivateMode: false,
    }
  },
  computed: {
    ...mapGetters({
      isIdentBacModalOpen: 'location_module/isIdentBacModalOpen',
    }),
    applicationLanguage() {
      return this.$store.getters['settings/getParameter']('applicationLanguage')
    },
    showGlobalModule() {
      return !this.isPrivateMode && this.$store.getters['auth/isLogged']
    },
  },
  watch: {
    /***
     * Syncs i18n -> settings state -> current language
     */
    applicationLanguage: {
      handler: function () {
        if (this.applicationLanguage) {
          //console.log('App::Application language', this.applicationLanguage)
          this.$locale = this.applicationLanguage
        }
      },
      immediate: true,
    },
  },
  created() {
    isPrivateMode().then((v) => (this.isPrivateMode = v))
  },
}
</script>
<style lang="scss">
.router_view {
  height: 100%;
}
</style>