Documentation

README.md

@@ -66,6 +66,118 @@ The application host it's data in a SQLite database. The access is managed by an
 
 #### Listing existing
 
+<details open>
+<summary><code><span style="color:#70AFFD"><b>GET</b></span></code> <code><b>/accounts/</b></code> <code> (Get all Accounts)</code>
+</summary>
+
+##### Parameters
+> None
+
+##### Responses
+> | http code | content-type | response |
+> | :---: | --- | --- |
+> | `200` | `application/json` | `Array<Account + AccountRole>`  |
+
+##### Example Response
+```json
+[
+  {
+    "id": 421,
+    "username": "hagemeister93",
+    "password": "Xjt3qb5t",
+    "email": "hagemeister93@gmail.com",
+    "firstName": "Laurin",
+    "lastName": "Hagemeister",
+    "accountRoleId": 2,
+    "accountRole": {
+      "id": 2,
+      "name": "Admin",
+      "privilegeBuy": true,
+      "privilegeAdminPanel": true
+    }
+  }
+]
+```
+
+</details>
+
+<details open>
+<summary><code><span style="color:#70AFFD"><b>GET</b></span></code> <code><b>/api/files</b></code> <code> (Get all public files)</code>
+</summary>
+
+##### Parameters
+> None
+
+##### Responses
+> | http code | content-type | response |
+> | :---: | --- | --- |
+> | `200` | `application/json` | `Array<{folder: String, files: Array<{name: String, size: Number, url: String}> }>`  |
+
+##### Example Response
+```json
+[
+  {
+    "folder": "artists",
+    "files": [
+      {
+        "name": "alex-turner.jpg",
+        "size": 56473,
+        "url": "http://localhost:3000/static/artists/alex-turner.jpg"
+      },
+      {
+        "name": "andy-nicholson.jpg",
+        "size": 68983,
+        "url": "http://localhost:3000/static/artists/andy-nicholson.jpg"
+      }
+    ]
+  }
+]
+```
+</details>
+
+<details open>
+<summary><code><span style="color:#70AFFD"><b>GET</b></span></code> <code><b>/bands/</b></code> <code> (Get all bands)</code>
+</summary>
+
+##### Parameters
+> | name | type | data type | description |
+> | :---: | --- | --- | --- |
+> | `sort` |  optional | string   | Sort by number of concerts ascending (asc) or descending (desc) |
+> | `count` |  optional | number   | Number of items to responde |
+
+##### Responses
+> | http code | content-type | response |
+> | :---: | --- | --- |
+> | `200` | `application/json` | `Array<>`  |
+
+##### Example Response
+```json
+[
+  {
+    "folder": "artists",
+    "files": [
+      {
+        "name": "alex-turner.jpg",
+        "size": 56473,
+        "url": "http://localhost:3000/static/artists/alex-turner.jpg"
+      },
+      {
+        "name": "andy-nicholson.jpg",
+        "size": 68983,
+        "url": "http://localhost:3000/static/artists/andy-nicholson.jpg"
+      }
+    ]
+  }
+]
+```
+</details>
+
+
+
+
+
+
+
 <details>
 <summary><code><span style="color:#70AFFD"><b>GET</b></span></code> <code><b>/events?city=cityName&genre=genreName&count=nrOfItems&sort=sortDirection</b></code> <code> (Get all events, filtered by city and genre)</code>
 </summary>

software/backend/routes/band.routes.ts

@@ -158,4 +158,18 @@ band.post("/", (req: Request, res: Response) => {
     .then(result => {
       res.status(200).json(result)
     })
+})
+
+band.delete("/", (req: Request, res: Response) => {
+  Band.destroy({
+    where: {
+      id: req.body.id
+    }
+  })
+    .then(result => {
+      res.status(200).json(result)
+    })
+    .catch(error => {
+      res.status(500).send()
+    })
 })

software/src/data/api/mainApi.ts

@@ -2,18 +2,38 @@ import axios from "axios"
 
 const BASE_URL = "http://localhost:3000/api"
 
+/**
+ * Fetch the current state of backend server
+ * 
+ * @returns Response from server
+ */
 export function fetchServerState() {
   return axios.get(BASE_URL)
 }
 
+/**
+ * Reset the database (without exercise progress) to factory state
+ * 
+ * @returns Response from server
+ */
 export function resetDatabase() {
   return axios.get(BASE_URL + "/resetdatabase")
 }
 
+/**
+ * Reset the exercise progress
+ * 
+ * @returns Response from server
+ */
 export function resetExerciseProgress() {
   return axios.get(BASE_URL + "/resetExerciseProgress")
 }
 
+/**
+ * Fetch all static file names
+ * 
+ * @returns Response from server
+ */
 export function fetchFileNames() {
   return axios.get(BASE_URL + "/files")
 }

software/src/pages/account/ordersPage/index.vue

@@ -8,7 +8,6 @@ import { useOrderStore } from '@/stores/order.store';
 const accountStore = useAccountStore()
 const orderStore = useOrderStore()
 
-accountStore.refreshOrders()
 orderStore.getOrdersOfAccount(accountStore.userAccount)
 </script>
 
@@ -16,7 +15,7 @@ orderStore.getOrdersOfAccount(accountStore.userAccount)
   <account-sub-page-layout>
     <!-- During fetching state -->
     <v-row
-      v-if="accountStore.fetchInProgress"
+      v-if="orderStore.fetchInProgress"
     >
       <v-col class="text-center">
         <circular-progress-indeterminate />

software/src/pages/bands/bandDetailPage/bandMemberSection.vue

@@ -1,19 +1,18 @@
 <script setup lang="ts">
 import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
-import { BandApiModel } from '@/data/models/acts/bandApiModel';
+import sectionDivider from '@/components/basics/sectionDivider.vue';
 import { useBandStore } from '@/stores/band.store';
 
 const bandStore = useBandStore()
-
-defineProps({
-  band: {
-    type: BandApiModel,
-    required: true
-  }
-})
 </script>
 
 <template>
+  <v-row>
+    <v-col>
+      <section-divider :title="$t('band.bandMember')" />
+    </v-col>
+  </v-row>
+
   <v-row v-if="bandStore.fetchInProgress" >
     <v-col cols="3" v-for="i in 4">
       <card-with-top-image :loading="true" />
@@ -23,7 +22,7 @@ defineProps({
   <v-row>
     <v-spacer />
 
-    <v-col v-for="member of band.members" cols="3">
+    <v-col v-for="member of bandStore.band.members" cols="3">
       <card-with-top-image
         :title="member.name"
         :image=" member.image"

software/src/pages/bands/bandDetailPage/concertSection.vue

@@ -1,30 +1,30 @@
 <script setup lang="ts">
 import concertListItem from '@/components/pageParts/concertListItem.vue';
-import { BandApiModel } from '@/data/models/acts/bandApiModel';
-import { ConcertApiModel } from '@/data/models/acts/concertApiModel';
 import CardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
-import { useConcertStore } from '@/stores/concert.store';
+import sectionDivider from '@/components/basics/sectionDivider.vue';
+import { useBandStore } from '@/stores/band.store';
 
-const concertStore = useConcertStore()
+const bandStore = useBandStore()
-
-defineProps({
-  band: BandApiModel,
-  concerts: Array<ConcertApiModel>
-})
 </script>
 
 <template>
-  <v-row v-if="concertStore.fetchInProgress" v-for="i in 3">
+  <v-row>
+    <v-col>
+      <section-divider :title="$t('concert.concert', 2)" />
+    </v-col>
+  </v-row>
+
+  <v-row v-if="bandStore.fetchInProgress" v-for="i in 3">
     <v-col>
       <card-view-horizontal :loading="true" />
     </v-col>
   </v-row>
 
-  <v-row v-for="concert of concerts">
+  <v-row v-for="concert of bandStore.band.concerts">
     <v-col>
       <concert-list-item
         :concert="concert"
-        :band="band"
+        :band="bandStore.band"
         :location="concert.location"
         :title="concert.location.city.name"
         :link="concert.inStock > 0"

software/src/pages/bands/bandDetailPage/gallerySection.vue

@@ -1,18 +1,17 @@
 <script setup lang="ts">
-import { BandModel } from '@/data/models/acts/bandModel';
 import { useBandStore } from '@/stores/band.store';
+import sectionDivider from '@/components/basics/sectionDivider.vue';
 
 const bandStore = useBandStore()
-
-defineProps({
-  band: {
-    type: BandModel,
-    required: true
-  }
-})
 </script>
 
 <template>
+  <v-row>
+    <v-col>
+      <section-divider :title="$t('band.image', 2)" />
+    </v-col>
+  </v-row>
+
   <v-row>
     <v-col>
       <v-skeleton-loader
@@ -43,7 +42,7 @@ defineProps({
 
 
           <v-carousel-item
-            v-for="image in band.images"
+            v-for="image in bandStore.band.images"
             :src="image" 
             cover
           />

software/src/pages/bands/bandDetailPage/index.vue

@@ -5,7 +5,6 @@ import bandMemberSection from './bandMemberSection.vue';
 import gallerySection from './gallerySection.vue';
 import concertSection from './concertSection.vue';
 import heroImage from '@/components/pageParts/heroImage.vue';
-import sectionDivider from '@/components/basics/sectionDivider.vue';
 import { useBandStore } from '@/stores/band.store';
 import { onMounted, watch } from 'vue';
 
@@ -36,49 +35,16 @@ watch(() => router.currentRoute.value.params.name, () => {
       <v-spacer />
 
       <v-col cols="10">
-        <v-row>
+        <concert-section />
-          <v-col>
-            <section-divider :title="$t('concert.concert', 2)" />
-          </v-col>
-        </v-row>
 
-        <concert-section
+        <band-member-section />
-          :band="bandStore.band"
-          :concerts="bandStore.band.concerts"
-        />
-
-        <v-row>
-          <v-col>
-            <section-divider :title="$t('band.bandMember')" />
-          </v-col>
-        </v-row>
-
-        <band-member-section
-          :band="bandStore.band"
-        />
-        
-
-        <v-row>
-          <v-col>
-            <section-divider :title="$t('band.rating', 2)" />
-          </v-col>
-        </v-row>
 
         <rating-section
           :rating="bandStore.band.rating"
           :ratings="bandStore.band.ratingValues"
         />
 
-
+        <gallery-section />
-        <v-row>
-          <v-col>
-            <section-divider :title="$t('band.image', 2)" />
-          </v-col>
-        </v-row>
-
-        <gallery-section
-          :band="bandStore.band"
-        />
       </v-col>
 
       <v-spacer />

software/src/pages/bands/bandDetailPage/ratingSection.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { RatingModel } from '@/data/models/acts/ratingModel';
+import sectionDivider from '@/components/basics/sectionDivider.vue';
 
 defineProps({
   /**
@@ -18,6 +19,12 @@ defineProps({
 </script>
 
 <template>
+  <v-row>
+    <v-col>
+      <section-divider :title="$t('band.rating', 2)" />
+    </v-col>
+  </v-row>
+
   <v-row>
     <v-col>
       <div class="d-flex align-center justify-center flex-column" style="height: 100%;">

software/src/stores/order.store.ts

@@ -18,9 +18,12 @@ export const useOrderStore = defineStore("orderStore", {
      * Get all orders from all accounts from server
      */
     async getAllOrders() {
+      this.fetchInProgress = true
+
       fetchAllOrders()
         .then(res => {
           this.orders = res.data
+          this.fetchInProgress = false
         })
     },
 
@@ -30,14 +33,17 @@ export const useOrderStore = defineStore("orderStore", {
      * @param user User to request orders from
      */
     async getOrdersOfAccount(user: AccountModel) {
+      this.fetchInProgress = true
+
       fetchUserOrders(user.id)
         .then(res => {
           this.orders = res.data
+          this.fetchInProgress = false
         })
     },
 
     async deleteOrder(order: OrderApiModel) {
-      
+      // todo
     }
   }
 })

software/src/stores/preferences.store.ts

@@ -108,6 +108,9 @@ export const usePreferencesStore = defineStore('preferencesStore', {
         })
     },
 
+    /**
+     * Request all available static files on server
+     */
     async getStaticFiles() {
       this.fetchInProgress = true
 
@@ -118,6 +121,9 @@ export const usePreferencesStore = defineStore('preferencesStore', {
         })
     },
 
+    /**
+     * Reset all store values to factory state
+     */
     resetToFactorySettings() {
       const basketStore = useBasketStore()