Resolves #520 Submit Page for Heuristics Test

ruxailab · Jun 27, 2024 · 376550a · 376550a
1 parent 98a80ee
commit 376550a
Showing 1 changed file with 67 additions and 2 deletions.
diff --git a/src/views/public/TestView.vue b/src/views/public/TestView.vue
@@ -278,7 +278,10 @@
                     v-for="(heuris, i) in item.value"
                     :key="i"
                     link
-                    @click="heurisIndex = i"
+                    @click="
+                      heurisIndex = i
+                      clickfun()
+                    "
                   >
                     <v-list-item-icon>
                       <v-progress-circular
@@ -315,6 +318,18 @@
                       </v-list-item-title>
                     </v-list-item-content>
                   </v-list-item>
+                  <v-list-item style="cursor:pointer" v-if="review==true && calculatedProgress==100" @click="review=false" >
+                    <v-list-item-icon>
+                      <v-icon color="#fca326">
+                        mdi-send-circle-outline
+                      </v-icon>
+                    </v-list-item-icon>
+                    <v-list-item-content>
+                      <v-list-item-title>
+                        <div style="color: #fca326;">Submit</div>
+                      </v-list-item-title>
+                    </v-list-item-content>
+                  </v-list-item>
                 </div>
               </v-list>
 
@@ -356,7 +371,7 @@
         >
           <!-- Heuristics -->
           <ShowInfo
-            v-if="index == 1"
+            v-if="index == 1 && review == true"
             :title="test.testStructure[heurisIndex].title"
           >
             <div slot="content" class="ma-0 pa-0">
@@ -411,6 +426,46 @@
               </v-row>
             </div>
           </ShowInfo>
+          <div v-if="calculatedProgress == 100 && review == false">
+            <ShowInfo title="Finish Test">
+              <div slot="content" class="ma-0 pa-0">
+                <v-row justify="center" class="ma-4">
+                  <v-col cols="11" class="mt-3">
+                    <span class="cardsTitle">Final Message!</span>
+                    <br />
+                    <span class="cardsSubtitle">
+                      Congratulations you finished this test, now you can submit
+                      your answer.
+                    </span>
+                    <v-row justify="center" class="mt-3">
+                      <v-col cols="4">
+                        <img
+                          draggable="false"
+                          src="../../../public/finalMessage.svg"
+                          alt="Final test svg"
+                        />
+                      </v-col>
+                      <v-col cols="4" class="pt-2 my-8">
+                        <span class="cardsSubtitle"
+                          >Click here to submit your answer, when submitted your
+                          answer can't be changed!</span
+                        >
+                        <v-col class="mt-2">
+                          <v-btn
+                            @click="dialog = true"
+                            color="orange"
+                            depressed
+                            dark
+                            ><v-icon class="ma-2">mdi-send</v-icon>Submit</v-btn
+                          >
+                        </v-col>
+                      </v-col>
+                    </v-row>
+                  </v-col>
+                </v-row>
+              </div>
+            </ShowInfo>
+          </div>
         </v-col>
       </v-row>
     </div>
@@ -468,6 +523,7 @@ export default {
     res: 0,
     dialog: false,
     calculatedProgress: 0,
+    review: true,
   }),
   computed: {
     test() {
@@ -519,6 +575,11 @@ export default {
         if (this.logined) this.setTest()
       }
     },
+    calculatedProgress(newVal) {
+      if (newVal == 100) {
+        this.review = false
+      }
+    },
   },
 
   async created() {
@@ -655,6 +716,10 @@ export default {
       await this.$store.dispatch('getCurrentTestAnswerDoc')
       this.populateWithHeuristicQuestions()
     },
+    clickfun() {
+      console.log('click done')
+      this.review = true
+    },
   },
   beforeRouteEnter(to, from, next) {
     if (to.params.token)