profiling + research + download

src/layout/AppTopbar.vue

@@ -2,14 +2,41 @@
 import logo from '@/assets/Apollo_simple_logo.webp';
 import { useLayout } from '@/layout/composables/layout';
 import { useAuth } from '@websanova/vue-auth/src/v3.js';
-import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+import { watch, ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
 //import AppConfigurator from './AppConfigurator.vue';
 import AppProfileMenu from './AppProfileMenu.vue';
+import { UserPrefStore } from '../stores/UserPrefStore.js';
 
 const { onMenuToggle, toggleDarkMode, isDarkTheme } = useLayout();
 const auth = useAuth();
 const logoSrc = ref(logo);
+const userPrefStore = UserPrefStore();
+const router = useRouter();
+const selectedApp = ref(userPrefStore.getSelApp);
+const route = useRoute();
 
+async function updateApplication() {
+    await userPrefStore.setSelectedApp(selectedApp.value);
+
+    // here scenario_store.fetchApplicationScenarios(); 
+
+}
+
+function redirectProject() {
+    router.push({ name: 'projects-list' }); // Specifica il percorso per la pagina "Projects"
+}
+
+function appUpdated() {
+    selectedApp.value = userPrefStore.getSelApp;
+}
+
+const isDropdownDisabled = computed(() => {
+    return route.path === '/projects'
+});
+
+watch(() => userPrefStore.getSelApp, appUpdated, { immediate: true });
 </script>
 
 <template>
@@ -34,6 +61,18 @@ const logoSrc = ref(logo);
                 <button type="button" class="layout-topbar-action" @click="toggleDarkMode">
                     <i :class="['pi', { 'pi-moon': isDarkTheme, 'pi-sun': !isDarkTheme }]"></i>
                 </button>
+
+                <div class="topbar-project">
+                    <button @click="redirectProject()" class="p-button p-button-outlined"
+                        v-tooltip="'Click to change the project'"> {{ userPrefStore.user.selectedProject.fe_name
+                        }}</button>
+                    <!-- <span v-if="userPrefStore.user.selectedProject">
+                         <small>PROJECT:</small> {{ userPrefStore.user.selectedProject.fe_name }}
+                    </span>   -->
+                </div>
+                <Dropdown v-model="selectedApp" :options="userPrefStore.availableApp" optionLabel="fe_name"
+                    placeholder="Select an Application" class="dropdown-list menu-list" @change="updateApplication()"
+                    :disabled="isDropdownDisabled" />
                 <!--div class="relative">
                     <button
                         v-styleclass="{ selector: '@next', enterFromClass: 'hidden', enterActiveClass: 'animate-scalein', leaveToClass: 'hidden', leaveActiveClass: 'animate-fadeout', hideOnOutsideClick: true }"