toggle + menù app
This commit is contained in:
@@ -1,12 +1,20 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, watch } from 'vue';
|
||||
|
||||
import { UserPrefStore } from '../stores/UserPrefStore.js';
|
||||
import AppMenuItem from './AppMenuItem.vue';
|
||||
|
||||
const userPrefStore = UserPrefStore();
|
||||
|
||||
|
||||
|
||||
|
||||
const model = ref([
|
||||
{
|
||||
label: '',
|
||||
items: []
|
||||
//items: [{ label: 'ATF-Notifier', icon: 'pi pi-fw pi-id-card', to: '/app-browser' }]
|
||||
} ,
|
||||
{
|
||||
label: 'Scenarios',
|
||||
items: [
|
||||
@@ -16,12 +24,38 @@ const model = ref([
|
||||
}, {
|
||||
label: 'Canvas',
|
||||
items: [{ label: 'New Canvas', icon: 'pi pi-fw pi-id-card', to: '/mdcanvas' }]
|
||||
},{
|
||||
label: 'Your Applications',
|
||||
items: [{ label: 'ATF-Notifier', icon: 'pi pi-fw pi-id-card', to: '/app-browser' }]
|
||||
}
|
||||
|
||||
]);
|
||||
|
||||
// Funzione per aggiornare la sezione "Your Applications" in base a selectedApp
|
||||
function updateApplicationsMenu() {
|
||||
const selectedApp = userPrefStore.getSelApp;
|
||||
console.log("selectedApp", selectedApp);
|
||||
|
||||
if (selectedApp!=null) {
|
||||
// Se selectedApp non è nullo, aggiorna gli item
|
||||
model.value[0].label = selectedApp.fe_name;
|
||||
|
||||
// Aggiorna gli item dell'app selezionata
|
||||
model.value[0].items = [
|
||||
{ label: 'Rev Eng Code', icon: 'pi pi-fw pi-id-card', to: '/app-browser' }
|
||||
];
|
||||
|
||||
selectedApp.available_scenarios.forEach(app => {
|
||||
model.value[0].items.push({ label: app.label, icon: 'pi pi-fw pi-id-card', to: `/scenario/exec/${app.scenario_id}` });
|
||||
});
|
||||
|
||||
} else {
|
||||
// Se selectedApp è nullo, svuota gli item
|
||||
model.value[0].label = '';
|
||||
model.value[0].items = [];
|
||||
}
|
||||
}
|
||||
|
||||
// Monitora i cambiamenti in selectedApp dallo store
|
||||
watch(() => userPrefStore.getSelApp, updateApplicationsMenu, { immediate: true });
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -1,9 +1,19 @@
|
||||
<script setup>
|
||||
import { onMounted } from 'vue';
|
||||
import { UserPrefStore } from '../stores/UserPrefStore.js';
|
||||
import AppMenu from './AppMenu.vue';
|
||||
const userPrefStore = UserPrefStore();
|
||||
|
||||
onMounted(() => {
|
||||
userPrefStore.fetchUserData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="userPrefStore.userLoaded">
|
||||
<app-menu></app-menu>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
@@ -13,5 +13,9 @@ export const ScenarioService = {
|
||||
return axios.post('/scenariosByApp' , app)
|
||||
|
||||
},
|
||||
getScenariosCross() {
|
||||
return axios.get('/scenariosCross')
|
||||
|
||||
},
|
||||
|
||||
}
|
||||
@@ -12,6 +12,7 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
||||
const applicationScenarios = ref([])
|
||||
const filterString = ref('')
|
||||
const allScenarios = ref([])
|
||||
const typeFilter = ref('all')
|
||||
|
||||
const userPrefStore = UserPrefStore()
|
||||
const loadingStore = LoadingStore()
|
||||
@@ -27,6 +28,16 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
||||
|
||||
}
|
||||
|
||||
async function fetchScenariosCross() {
|
||||
loadingStore.scenario_loading = true;
|
||||
await ScenarioService.getScenariosCross().then(resp => {
|
||||
globalScenarios.value = resp.data;
|
||||
allScenarios.value = [...globalScenarios.value]
|
||||
loadingStore.scenario_loading = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
async function fetchApplicationScenarios() {
|
||||
loadingStore.scenario_loading = true;
|
||||
@@ -46,7 +57,22 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
||||
|
||||
const filteredScenarios = computed(() => {
|
||||
console.log("scenarios", allScenarios.value);
|
||||
return allScenarios.value.filter((item) => {
|
||||
var filteredScenario = []
|
||||
|
||||
if(typeFilter.value.value === 'all') {
|
||||
filteredScenario = [...projectScenarios.value, ...applicationScenarios.value, ...globalScenarios.value]
|
||||
}
|
||||
if(typeFilter.value.value === 'project') {
|
||||
filteredScenario = [...projectScenarios.value]
|
||||
}
|
||||
if(typeFilter.value.value === 'application') {
|
||||
filteredScenario = [...applicationScenarios.value]
|
||||
}
|
||||
if(typeFilter.value.value === 'cross') {
|
||||
filteredScenario = [...globalScenarios.value]
|
||||
}
|
||||
|
||||
return filteredScenario.filter((item) => {
|
||||
return filterString.value
|
||||
.toLowerCase()
|
||||
.split(" ")
|
||||
@@ -61,5 +87,5 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
||||
fetchScenarios,
|
||||
fetchApplicationScenarios,
|
||||
scenarios,
|
||||
filterString }
|
||||
filterString , typeFilter, fetchScenariosCross, globalScenarios}
|
||||
})
|
||||
@@ -1,6 +1,7 @@
|
||||
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
||||
import { defineStore } from 'pinia';
|
||||
import { computed, ref } from 'vue';
|
||||
import { ProjectService } from '../service/ProjectService';
|
||||
import { LoadingStore } from './LoadingStore';
|
||||
|
||||
export const UserPrefStore = defineStore('userpref_store', () => {
|
||||
@@ -24,14 +25,43 @@ export const UserPrefStore = defineStore('userpref_store', () => {
|
||||
});
|
||||
};
|
||||
|
||||
async function updateSelectedProject(project) {
|
||||
try {
|
||||
loadingStore.user_loading = true;
|
||||
|
||||
// Aspetta che l'aggiornamento del progetto finisca
|
||||
await ProjectService.updateSelectedProject(project);
|
||||
|
||||
} catch (error) {
|
||||
console.error("Errore durante l'aggiornamento del progetto:", error);
|
||||
} finally {
|
||||
// Assicurati che il caricamento venga disabilitato anche in caso di errore
|
||||
loadingStore.user_loading = false;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
function setSelectedApp(app){
|
||||
selectedApp.value = app;
|
||||
}
|
||||
|
||||
const selectedProject = computed(() => user.value.selectedProject)
|
||||
const availableApp = computed(() => user.value.selectedProject.lstApplications)
|
||||
//const availableApp = computed(() => user.value.selectedProject.lstApplications)
|
||||
const availableApp = computed(() => {
|
||||
if (user.value.selectedProject!=null) {
|
||||
return user.value.selectedProject.lstApplications
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
return { user,fetchUserData,userLoaded,selectedProject,availableApp,setSelectedApp,selectedApp }
|
||||
const getSelApp = computed(() => {
|
||||
return selectedApp.value
|
||||
})
|
||||
|
||||
|
||||
|
||||
return { user,fetchUserData,userLoaded,selectedProject,availableApp,getSelApp,setSelectedApp,selectedApp, updateSelectedProject }
|
||||
})
|
||||
@@ -72,13 +72,16 @@
|
||||
<script setup>
|
||||
import { ChevronRightIcon } from '@heroicons/vue/24/solid';
|
||||
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
||||
import axios from 'axios';
|
||||
import DataView from 'primevue/dataview';
|
||||
import ProgressSpinner from 'primevue/progressspinner';
|
||||
import { computed, onMounted, reactive, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { ProjectService } from '../../service/ProjectService.js';
|
||||
import { LoadingStore } from '../../stores/LoadingStore.js';
|
||||
import { UserPrefStore } from '../../stores/UserPrefStore.js';
|
||||
|
||||
|
||||
const loadingStore = LoadingStore()
|
||||
const userPrefStore = UserPrefStore();
|
||||
const auth = useAuth();
|
||||
const user = computed(() => auth.user());
|
||||
|
||||
@@ -89,15 +92,8 @@ const user = computed(() => auth.user());
|
||||
const loading = ref(false)
|
||||
|
||||
onMounted(() => {
|
||||
console.log("user:", user);
|
||||
//loading.value = true
|
||||
|
||||
data.projects = user.value.lstProjects;
|
||||
/* ProjectService.getUserProjects().then(resp=>{
|
||||
data.projects = resp.data
|
||||
console.log("data projects", data.projects);
|
||||
loading.value = false
|
||||
})*/
|
||||
|
||||
});
|
||||
|
||||
@@ -122,48 +118,20 @@ const user = computed(() => auth.user());
|
||||
}
|
||||
});
|
||||
|
||||
const openProject = (project) => {
|
||||
|
||||
console.log("id item", project);
|
||||
ProjectService.updateSelectedProject(project).then(resp=>{
|
||||
//data.projects = resp.data
|
||||
console.info("data selected " + resp.data);
|
||||
|
||||
//auth.fetch();
|
||||
//console.log(auth.user);
|
||||
const openProject = async (project) => {
|
||||
try {
|
||||
// Esegui l'update del progetto
|
||||
await userPrefStore.updateSelectedProject(project);
|
||||
console.log('Progetto aggiornato e dati utente ricaricati');
|
||||
|
||||
router.push({ name: 'scenario-list' });
|
||||
|
||||
});
|
||||
console.log("user before:", user.value);
|
||||
|
||||
/* try {
|
||||
const response = axios.get('api/auth/fetch-user');
|
||||
console.log("Resp fetch: ", response.data);
|
||||
console.log("auth", auth);
|
||||
|
||||
auth.setUser(response.data); // Aggiorna l'oggetto utente locale
|
||||
} catch (error) {
|
||||
console.error('Errore durante il recupero dei dati utente', error);
|
||||
}*/
|
||||
|
||||
//params: { selProject: project }
|
||||
//router.push({ name: 'scenario-list' });
|
||||
console.error('Errore nel cambio progetto:', error);
|
||||
}
|
||||
|
||||
const fetchUserData = async () => {
|
||||
try {
|
||||
const response = await axios.get('api/auth/fetch-user');
|
||||
const fetchedUser = response.data.data;
|
||||
// Aggiorna le informazioni dell'utente in auth
|
||||
//Object.assign(auth.user(), fetchedUser);
|
||||
//user.value = response.data.data; // Aggiorna l'utente con i dati recuperati
|
||||
console.log("fetch response:", response);
|
||||
console.log("user after:", auth.user());
|
||||
} catch (error) {
|
||||
console.error('Error fetching user data:', error);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -17,6 +17,11 @@
|
||||
variant="filled"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="card flex justify-center">
|
||||
<SelectButton v-model="scenario_store.typeFilter" :options="scenarioTypeOp" optionLabel="name" />
|
||||
</div>
|
||||
|
||||
<SelectButton v-model="layout" :options="options" :allowEmpty="false" class="layout-switch">
|
||||
<template #option="{ option }">
|
||||
<i :class="[option === 'list' ? 'pi pi-bars' : 'pi pi-table']" />
|
||||
@@ -72,15 +77,30 @@ import DataView from 'primevue/dataview';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { ScenarioStore } from '../../stores/ScenarioStore.js';
|
||||
import { UserPrefStore } from '../../stores/UserPrefStore.js';
|
||||
|
||||
const router = useRouter()
|
||||
const layout = ref('grid');
|
||||
const options = ref(['list', 'grid']);
|
||||
|
||||
const scenario_store = ScenarioStore();
|
||||
const userPrefStore = UserPrefStore();
|
||||
|
||||
const scenarioTypeOp = ref([
|
||||
{ name: 'All', value: 'all' },
|
||||
{ name: 'Croos', value: 'cross' },
|
||||
{ name: 'Project', value: 'project' },
|
||||
{ name: 'Application', value: 'application' }
|
||||
|
||||
]);
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
userPrefStore.fetchUserData().then(() => {
|
||||
|
||||
scenario_store.fetchScenarios();
|
||||
scenario_store.fetchScenariosCross();
|
||||
});
|
||||
});
|
||||
|
||||
const executeScenario = (id) => {
|
||||
|
||||
Reference in New Issue
Block a user