OrderStore

2024-11-07 17:18:49 +01:00
parent 844898bb3c
commit 47e045dde3
12 changed files with 196 additions and 174 deletions
--- a/software/backend/routes/order.routes.ts
+++ b/software/backend/routes/order.routes.ts
@@ -13,6 +13,15 @@ import { SeatGroup } from "../models/locations/seatGroup.model";

 export const order = Router()

+// Get all orders
+order.get("/", (req: Request, res: Response) => {
+  Order.findAll()
+    .then(orders => {
+      res.status(200).json(orders)
+    })
+})
+
+
 // Get all orders of one account by it's user id
 order.get("/:id", (req: Request, res: Response) => {
  Order.findAll({
--- a/software/backend/scripts/databaseHelper.ts
+++ b/software/backend/scripts/databaseHelper.ts
@@ -272,7 +272,7 @@ export async function prepopulateDatabase() {
                  date: concert.date,
                  name: concertGroup.name,
                  price: concert.price,
-                  image: concertGroup.image,
+                  image: "http://localhost:3000/static/" + concertGroup.image,
                  inStock: concert.inStock,
                  offered: true,
                  bandId: dataset.dataValues.id,
--- a/software/src/data/api/orderApi.ts
+++ b/software/src/data/api/orderApi.ts
@@ -32,3 +32,7 @@ export async function createOrder(
    addressId: addressId
  })
 }
+
+export async function fetchAllOrders() {
+  return axios.get(BASE_URL)
+}
--- a/software/src/locales/de.json
+++ b/software/src/locales/de.json
@@ -58,7 +58,8 @@
    "imageMember": "Bilder Mitglieder",
    "addNewGenre": "Neues Genre hinzufügen",
    "editGenre": "Genre bearbeiten",
-    "bandDetails": "Band Details"
+    "bandDetails": "Band Details",
+    "withoutConcert": "ohne Konzert"
  },
  "ticket": {
    "tickets": "Ticket | Tickets"
@@ -107,7 +108,8 @@
    },
    "addNewAccount": "Neuen Account hinzufügen",
    "accountRole": "Account Rolle",
-    "noRealPaymentsNeeded": "Keine echten Kontodaten nötig!"
+    "noRealPaymentsNeeded": "Keine echten Kontodaten nötig!",
+    "administrator": "Administrator | Administratoren"
  },
  "order": {
    "orders": "Bestellung | Bestellungen",
--- a/software/src/locales/en.json
+++ b/software/src/locales/en.json
@@ -58,7 +58,8 @@
    "imageMember": "Images Members",
    "addNewGenre": "Add new Genre",
    "editGenre": "Edit Genre",
-    "bandDetails": "Band Details"
+    "bandDetails": "Band Details",
+    "withoutConcert": "without concert"
  },
  "ticket": {
    "tickets": "Ticket | Tickets"
@@ -107,7 +108,8 @@
    },
    "addNewAccount": "Add new account",
    "accountRole": "Account Role",
-    "noRealPaymentsNeeded": "No real payment data required!"
+    "noRealPaymentsNeeded": "No real payment data required!",
+    "administrator": "Administrator"
  },
  "order": {
    "orders": "Order | Orders",
--- a/software/src/pages/account/ordersPage/index.vue
+++ b/software/src/pages/account/ordersPage/index.vue
@@ -3,10 +3,13 @@ import { useAccountStore } from '@/stores/account.store';
 import orderItem from './orderItem.vue';
 import accountSubPageLayout from '@/layouts/accountSubPageLayout.vue';
 import circularProgressIndeterminate from '@/components/basics/circularProgressIndeterminate.vue';
+import { useOrderStore } from '@/stores/order.store';

 const accountStore = useAccountStore()
+const orderStore = useOrderStore()

 accountStore.refreshOrders()
+orderStore.getOrdersOfAccount(accountStore.userAccount)
 </script>

 <template>
@@ -22,8 +25,8 @@ accountStore.refreshOrders()

    <!-- Display all orders -->
    <v-row
-      v-else-if="accountStore.orders.length > 0"
-      v-for="order in accountStore.orders"
+      v-else-if="orderStore.orders.length > 0"
+      v-for="order in orderStore.orders"
    >
      <v-col>
        <order-item
--- a/software/src/pages/admin/dashboardPage/dashboardCard.vue
+++ b/software/src/pages/admin/dashboardPage/dashboardCard.vue
@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import cardView from '@/components/basics/cardView.vue';
+import { useRouter } from 'vue-router';
+import outlinedButton from '@/components/basics/outlinedButton.vue';
+
+const router = useRouter()
+
+defineProps({
+  title: String,
+  icon: String,
+  firstLine: String,
+  secondLine: String,
+  buttonRoute: String,
+  loading: Boolean
+})
+</script>
+
+<template>
+  <v-col cols="12" md="6" lg="4">
+    <card-view
+      :title="title"
+      :icon="icon"
+    >
+      <div class="text-h4 text-center">
+        {{ firstLine }}
+      </div>
+
+      <div class="text-h6 text-center text-disabled">
+        {{ secondLine }}
+      </div>
+
+      <template #actions>
+        <outlined-button
+          @click="router.push(buttonRoute)"
+          :loading="loading"
+        >
+          {{ $t('misc.actions.more') }}
+        </outlined-button>
+      </template>
+    </card-view>
+  </v-col>
+</template>
--- a/software/src/pages/admin/dashboardPage/index.vue
+++ b/software/src/pages/admin/dashboardPage/index.vue
@@ -1,7 +1,4 @@
 <script setup lang="ts">
-import { useRouter } from 'vue-router';
-import outlinedButton from '@/components/basics/outlinedButton.vue';
-import cardView from '@/components/basics/cardView.vue';
 import { useConcertStore } from '@/stores/concert.store';
 import { useBandStore } from '@/stores/band.store';
 import { useAccountStore } from '@/stores/account.store';
@@ -9,8 +6,9 @@ import { useLocationStore } from '@/stores/location.store';
 import { useExerciseStore } from '@/stores/exercise.store';
 import { useGenreStore } from '@/stores/genre.store';
 import { usePreferencesStore } from '@/stores/preferences.store';
+import dashboardCard from './dashboardCard.vue';
+import { useOrderStore } from '@/stores/order.store';

-const router = useRouter()
 const concertStore = useConcertStore()
 const bandStore = useBandStore()
 const accountStore = useAccountStore()
@@ -18,6 +16,7 @@ const genreStore = useGenreStore()
 const locationStore = useLocationStore()
 const exerciseStore = useExerciseStore()
 const preferencesStore = usePreferencesStore()
+const orderStore = useOrderStore()

 exerciseStore.solveExercise(2, 1)

@@ -27,171 +26,94 @@ locationStore.getLocations()
 genreStore.getGenres()
 accountStore.getAllAccounts()
 concertStore.getConcerts()
+orderStore.getAllOrders()
 </script>

 <template>
  <v-container>
    <v-row>
-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('band.band', 2)"
        icon="mdi-guitar-electric"
-        >
-          <div class="text-h4 text-center">
-            {{ bandStore.bands.length }} {{ $t('band.band', 2) }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/bands')"
+        :first-line="bandStore.bands.length + ' ' + $t('band.band', 2)"
+        :second-line="bandStore.bands.reduce((counter, band) => {
+          return band.concerts.length == 0 ? counter += 1 : counter
+        }, 0) + ' ' + $t('band.withoutConcert', 2)"
+        button-route="/admin/bands"
        :loading="bandStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
+      />

-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('concert.concert', 2)"
        icon="mdi-ticket"
-        >
-          <div class="text-h4 text-center">
-            {{ concertStore.concerts.length }} {{ $t('concert.concert', 2) }}
-          </div>
-
-          <div class="text-h6 text-disabled text-center">
-            {{ concertStore.concerts.reduce((counter, obj) => {
+        :first-line="concertStore.concerts.length + ' ' + $t('concert.concert', 2)"
+        :second-line="concertStore.concerts.reduce((counter, obj) => {
          if (obj.inStock == 0) {
            counter += 1
          }

          return counter
-            }, 0) }} {{ $t('concert.concertSoldOut') }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/concerts')"
+        }, 0) + ' ' + $t('concert.concertSoldOut')"
+        button-route="/admin/concerts"
        :loading="concertStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
+      />


-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('location.location', 2)"
        icon="mdi-city"
-        >
-          <div class="text-h4 text-center">
-            {{ locationStore.locations.length }} {{ $t('location.location', 2) }}
-          </div>
-
-          <div class="text-h6 text-disabled text-center">
-            {{ 
-              locationStore.locations.reduce((city, obj) => {
+        :first-line="locationStore.locations.length + ' ' + $t('location.location', 2)"
+        :second-line="locationStore.locations.reduce((city, obj) => {
          city[obj.city.name] = 
            city[obj.city.name] === undefined ? city.push(obj.city.name) : city[obj.city.name] += 1

          return city
-              }, []).length 
-          }}
-            {{ $t('location.city', 2) }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/locations')"
+        }, []).length + ' ' + $t('location.city', 2)"
+        button-route="/admin/locations"
        :loading="locationStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
-    </v-row>
+      />

-
-    <v-row>
-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('account.account', 2)"
        icon="mdi-account"
-        >
-          <div class="text-h4 text-center">
-            {{ accountStore.accounts.length }} {{ $t('account.account', accountStore.accounts.length) }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/accounts')"
+        :first-line="accountStore.accounts.length + ' ' + $t('account.account', 2)"
+        :second-line="accountStore.accounts.reduce((counter, obj) => {
+          return obj.accountRole.privilegeAdminPanel ? counter += 1 : counter
+          }, 0) + ' ' + $t('account.administrator', 2)"
+        button-route="/admin/accounts"
        :loading="accountStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
+      />

-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('band.genre', 2)"
        icon="mdi-music-clef-treble"
-        >
-          <div class="text-h4 text-center">
-            {{ genreStore.genres.length }} {{ $t('band.genre', 2) }}
-          </div>
-
-          <div class="text-h6 text-center text-disabled">
-            {{ genreStore.genres.reduce((counter, obj) => {
+        :first-line="genreStore.genres.length + ' ' + $t('band.genre', 2)"
+        :second-line="genreStore.genres.reduce((counter, obj) => {
            return obj.bands.length == 0 ? counter += 1 : counter
-            }, 0) }} {{ $t('genre.withoutBand') }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/genres')"
+          }, 0) + ' ' + $t('genre.withoutBand', 2)"
+        button-route="/admin/genres"
        :loading="genreStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
+      />

-      <v-col>
-        <card-view
+      <dashboard-card
        :title="$t('misc.file', 2)"
        icon="mdi-file"
-        >
-          <div class="text-h4 text-center">
-            {{ preferencesStore.staticFiles.reduce((counter, obj) => {
+        :first-line="preferencesStore.staticFiles.reduce((counter, obj) => {
            return counter += obj.files.length
-            }, 0) }} {{ $t('misc.file', 2) }}
-          </div>
-
-          <div class="text-h6 text-center text-disabled">
-            {{ preferencesStore.staticFiles.length }} {{ $t('misc.folder', 2) }}
-          </div>
-
-          <template #actions>
-            <outlined-button
-              @click="router.push('/admin/files')"
+          }, 0) + ' ' + $t('misc.file', 2)"
+        :second-line="preferencesStore.staticFiles.length + ' ' + $t('misc.folder', 2)"
+        button-route="/admin/files"
        :loading="preferencesStore.fetchInProgress"
-            >
-              {{ $t('misc.actions.more') }}
-            </outlined-button>
-          </template>
-        </card-view>
-      </v-col>
+      />
+
+      <dashboard-card
+        :title="$t('order.orders', 2)"
+        icon="mdi-basket"
+        :first-line="orderStore.orders.length + ' ' + $t('order.orders', 2)"
+        second-line="todo"
+        button-route="/admin/orders"
+        :loading="orderStore.fetchInProgress"
+      />
    </v-row>
-
-    <!-- todo: Orders -->
-      
  </v-container>
 </template>
--- a/software/src/pages/homePage/upcomingConcertsSection.vue
+++ b/software/src/pages/homePage/upcomingConcertsSection.vue
@@ -25,12 +25,17 @@ const router = useRouter()
    <v-col v-else v-for="concert in concertStore.upcomingConcerts" cols="3">
      <card-view-top-image
        :image="concert.image"
-        :title="concert.band.name"
+        :title="moment(concert.date).format('DD.MM.YYYY')"
        smaller-title
        @click="router.push('/bands/details/' + concert.band.name.replaceAll(' ', '-').toLowerCase())"
        :loading="concertStore.fetchInProgress"
      >
-        {{ moment(concert.date).format("DD.MM.YYYY") }},
+        <div>
+          {{ concert.name }}
+        </div>
+        <div>
+          {{ concert.band.name }}
+        </div>
        {{ $t("misc.from") }} {{ (concert.price).toPrecision(4) }} €
      </card-view-top-image>
    </v-col>
--- a/software/src/stores/account.store.ts
+++ b/software/src/stores/account.store.ts
@@ -1,7 +1,5 @@
 import { useLocalStorage } from "@vueuse/core";
-import { acceptHMRUpdate, defineStore } from "pinia";
 import { AccountModel } from "../data/models/user/accountModel";
-import { OrderModel } from "../data/models/ordering/orderModel";
 import { useFeedbackStore } from "./feedback.store";
 import { deleteAccount, fetchAllAccounts, loginAccount, registerAccount, updateAccount } from "../data/api/accountApi";
 import { fetchUserOrders } from "../data/api/orderApi";
@@ -10,8 +8,7 @@ import { AddressModel } from "../data/models/user/addressModel";
 import { PaymentModel } from "../data/models/user/paymentModel";
 import { AccountApiModel } from "../data/models/user/accountApiModel";
 import { ref } from "vue";
-import { OrderApiModel } from "@/data/models/apiEndpoints/orderApiModel";
-import { LocationApiModel } from "@/data/models/locations/locationApiModel";
+import { defineStore } from "pinia";

 export const useAccountStore = defineStore("accountStore", {
  state: () => ({
@@ -30,9 +27,6 @@ export const useAccountStore = defineStore("accountStore", {
    /** Buffer for register data */
    registerData: ref<AccountModel>(new AccountModel()),

-    /** All orders of the user */
-    orders: ref<Array<OrderApiModel>>([]),
-
    /** Request to server sent, waiting for data response */
    fetchInProgress: ref(false)
  }),
--- a/software/src/stores/feedback.store.ts
+++ b/software/src/stores/feedback.store.ts
@@ -308,7 +308,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
        case BannerStateEnum.GENREDELETESUCCESSFUL:
        case BannerStateEnum.GENRESAVEDERROR:
        case BannerStateEnum.GENRESAVEDSUCCESSFUL:
-          this.icon = "mdi-music"
+          this.icon = "mdi-music-clef-treble"
          break;
      }

--- a/software/src/stores/order.store.ts
+++ b/software/src/stores/order.store.ts
@@ -0,0 +1,39 @@
+import { fetchAllOrders, fetchUserOrders } from "@/data/api/orderApi";
+import { OrderApiModel } from "@/data/models/apiEndpoints/orderApiModel";
+import { AccountModel } from "@/data/models/user/accountModel";
+import { defineStore } from "pinia";
+import { ref } from "vue";
+
+export const useOrderStore = defineStore("orderStore", {
+  state: () => ({
+    /** All orders of one/all users */
+    orders: ref<Array<OrderApiModel>>([]),
+
+    /** Request to server sent, waiting for data response */
+    fetchInProgress: ref(false)
+  }),
+
+  actions: {
+    /**
+     * Get all orders from all accounts from server
+     */
+    async getAllOrders() {
+      fetchAllOrders()
+        .then(res => {
+          this.orders = res.data
+        })
+    },
+
+    /**
+     * Get all orders from one account from server
+     * 
+     * @param user User to request orders from
+     */
+    async getOrdersOfAccount(user: AccountModel) {
+      fetchUserOrders(user.id)
+        .then(res => {
+          this.orders = res.data
+        })
+    }
+  }
+})