API V1

pages/index.vue

@@ -5,7 +5,7 @@
       <v-row>
         <PokemonCard
           v-for="poke in pokemons"
-          :key="poke.id"
+          :key="poke.pokedex_id"
           :pokemon="poke"
         />
       </v-row>
@@ -20,21 +20,28 @@ import GenerationFilter from '@/components/GenerationFilter.vue'
 
 export default {
   components: { PokemonCard, GenerationFilter },
-  data: () => ({
-    selectedGen: 1,
-    pokemons: [],
-  }),
+  data() {
+    return {
+      // Toutes les générations par défaut, donc on montre tout au départ
+      selectedGen: [1, 2, 3, 4, 5, 6, 7, 8, 9],
+      pokemons: [],
+    }
+  },
   async mounted() {
     await this.loadPokemons()
   },
   methods: {
     async loadPokemons() {
-      const res = await axios.get('https://tyradex.vercel.app/api/v1')
-      const all = res.data
-      this.pokemons = all.filter(p => p.generation.id === this.selectedGen)
+      try {
+        const res = await axios.get('https://tyradex.vercel.app/api/v1/pokemon')
+        const all = res.data
+        this.pokemons = all.filter(p => this.selectedGen.includes(p.generation))
+      } catch (error) {
+        console.error('Erreur lors du chargement des pokémons :', error)
+      }
     },
     async onGenChange(gen) {
-      this.selectedGen = gen
+      this.selectedGen = Array.isArray(gen) ? gen : [gen]
       await this.loadPokemons()
     },
   }

pages/pokemon/_id.vue

@@ -14,7 +14,7 @@ import axios from 'axios'
 
 export default {
   async asyncData({ params }) {
-    const { data } = await axios.get(`https://tyradex.vercel.app/api/v1/${params.id}`)
+    const { data } = await axios.get(`https://tyradex.vercel.app/api/v1/pokemon/${params.id}`)
     return { pokemon: data }
   }
 }