Fixed bug in trainer selector when changing centers

client/src/components/TrainerSelector.vue

@@ -22,21 +22,14 @@ export default {
         centers: Array<number>
     },
     async mounted() {
-        const filters = this.centers?.map(c => `center=${c}`).join("&");
+        await this.fetchTrainers();
-        const res = await fetch(`${import.meta.env.VITE_BASE_API_URL}/trainer?${filters}`);
-        if (res.status === 200) {
-            this.trainers = await res.json();
-        }
     },
     watch: {
         centers: {
-            async handler(centers: number[]) {
+            async handler() {
                 this.selectedTrainers = [];
-                const filters = centers?.map(c => `center=${c}`).join("&");
+                this.$emit("selectionChanged", this.selectedTrainers);
-                const res = await fetch(`${import.meta.env.VITE_BASE_API_URL}/trainer?${filters}`);
+                await this.fetchTrainers();
-                if (res.status === 200) {
-                    this.trainers = await res.json();
-                }
             },
             deep: true
         }
@@ -55,6 +48,13 @@ export default {
                 this.selectedTrainers.push(id);
             }
             this.$emit("selectionChanged", this.selectedTrainers);
+        },
+        async fetchTrainers() {
+            const filters = this.centers?.map(c => `center=${c}`).join("&");
+            const res = await fetch(`${import.meta.env.VITE_BASE_API_URL}/trainer?${filters}`);
+            if (res.status === 200) {
+                this.trainers = await res.json();
+            }
         }
     }
 }