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

Redesign home page

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-09-27 15:52:22 +02:00
parent c6c8cf0ae8
commit ef0c48ae17
31 changed files with 587 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
software/src/components/cardWithTopImage.vue Normal file
View File

@@ -0,0 +1,30 @@
<script setup lang="ts">
defineProps({
image: String,
title: String
})
</script>
<template>
<v-card>
<v-img
:src="'http://localhost:3000/static/' + image"
aspect-ratio="1"
style="background-color: aliceblue;"
cover
/>
<v-card-title v-if="title">
{{ title }}
</v-card-title>
<div class="px-4 pb-4" v-if="$slots.default">
<slot></slot>
</div>
<v-card-actions v-if="$slots.actions" class="card-actions position-absolute bottom-0 right-0">
<v-spacer />
<slot name="actions"></slot>
</v-card-actions>
</v-card>
</template>

78
software/src/components/navigationItems.vue
View File

@@ -1,78 +0,0 @@
<script setup lang="ts">
import { useBasketStore } from '@/data/stores/basketStore';
import { useAccountStore } from '@/data/stores/accountStore';
const accountStore = useAccountStore()
const basketStore = useBasketStore()
const navRail = defineModel("navRail", { type: Boolean })
</script>
<template>
<v-list>
<!-- Shopping Section -->
<v-list-subheader>
<div v-if="!navRail">{{ $t('menu.shopping.shopping') }}</div>
<div v-else></div>
</v-list-subheader>
<v-list-item :title="$t('menu.shopping.ticket', 2)" prepend-icon="mdi-ticket" to="/" link />
<v-list-item :title="$t('menu.shopping.basket')" to="/basket" link >
<template v-slot:prepend>
<v-badge color="primary" :content="basketStore.itemsInBasket.length">
<v-icon icon="mdi-cart" />
</v-badge>
</template>
</v-list-item>
<v-divider />
<!-- Account Section -->
<v-list-subheader>
<div v-if="!navRail">{{ $t('menu.account.accountManagement') }}</div>
<div v-else></div>
</v-list-subheader>
<v-expand-transition>
<div v-if="accountStore.userAccount.id == null">
<v-list-item v-if="accountStore.userAccount.id == null" :title="$t('menu.account.login')" prepend-icon="mdi-login" to="/login" link />
</div>
</v-expand-transition>
<v-expand-transition>
<div v-if="accountStore.userAccount.id != null">
<v-list-item :title="$t('menu.account.account')" prepend-icon="mdi-account" to="/account" link />
<v-list-item :title="$t('menu.account.order', 2)" prepend-icon="mdi-cart-check" to="/orders" link />
<v-list-item :title="$t('menu.account.logout')" prepend-icon="mdi-logout" @click="accountStore.logout" link />
</div>
</v-expand-transition>
<v-divider />
<!-- System and help section -->
<v-list-subheader>
<div v-if="!navRail">{{ $t('menu.systemAndHelp.systemAndHelp') }}</div>
<div v-else></div>
</v-list-subheader>
<v-list-item :title="$t('menu.systemAndHelp.helpInstructions')" prepend-icon="mdi-chat-question" to="/help" link />
<v-list-item :title="$t('menu.systemAndHelp.scoreBoard')" prepend-icon="mdi-podium-gold" to="/scoreBoard" link />
<v-list-item :title="$t('menu.systemAndHelp.preferences')" prepend-icon="mdi-cog" to="/preferences" link />
<div v-if="accountStore.userAccount.accountRole.privilegeAdminPanel">
<v-divider />
<v-list-subheader>
<div v-if="!navRail">{{ $t('menu.admin.admin') }}</div>
<div v-else></div>
</v-list-subheader>
<v-list-item :title="$t('menu.admin.dashboard')" prepend-icon="mdi-view-dashboard" to="/admin/dashboard" link />
</div>
</v-list>
</template>

21
software/src/components/sectionDivider.vue Normal file
View File

@@ -0,0 +1,21 @@
<script setup lang="ts">
defineProps({
title: String
})
</script>
<template>
<v-row class="pt-3">
<v-col class="d-flex justify-center align-center">
<v-sheet height="12" width="100%" color="primary" :rounded="true" />
</v-col>
<v-col class="v-col-auto">
<span class="text-h6">{{ title }}</span>
</v-col>
<v-col class="d-flex justify-center align-center">
<v-sheet height="12" width="100%" color="primary" :rounded="true" />
</v-col>
</v-row>
</template>