toggle + menù app
This commit is contained in:
@@ -1,12 +1,20 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue';
|
import { ref, watch } from 'vue';
|
||||||
|
|
||||||
import { UserPrefStore } from '../stores/UserPrefStore.js';
|
import { UserPrefStore } from '../stores/UserPrefStore.js';
|
||||||
import AppMenuItem from './AppMenuItem.vue';
|
import AppMenuItem from './AppMenuItem.vue';
|
||||||
|
|
||||||
const userPrefStore = UserPrefStore();
|
const userPrefStore = UserPrefStore();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const model = ref([
|
const model = ref([
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
items: []
|
||||||
|
//items: [{ label: 'ATF-Notifier', icon: 'pi pi-fw pi-id-card', to: '/app-browser' }]
|
||||||
|
} ,
|
||||||
{
|
{
|
||||||
label: 'Scenarios',
|
label: 'Scenarios',
|
||||||
items: [
|
items: [
|
||||||
@@ -16,12 +24,38 @@ const model = ref([
|
|||||||
}, {
|
}, {
|
||||||
label: 'Canvas',
|
label: 'Canvas',
|
||||||
items: [{ label: 'New Canvas', icon: 'pi pi-fw pi-id-card', to: '/mdcanvas' }]
|
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>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -1,9 +1,19 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
|
import { onMounted } from 'vue';
|
||||||
|
import { UserPrefStore } from '../stores/UserPrefStore.js';
|
||||||
import AppMenu from './AppMenu.vue';
|
import AppMenu from './AppMenu.vue';
|
||||||
|
const userPrefStore = UserPrefStore();
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
userPrefStore.fetchUserData();
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<app-menu></app-menu>
|
<div v-if="userPrefStore.userLoaded">
|
||||||
|
<app-menu></app-menu>
|
||||||
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|||||||
@@ -13,5 +13,9 @@ export const ScenarioService = {
|
|||||||
return axios.post('/scenariosByApp' , app)
|
return axios.post('/scenariosByApp' , app)
|
||||||
|
|
||||||
},
|
},
|
||||||
|
getScenariosCross() {
|
||||||
|
return axios.get('/scenariosCross')
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -12,6 +12,7 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
|||||||
const applicationScenarios = ref([])
|
const applicationScenarios = ref([])
|
||||||
const filterString = ref('')
|
const filterString = ref('')
|
||||||
const allScenarios = ref([])
|
const allScenarios = ref([])
|
||||||
|
const typeFilter = ref('all')
|
||||||
|
|
||||||
const userPrefStore = UserPrefStore()
|
const userPrefStore = UserPrefStore()
|
||||||
const loadingStore = LoadingStore()
|
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() {
|
async function fetchApplicationScenarios() {
|
||||||
loadingStore.scenario_loading = true;
|
loadingStore.scenario_loading = true;
|
||||||
@@ -46,7 +57,22 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
|||||||
|
|
||||||
const filteredScenarios = computed(() => {
|
const filteredScenarios = computed(() => {
|
||||||
console.log("scenarios", allScenarios.value);
|
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
|
return filterString.value
|
||||||
.toLowerCase()
|
.toLowerCase()
|
||||||
.split(" ")
|
.split(" ")
|
||||||
@@ -61,5 +87,5 @@ export const ScenarioStore = defineStore('scenario_store', () => {
|
|||||||
fetchScenarios,
|
fetchScenarios,
|
||||||
fetchApplicationScenarios,
|
fetchApplicationScenarios,
|
||||||
scenarios,
|
scenarios,
|
||||||
filterString }
|
filterString , typeFilter, fetchScenariosCross, globalScenarios}
|
||||||
})
|
})
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
||||||
import { defineStore } from 'pinia';
|
import { defineStore } from 'pinia';
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
import { ProjectService } from '../service/ProjectService';
|
||||||
import { LoadingStore } from './LoadingStore';
|
import { LoadingStore } from './LoadingStore';
|
||||||
|
|
||||||
export const UserPrefStore = defineStore('userpref_store', () => {
|
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){
|
function setSelectedApp(app){
|
||||||
selectedApp.value = app;
|
selectedApp.value = app;
|
||||||
}
|
}
|
||||||
|
|
||||||
const selectedProject = computed(() => user.value.selectedProject)
|
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 []
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const getSelApp = computed(() => {
|
||||||
|
return selectedApp.value
|
||||||
return { user,fetchUserData,userLoaded,selectedProject,availableApp,setSelectedApp,selectedApp }
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return { user,fetchUserData,userLoaded,selectedProject,availableApp,getSelApp,setSelectedApp,selectedApp, updateSelectedProject }
|
||||||
})
|
})
|
||||||
@@ -72,13 +72,16 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ChevronRightIcon } from '@heroicons/vue/24/solid';
|
import { ChevronRightIcon } from '@heroicons/vue/24/solid';
|
||||||
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
import { useAuth } from '@websanova/vue-auth/src/v3.js';
|
||||||
import axios from 'axios';
|
|
||||||
import DataView from 'primevue/dataview';
|
import DataView from 'primevue/dataview';
|
||||||
import ProgressSpinner from 'primevue/progressspinner';
|
import ProgressSpinner from 'primevue/progressspinner';
|
||||||
import { computed, onMounted, reactive, ref } from 'vue';
|
import { computed, onMounted, reactive, ref } from 'vue';
|
||||||
import { useRouter } from 'vue-router';
|
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 auth = useAuth();
|
||||||
const user = computed(() => auth.user());
|
const user = computed(() => auth.user());
|
||||||
|
|
||||||
@@ -89,15 +92,8 @@ const user = computed(() => auth.user());
|
|||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
console.log("user:", user);
|
|
||||||
//loading.value = true
|
|
||||||
|
|
||||||
data.projects = user.value.lstProjects;
|
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) => {
|
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' });
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Errore nel cambio progetto:', error);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
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);
|
|
||||||
|
|
||||||
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' });
|
|
||||||
}
|
}
|
||||||
|
|
||||||
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>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|||||||
@@ -17,6 +17,11 @@
|
|||||||
variant="filled"
|
variant="filled"
|
||||||
/>
|
/>
|
||||||
</div>
|
</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">
|
<SelectButton v-model="layout" :options="options" :allowEmpty="false" class="layout-switch">
|
||||||
<template #option="{ option }">
|
<template #option="{ option }">
|
||||||
<i :class="[option === 'list' ? 'pi pi-bars' : 'pi pi-table']" />
|
<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 { onMounted, ref } from 'vue';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { ScenarioStore } from '../../stores/ScenarioStore.js';
|
import { ScenarioStore } from '../../stores/ScenarioStore.js';
|
||||||
|
import { UserPrefStore } from '../../stores/UserPrefStore.js';
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const layout = ref('grid');
|
const layout = ref('grid');
|
||||||
const options = ref(['list', 'grid']);
|
const options = ref(['list', 'grid']);
|
||||||
|
|
||||||
const scenario_store = ScenarioStore();
|
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(() => {
|
onMounted(() => {
|
||||||
scenario_store.fetchScenarios();
|
userPrefStore.fetchUserData().then(() => {
|
||||||
|
|
||||||
|
scenario_store.fetchScenarios();
|
||||||
|
scenario_store.fetchScenariosCross();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const executeScenario = (id) => {
|
const executeScenario = (id) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user