tobias/eventmaster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

Finish GenresAdminPanel

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-11-06 17:55:18 +01:00
parent 80dd2a0ae8
commit 9ec8e382cf
17 changed files with 181 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
software/src/components/basics/cardViewTopImage.vue
View File

@@ -29,7 +29,7 @@ defineProps({
height="150"
>
<v-img
:src="'http://localhost:3000/static/' + image"
:src="image"
aspect-ratio="1"
max-height="200"
cover

2
software/src/components/pageParts/bandListItem.vue
View File

@@ -34,7 +34,7 @@ defineProps({
<card-view-horizontal
v-if="!loading"
:title="band.name"
:image="'http://localhost:3000/static/' + band.logo"
:image="band.logo"
@click="router.push('/bands/details/' + band.name.replaceAll(' ', '-').toLowerCase())"
>
<template #content>

4
software/src/components/pageParts/heroImage.vue
View File

@@ -22,7 +22,7 @@ defineProps({
<template>
<v-img
:src="!loading ? 'http://localhost:3000/static/' + image : ''"
:src="!loading ? image : ''"
height="600"
gradient="to top, rgba(0, 0, 0, .9), rgba(255, 255, 255, 0.1)"
cover
@@ -40,7 +40,7 @@ defineProps({
<v-card>
<v-img
v-if="logo"
:src="'http://localhost:3000/static/' + logo"
:src="logo"
width="200"
aspect-ratio="1"
cover

2
software/src/components/pageParts/ticketListItem.vue
View File

@@ -41,7 +41,7 @@ defineProps({
<template>
<card-with-left-image
:image="'http://localhost:3000/static/' + image"
:image="image"
:link="false"
color-header="primary"
:title="band.name + ' - ' + concert.name"

15
software/src/data/api/genreApi.ts
View File

@@ -1,7 +1,22 @@
import axios from "axios"
import { GenreModel } from "../models/acts/genreModel"
let BASE_URL = "http://localhost:3000/genres"
export async function fetchAllGenres() {
return await axios.get(BASE_URL)
}
export async function postGenre(genre: GenreModel) {
return await axios.post(BASE_URL, genre)
}
export async function patchGenre(genre: GenreModel) {
return await axios.patch(BASE_URL, genre)
}
export async function deleteGenre(genre: GenreModel) {
return await axios.delete(BASE_URL, {
data: genre
})
}

12
software/src/data/enums/bannerStateEnum.ts
View File

@@ -84,5 +84,15 @@ export enum BannerStateEnum {
BANDDELETESUCCESSFUL,
BANDDELETEERROR
BANDDELETEERROR,
////////// API Endpoint /genres //////////
GENRESAVEDSUCCESSFUL,
GENRESAVEDERROR,
GENREDELETESUCCESSFUL,
GENREDELETEERROR
}

2
software/src/data/models/acts/genreModel.ts
View File

@@ -1,4 +1,4 @@
export class GenreModel {
id: number = -1
id: number
name: string = ""
}

15
software/src/pages/admin/bandsAdminPage/bandEditDialog.vue
View File

@@ -74,6 +74,21 @@ function itemProps(item: GenreModel) {
/>
</v-col>
</v-row>
<v-row>
<v-col>
<v-img
:src="bandStore.band.logo"
/>
</v-col>
<v-col>
<v-img
max-width="300"
:src="bandStore.band.imageMembers"
placeholder=""
/>
</v-col>
</v-row>
</v-container>
<template #actions>

1
software/src/pages/admin/genresAdminPage/genreEditDialog.vue
View File

@@ -11,6 +11,7 @@ const genreStore = useGenreStore()
v-model="genreStore.showEditDialog"
:title="$t('band.editGenre')"
icon="mdi-pencil"
max-width="500"
>
<v-container>
<v-row>

1
software/src/pages/admin/genresAdminPage/index.vue
View File

@@ -24,6 +24,7 @@ genreStore.getGenres()
:loading="genreStore.fetchInProgress"
:items="genreStore.genres"
:headers="headers"
:items-per-page="100"
>
<template #item.bands="{ item }">
<v-chip v-for="band of item.bands" class="mx-1">

2
software/src/pages/bands/bandDetailPage/gallerySection.vue
View File

@@ -44,7 +44,7 @@ defineProps({
<v-carousel-item
v-for="image in band.images"
:src="'http://localhost:3000/static/' + image"
:src="image"
cover
/>
</v-carousel>

1
software/src/pages/bands/bandDetailPage/index.vue
View File

@@ -22,7 +22,6 @@ watch(() => router.currentRoute.value.params.name, () => {
</script>
<template>
{{ router.currentRoute.value.params.name }}
<hero-image
:image="bandStore.band.imageMembers"
:logo="bandStore.band.logo"

2
software/src/pages/homePage/bandsSection.vue
View File

@@ -29,7 +29,7 @@ bandStore.getBands()
>
<v-img
class="d-flex align-center text-center"
:src="'http://localhost:3000/static/' + band.imageMembers"
:src="band.imageMembers"
height="250px"
width="350"
cover

2
software/src/pages/homePage/upcomingConcertsSection.vue
View File

@@ -4,6 +4,7 @@ import { useRouter } from 'vue-router';
import cardViewTopImage from '@/components/basics/cardViewTopImage.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import sectionDivider from '@/components/basics/sectionDivider.vue';
import moment from 'moment';
const concertStore = useConcertStore()
const router = useRouter()
@@ -29,6 +30,7 @@ const router = useRouter()
@click="router.push('/bands/details/' + concert.band.name.replaceAll(' ', '-').toLowerCase())"
:loading="concertStore.fetchInProgress"
>
{{ moment(concert.date).format("DD.MM.YYYY") }},
{{ $t("misc.from") }} {{ (concert.price).toPrecision(4) }} €
</card-view-top-image>
</v-col>

65
software/src/stores/genre.store.ts
View File

@@ -1,7 +1,9 @@
import { fetchAllGenres } from "@/data/api/genreApi";
import { deleteGenre, fetchAllGenres, patchGenre, postGenre } from "@/data/api/genreApi";
import { GenreApiModel } from "@/data/models/acts/genreApiModel";
import { defineStore } from "pinia";
import { ref } from "vue";
import { useFeedbackStore } from "./feedback.store";
import { BannerStateEnum } from "@/data/enums/bannerStateEnum";
export const useGenreStore = defineStore("genreStore", {
state: () => ({
@@ -14,11 +16,17 @@ export const useGenreStore = defineStore("genreStore", {
/** Genres to filter bands for */
filteredGenres: ref<Array<GenreApiModel>>([]),
/** Show or hide edit dialog for Genre object */
showEditDialog: ref(false),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
actions: {
/**
* Get all genres from the database
*/
getGenres() {
this.fetchInProgress = true
@@ -37,17 +45,68 @@ export const useGenreStore = defineStore("genreStore", {
this.showEditDialog = true
},
/**
* Edit a Genre object, move parameter to this.genre, opens dialog
*
* @param genre Selected Genre object
*/
editGenre(genre: GenreApiModel) {
this.genre = genre
this.showEditDialog = true
},
/**
* Save edited genre to the backend server
*/
saveGenre() {
// todo
const feedbackStore = useFeedbackStore()
this.fetchInProgress = true
if (this.genre.id == undefined) {
// Creating new Genre
postGenre(this.genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDSUCCESSFUL)
this.getGenres()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDERROR)
}
})
} else {
// Update existing Genre
patchGenre(this.genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDSUCCESSFUL)
this.getGenres()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDERROR)
}
})
}
},
/**
* Delete a Genre object
*
* @param genre Genre to delete
*/
deleteGenre(genre: GenreApiModel) {
// todo
const feedbackStore = useFeedbackStore()
this.fetchInProgress = true
deleteGenre(genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENREDELETESUCCESSFUL)
this.getGenres()
} else {
feedbackStore.changeBanner(BannerStateEnum.GENREDELETEERROR)
}
})
}
}
})