admin/hermione-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upate rating

Browse Source
This commit is contained in:
Florinda
2024-12-17 11:20:04 +01:00
parent 559b595f33
commit 064abb6d04
3 changed files with 109 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
src/views/pages/OldScenarioExec.vue
View File

@@ -33,8 +33,29 @@
<template #header>
<div class="flex items-center gap-2">
<span class="font-bold">Execution Input for ID {{execution_id}}</span>
<div v-if="rating!=null" class="flex justify-end">
<Rating
:modelValue="rating"
:stars="5"
:readonly="true"
/>
</div>
<div v-else class="flex justify-end">
<Rating
:modelValue="rating"
:stars="5"
@change="updateRating($event)"
/>
</div>
</div>
</template>
<div class="box p-4 border rounded-md shadow-sm" style="background-color: white;">
<div v-for="(input, index) in inputs" :key="index" class="input-container">
<div class="input-wrapper">
@@ -91,8 +112,10 @@ import JsonEditorVue from 'json-editor-vue';
import { MdPreview } from 'md-editor-v3';
import 'md-editor-v3/lib/style.css';
import ProgressSpinner from 'primevue/progressspinner';
import { useToast } from 'primevue/usetoast';
import { onMounted, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { ScenarioService } from '../../service/ScenarioService.js';
import { ScenarioExecutionStore } from '../../stores/ScenarioExecutionStore.js';
const router = useRouter();
@@ -107,10 +130,12 @@ const formData = ref({});
const exec_id = ref(null);
const exec_scenario = ref({});
const debug_modal = ref(false);
const rating = ref(null);
const scenario_execution_store = ScenarioExecutionStore();
const execution = scenario_execution_store.getSelectedExecScenario;
const execution_id = ref(null)
const inputs = ref(null);
const toast = useToast();
onMounted(() => {
@@ -136,12 +161,46 @@ const retrieveScenarioExec = (id) => {
scenario.value = response.data.scenario
exec_scenario.value = response.data
data_loaded.value = true;
rating.value = response.data.rating
scenario_output.value = response.data.execSharedMap.scenario_output;
exec_id.value = response.data.scenarioExecution_id
inputs.value = response.data.scenarioExecutionInput.inputs
});
};
async function updateRating(newRating) {
loading_data.value = true;
ScenarioService.updateScenarioExecRating(execution_id.value,newRating.value).then((response) => {
console.log('response:', response);
if (response.data === "OK") {
rating.value = newRating.value;
console.log('Rating aggiornato con successo:', response.data);
toast.add({
severity: 'success', // Tipo di notifica (successo)
summary: 'Successo', // Titolo della notifica
detail: 'Rating updated with success.', // Messaggio dettagliato
life: 3000 // Durata della notifica in millisecondi
});
} else {
console.error('Errore nell\'aggiornamento del rating', response.data);
toast.add({
severity: 'error', // Tipo di notifica (errore)
summary: 'Errore', // Titolo della notifica
detail: 'Error updating rating. Try later.', // Messaggio dettagliato
life: 3000 // Durata della notifica in millisecondi
});
}
}).catch((error) => {
console.error('Errore durante la chiamata al backend:', error);
}).finally(() => {
loading_data.value = false;
});
}

49
src/views/pages/ScenarioExec.vue
View File

@@ -71,8 +71,18 @@
<div class="flex items-center gap-2">
<span class="font-bold">Workflow Response</span>
</div>
<div>
<Rating
:modelValue="rating"
:stars="5"
@change="updateRating($event)"
/>
</div>
</template>
<template #icons>
<div class="flex justify-end">
<Button severity="secondary" rounded @click="openDebug" v-tooltip.left="'View code'">
<i class="pi pi-code"></i>
@@ -111,20 +121,24 @@ import axios from 'axios';
import JsonEditorVue from 'json-editor-vue';
import { MdPreview } from 'md-editor-v3';
import 'md-editor-v3/lib/style.css';
import moment from 'moment';
import InputText from 'primevue/inputtext';
import Select from 'primevue/select';
import Textarea from 'primevue/textarea';
import { useToast } from 'primevue/usetoast';
import { computed, onMounted, ref, watch } from 'vue';
import moment from 'moment';
import { useRoute, useRouter } from 'vue-router';
import { JellyfishLoader } from "vue3-spinner";
import { ScenarioService } from '../../service/ScenarioService';
const loadingStore = LoadingStore();
const toast = useToast();
const router = useRouter();
const route = useRoute();
const value = ref('');
const rating = ref(0);
const scenario = ref({});
const scenario_response = ref(null);
const scenario_output = ref(null);
@@ -205,7 +219,6 @@ watch(() => route.params.id, fetchScenario);
return InputText;
}
};
const execScenario = () => {
loading_data.value = true;
@@ -286,6 +299,36 @@ watch(() => route.params.id, fetchScenario);
console.log("Polling stopped.");
}
async function updateRating(newRating) {
ScenarioService.updateScenarioExecRating(exec_id.value,newRating.value).then((response) => {
console.log('response:', response);
if (response.data === "OK") {
rating.value = newRating.value;
console.log('Rating aggiornato con successo:', response.data);
toast.add({
severity: 'success', // Tipo di notifica (successo)
summary: 'Successo', // Titolo della notifica
detail: 'Rating updated with success.', // Messaggio dettagliato
life: 3000 // Durata della notifica in millisecondi
});
} else {
console.error('Errore nell\'aggiornamento del rating', response.data);
toast.add({
severity: 'error', // Tipo di notifica (errore)
summary: 'Errore', // Titolo della notifica
detail: 'Error updating rating. Try later.', // Messaggio dettagliato
life: 3000 // Durata della notifica in millisecondi
});
}
}).catch((error) => {
console.error('Errore durante la chiamata al backend:', error);
})
}
</script>
<style scoped>

38
src/views/pages/ScenarioExecList.vue
View File

@@ -100,19 +100,7 @@
/>
</template>
</Column>
<Column field="endDate"
header="End Date" sortable
style="min-width: 12rem">
<template #body="slotProps">
<div class="flex items-center gap-2">
{{ moment(slotProps.data.endDate).format('DD-MM-YYYY HH:mm:ss') }}
</div>
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by File" />
</template>
</Column>
<Column field="scenario.aiModel.apiProvider" header="Model AI" sortable
style="min-width: 12rem">
<template #body="slotProps">
@@ -149,21 +137,10 @@
placeholder="Search by File" />
</template>
</Column>
<Column filterField="outputTypeFilter" header="Output Type" sortable
style="min-width: 12rem">
<template #body="slotProps">
<div class="flex items-center gap-2">
{{ slotProps.data.scenario?.outputType || 'text' }}
</div>
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by File" />
</template>
</Column>
<Column field="rating" header="Rating">
<template #body="slotProps">
<Rating :modelValue="slotProps.data.rating" :stars="5" @change="updateRating(slotProps.data, $event)" />
<Rating :modelValue="slotProps.data.rating" :stars="5" :readonly="true" />
</template>
</Column>
<Column field="id" :style="{ position: 'sticky', right: '0', zIndex: '1', background: '#f3f3f3'}">
@@ -248,17 +225,10 @@ const filters = ref({
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.CONTAINS }]
},
outputTypeFilter: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.CONTAINS }]
},
'startDate': {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
},
'endDate': {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
}
});