From e5b8ae6391655b5b8b3eeb30e8f3296e8928a410 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torbj=C3=B8rn=20Antonsen?= <torbjant@ntnu.no>
Date: Mon, 29 Apr 2024 14:22:12 +0200
Subject: [PATCH] fixed issues in BadgeInfo where it would not fetch and
display badges from backend correctly
---
src/components/profile/BadgeInfo.vue | 15 +++++++--------
1 file changed, 7 insertions(+), 8 deletions(-)
diff --git a/src/components/profile/BadgeInfo.vue b/src/components/profile/BadgeInfo.vue
index 1a4ea4c..eca9790 100644
--- a/src/components/profile/BadgeInfo.vue
+++ b/src/components/profile/BadgeInfo.vue
@@ -3,9 +3,9 @@ import { onMounted, ref } from 'vue'
import { getUserInfo } from '@/utils/profileutils'
import { useTokenStore } from '@/stores/token'
interface Achievement{
- id: number,
- title: string,
- img: string
+ achievementId: number,
+ achievementTitle: string,
+ badge: string
}
const props = defineProps <{
@@ -28,8 +28,7 @@ onMounted(async () => {
const fetchBadgeInfo = async ()=>{
try {
const response = await getUserInfo(token)
- console.log(response)
- achievements.value = response.achievements;
+ achievements.value = response.achievementDTOList;
} catch (error){
console.error('Error fetching achievements:')
}
@@ -41,9 +40,9 @@ const fetchBadgeInfo = async ()=>{
<div class="badge-container">
<h3 class="title">{{title}}</h3>
<div class="badges">
- <div class="badge" v-for="(achievement) in achievements" :key="achievement.id">
- <img class="badge-img" :src="achievement.img" :alt="achievement.title">
- <h3 class="badge-title"> {{achievement.title}}</h3>
+ <div class="badge" v-for="achievement in achievements" :key="achievement.achievementId">
+ <img v-if="achievement.badge" class="badge-img" :src="achievement.badge" :alt="achievement.achievementTitle">
+ <h3 class="badge-title"> {{achievement.achievementTitle}}</h3>
</div>
</div>
--
GitLab