From f2bb4b69543694bcad5bfbdbf3ca84747035f9dd Mon Sep 17 00:00:00 2001
From: Tobias Zoghaib <tobias.zoghaib@stud.uni-hannover.de>
Date: Mon, 18 Nov 2024 16:07:51 +0100
Subject: [PATCH] Add exercise group descriptions to help page, restructure
 timeline

---
 software/backend/data/accounts.json        |  2 +-
 software/src/locales/de.json               |  3 +-
 software/src/locales/en.json               |  3 +-
 software/src/pages/misc/helpPage/index.vue | 59 +++++++++++++++-------
 4 files changed, 46 insertions(+), 21 deletions(-)

diff --git a/software/backend/data/accounts.json b/software/backend/data/accounts.json
index 4a3bfce..54fb6df 100644
--- a/software/backend/data/accounts.json
+++ b/software/backend/data/accounts.json
@@ -98,7 +98,7 @@
           "iban": "DE41500105172184936679"
         }
       ],
-      "accountRoleId": 2
+      "accountRoleId": 3
     },
     {
       "username": "guitarhero",
diff --git a/software/src/locales/de.json b/software/src/locales/de.json
index 8b5a122..b06cb5d 100644
--- a/software/src/locales/de.json
+++ b/software/src/locales/de.json
@@ -243,7 +243,8 @@
     "yourFullName": "Vollständiger Name",
     "chooseFile": "Datei auswählen",
     "chooseDestinationFolder": "Zielordner auswählen",
-    "upload": "Hochladen"
+    "upload": "Hochladen",
+    "fulfillYourPersonalDataFirst": "Gehe zu den Einstellungen und fülle deinen Namen und deine Matrikelnummer aus"
   },
   "genre": {
     "withoutBand": "ohne Band"
diff --git a/software/src/locales/en.json b/software/src/locales/en.json
index 0748929..5d9a7e3 100644
--- a/software/src/locales/en.json
+++ b/software/src/locales/en.json
@@ -243,7 +243,8 @@
     "yourFullName": "Full name",
     "chooseFile": "Choose file",
     "chooseDestinationFolder": "Choose destination folder",
-    "upload": "Upload"
+    "upload": "Upload",
+    "fulfillYourPersonalDataFirst": "Go to settings and enter your name and the right register number"
   },
   "genre": {
     "withoutBand": "without Band"
diff --git a/software/src/pages/misc/helpPage/index.vue b/software/src/pages/misc/helpPage/index.vue
index 9ecc30f..c13d117 100644
--- a/software/src/pages/misc/helpPage/index.vue
+++ b/software/src/pages/misc/helpPage/index.vue
@@ -26,7 +26,20 @@ function getDotColor(exerciseGroupNr: number) {
     <v-row>
       <v-spacer />
 
+      <v-col
+        v-if="preferencesStore.studentName.length < 3 || preferencesStore.registrationNumber.length < 7"
+        cols="auto"
+      >
+        <card-view variant="outlined" >
+          {{ $t('misc.fulfillYourPersonalDataFirst') }}
+        </card-view>
+      </v-col>
+
       <v-col cols="auto">
+        <v-tooltip :text="$t('misc.fulfillYourPersonalDataFirst')">
+          <template #activator="{ props }"></template>
+
+        </v-tooltip>
         <outlined-button
           prepend-icon="mdi-file-pdf-box"
           @click="generateResultsPdf()"
@@ -49,16 +62,13 @@ function getDotColor(exerciseGroupNr: number) {
               class="px-5"
               align="start"
             >
-              <v-timeline-item
-                v-for="exercise of exerciseStore.exercises"
-                :dot-color="getDotColor(exercise.exerciseGroup.groupNr)"
-                :icon="exercise.solved ? 'mdi-check' : 'mdi-pencil'"
-              >
-                <!-- Left side -->
-                <template #opposite>
+              <template v-for="exercise of exerciseStore.exercises">
+                <v-timeline-item v-if="exercise.exerciseNr == 1"
+                  dot-color="grey"
+                  fill-dot
+                >
                   <div
-                    v-if="exercise.exerciseNr == 1"
-                    :class="`pt-1 font-weight-bold text-${getDotColor(exercise.exerciseGroup.groupNr)}`"
+                    :class="`pt-1 text-h5 font-weight-bold text-${getDotColor(exercise.exerciseGroup.groupNr)}`"
                   >
                     {{
                       (preferencesStore.language == LanguageEnum.GERMAN 
@@ -66,17 +76,30 @@ function getDotColor(exerciseGroupNr: number) {
                       : exercise.exerciseGroup.nameEn) 
                     }}
                   </div>
-                </template>
 
-                <!-- Right side -->
-                <card-view
-                  :title="$t('help.scoreBoard.exerciseNr', [exercise.exerciseGroup.groupNr, exercise.exerciseNr]) + 
-                    (preferencesStore.language == LanguageEnum.GERMAN ? exercise.nameDe : exercise.nameEn)"
-                  :color="exercise.solved ? 'green' : 'primary'"
+                  <div>
+                    {{
+                      (preferencesStore.language == LanguageEnum.GERMAN 
+                      ? exercise.exerciseGroup.descriptionDe 
+                      : exercise.exerciseGroup.descriptionEn) 
+                    }}
+                  </div>
+                </v-timeline-item>
+
+                <v-timeline-item
+                  :dot-color="getDotColor(exercise.exerciseGroup.groupNr)"
+                  :icon="exercise.solved ? 'mdi-check' : 'mdi-pencil'"
                 >
-                  {{ preferencesStore.language == LanguageEnum.GERMAN ? exercise.descriptionDe : exercise.descriptionEn }}
-                </card-view>
-              </v-timeline-item>
+                   <!-- Right side -->
+                  <card-view
+                    :title="$t('help.scoreBoard.exerciseNr', [exercise.exerciseGroup.groupNr, exercise.exerciseNr]) + 
+                      (preferencesStore.language == LanguageEnum.GERMAN ? exercise.nameDe : exercise.nameEn)"
+                    :color="exercise.solved ? 'green' : 'primary'"
+                  >
+                    {{ preferencesStore.language == LanguageEnum.GERMAN ? exercise.descriptionDe : exercise.descriptionEn }}
+                  </card-view>
+                </v-timeline-item>
+              </template>
             </v-timeline>
           </template>
         </card-view>