add question evaluation

server/src/app/api/v1/metrics.py

@@ -1,12 +1,11 @@
 from fastapi import APIRouter
 
 from src.app.models.metric import Metric
-from src.app.models.question import Question
 from src.app.crud.crud_metrics import create_metric
 
 router = APIRouter(tags=["metrics"])
 
 @router.post("/metrics/")
-def create(question: Question):
-    created_metric: Metric = create_metric(question)
+def create(metric: Metric):
+    created_metric: Metric = create_metric(metric)
     return created_metric

user-interface/src/components/CollectKnowledge.vue

@@ -4,6 +4,11 @@
     import { ref } from "vue";
 
     import type { Knowledge } from "@/types/types";
+    import { useStepStore } from '@/stores/step'
+    import { useItemStore } from '@/stores/item'
+
+    const stepStore = useStepStore()
+    const itemStore = useItemStore()
 
     const knowledgeModel = ref<string>("")
     const uriModel = ref<string>("")
@@ -18,8 +23,10 @@
         }
         if(validation(knowledge)){
             try {
-                await apiClient.post("api/v1/knowledges/", knowledge)
+                const response: Knowledge = await apiClient.post("api/v1/knowledges/", knowledge)
                 Toast.open({message: "Knowledge collected", type: "is-success"})
+                itemStore.$patch({ knowledge:response })
+                stepStore.nextStep()
             }
             catch {
                 Toast.open({message: "Data entry error", type: "is-danger"})

user-interface/src/components/EvaluateQuestion.vue

@@ -1,13 +1,98 @@
 <script setup lang="ts">
+    import { ref } from "vue";
+    import { onBeforeMount } from 'vue'
+    import type { Knowledge } from "@/types/types";
+    import type { Question } from "@/types/types";
+    import type { Metric } from "@/types/types";
 
+    //import { useStepStore } from '@/stores/step'
+    import { useItemStore } from '@/stores/item'
+
+    import { apiClient } from "@/services/api";
+
+    //const stepStore = useStepStore()
+    const itemStore = useItemStore()
+
+    const questions = ref<Question[]>()
+    const metrics = ref<Metric[]>([])
+
+    onBeforeMount(async () => {
+        if(itemStore.knowledge != undefined){
+            questions.value = await getQuestions(itemStore.knowledge)
+        }
+        else{
+            throw new Error("There is no knowledge element in itemStore.");
+        }
+        if(questions.value != undefined){
+            initializeMetrics(questions.value)
+        }
+        else{
+            throw new Error("There is no questions element from API.");
+        }
+
+    })
+
+    async function getQuestions(knowledge: Knowledge): Promise<Question[]>{
+        return apiClient.get(`api/v1/knowledges/${knowledge.id}/questions`)
+    }
+
+    function initializeMetrics(questions: Question[]){
+        questions.forEach((q)=>{
+              const metric: Metric = {
+                //id: null,
+                question_id: q.id!,
+                need_index: -1
+            }
+            metrics.value!.push(metric)
+        })
+    }
+
+    function getIndexMetrics(question: Question){
+        if(metrics.value != undefined){
+            return metrics.value.findIndex((metric) => metric.question_id === question.id)
+        }
+        else{
+            throw new Error("The is no metrics element");
+        }
+    }
+
+    async function postMetrics(){
+        console.log(metrics.value)
+        metrics.value?.forEach(async (metric) => {
+            await apiClient.post(`api/v1/metrics/`, metric)
+        })
+    }
 </script>
 
 <template>
-<div>
-    Evaluate
+    <div class="container">
+        <h2>Evaluate Questions</h2>
+        <ul>
+            <li v-for="(question, index) in questions" :key="index">
+                <p>{{ question.question }}</p>
+                <b-field>
+                    <b-slider v-model="metrics![getIndexMetrics(question)]!.need_index"></b-slider>
+                </b-field>
+            </li>
+        </ul>
+        <div class="btn-container">
+            <b-field>
+            <div class="control">
+                <b-button type="is-primary" @click="postMetrics" >Share</b-button>
+            </div>
+            </b-field>
+        </div>
     </div>
 </template>
 
 <style scoped>
-
+    .container{
+        background-color: #ffffff;
+        border-radius: 16px;
+        padding: 34px;
+    }
+    .btn-container{
+            display: flex;
+            justify-content: end;
+        }
 </style>

user-interface/src/components/GenerateQuestion.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+    import { onMounted } from 'vue'
+    import { BProgress } from "buefy";
+    import type { Knowledge } from "@/types/types";
+
+    import { apiClient } from "@/services/api";
+    import { useItemStore } from '@/stores/item'
+    import { useStepStore } from '@/stores/step'
+
+    const stepStore = useStepStore()
+    const itemStore = useItemStore()
+
+    onMounted(() => {
+        if(itemStore.knowledge != undefined){
+            generateQuestions(itemStore.knowledge)
+        } 
+    })
+    
+    async function generateQuestions (knowledge: Knowledge) {
+        await apiClient.post(`api/v1/knowledges/${knowledge.id}/questions`, null)
+        stepStore.nextStep()
+    }
+</script>
+
+<template>
+    <div class="container">
+        <h2>Generation</h2>
+        <b-progress></b-progress>
+    </div>
+</template>
+
+<style scoped>
+.container{
+    background-color: #ffffff;
+    border-radius: 16px;
+    padding: 34px;
+}
+</style>

user-interface/src/components/LoadingModel.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-<div>
-    Loading...
-</div>
-</template>
-
-<style scoped>
-
-</style>

user-interface/src/stores/item.ts

@@ -0,0 +1,14 @@
+import { ref, computed } from 'vue'
+import { defineStore } from 'pinia'
+
+import type { Knowledge } from '@/types/types'
+
+export const useItemStore = defineStore('item', () => {
+    const knowledge = ref<Knowledge>()
+  //const indexStep = ref(0)
+
+  //const getCurrentComponent = computed(() => steps[indexStep.value])
+
+
+  return { knowledge }
+})

user-interface/src/stores/step.ts

@@ -2,16 +2,16 @@ import { ref, computed, type Component } from 'vue'
 import { defineStore } from 'pinia'
 
 import CollectKnowledge from '@/components/CollectKnowledge.vue'
-import LoadingModel from '@/components/LoadingModel.vue'
 import EvaluateQuestion from '@/components/EvaluateQuestion.vue'
+import GenerateQuestion from '@/components/GenerateQuestion.vue'
 
 const steps: Component = [
   CollectKnowledge,
-  LoadingModel,
+  GenerateQuestion,
   EvaluateQuestion
 ]
 
-export const useStepsStore = defineStore('steps', () => {
+export const useStepStore = defineStore('step', () => {
   const indexStep = ref(0)
 
   const getCurrentComponent = computed(() => steps[indexStep.value])

user-interface/src/types/types.d.ts

@@ -7,14 +7,14 @@ interface Knowledge {
 interface Question {
     id: number | null,
     question: string,
-    knowledgId: number,
+    knowledgeId: number,
     metric: Metric | null
 }
 
 interface Metric {
-    id: number | null,
-    questionId: number,
-    needIndex: number
+    //id: number | null,
+    question_id: number,
+    need_index: number
 }
 
 export type {Knowledge, Question, Metric}

user-interface/src/views/ExperimentView.vue

@@ -1,9 +1,8 @@
 <script setup lang="ts">
     import ReadKnowledges from '@/components/ReadKnowledges.vue';
-    import { useStepsStore } from '@/stores/steps'
+    import { useStepStore } from '@/stores/step'
 
-    const stepsStore = useStepsStore()
-    stepsStore
+    const stepStore = useStepStore()
 </script>
 
 <template>
@@ -12,7 +11,7 @@
             <ReadKnowledges/>
         </section>
         <section id="section-central">
-            <component :is="stepsStore.getCurrentComponent"></component>
+            <component :is="stepStore.getCurrentComponent"></component>
         </section>
         <!-- <section>
             <EvaluateQuestion/>