- Added single school page

client/src/pages/schools/single-school-page.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="container-fluid p-4" id="spell-container">
+    <h1 class="display-3 font-display mb-3">{{ school.name }}</h1>
+    <spell-list :school_id="id"/>
+  </div>
+</template>
+
+<script>
+import SpellsList from "../../components/spells/spells-list"
+
+// API
+import { RepositoryFactory } from "../../../api/repositories"
+const Schools = RepositoryFactory.get('schools')
+
+export default {
+    name: 'single-school',
+    components: {
+        'spell-list': SpellsList,
+    },
+    data() {
+        return {
+            loading: false,
+            school: {},
+            id: this.$route.params.id
+        }
+    },
+    created() {
+        this.computeSchool()
+    },
+    methods: {
+        async fetchSchool(id) {
+            const { data } = await Schools.getSchool(id)
+            return data
+        },
+        async computeSchool() {
+            this.loading = true
+            const displaySchool = await this.fetchSchool(this.id)
+            this.loading = false
+            this.school = displaySchool
+        },
+        console() {
+            console.log(this.school)
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>