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

Add dialog to create new user

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-09-10 18:50:47 +02:00
parent c9a80a0a74
commit 628d1e7bee
10 changed files with 171 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
software/src/pages/helpPage/index.vue Normal file
View File

@@ -0,0 +1,6 @@
<script setup lang="ts">
</script>
<template>
Help
</template>

9
software/src/pages/loginPage/index.vue
View File

@@ -1,14 +1,19 @@
<script setup lang="ts">
import LoginForm from './loginForm.vue';
import { ref } from 'vue';
import loginForm from './loginForm.vue';
import registerForm from './registerForm.vue';
const showRegisterDialog = ref(false)
</script>
<template>
<v-container max-width="600">
<v-row>
<v-col>
<login-form />
<login-form v-model:show-register-dialog="showRegisterDialog" />
</v-col>
</v-row>
</v-container>
<register-form v-model:show-register-dialog="showRegisterDialog" />
</template>

12
software/src/pages/loginPage/loginForm.vue
View File

@@ -1,4 +1,5 @@
<script setup lang="ts">
const showRegisterDialog = defineModel("showRegisterDialog", { type: Boolean, default: false })
</script>
<template>
@@ -25,14 +26,9 @@
</v-container>
<v-card-text class="text-center">
<a
class="text-secondary text-decoration-none"
href="#"
rel="noopener noreferrer"
target="_blank"
>
{{ $t('noAccountRegister') }} <v-icon icon="mdi-chevron-right"/>
</a>
<v-btn flat append-icon="mdi-chevron-right" @click="showRegisterDialog = true">
{{ $t('noAccountRegister') }}
</v-btn>
</v-card-text>
</v-card>
</template>

54
software/src/pages/loginPage/registerForm.vue Normal file
View File

@@ -0,0 +1,54 @@
<script setup lang="ts">
import actionDialog from '@/components/actionDialog.vue';
const showRegisterDialog = defineModel("showRegisterDialog", { type: Boolean, required: true })
</script>
<template>
<action-dialog v-model="showRegisterDialog" :title="$t('register')">
<template #content>
<v-row>
<v-col>
<v-text-field :label="$t('username')" prepend-icon="mdi-account" clearable />
</v-col>
<v-col>
<v-text-field :label="$t('password')" prepend-icon="mdi-key" type="password" clearable />
</v-col>
</v-row>
<v-row>
<v-col>
<v-text-field :label="$t('userInfo.firstName')" prepend-icon="mdi-card-account-details" clearable />
</v-col>
<v-col>
<v-text-field :label="$t('userInfo.lastName')" clearable />
</v-col>
</v-row>
<v-row>
<v-col>
<v-text-field :label="$t('userInfo.street')" prepend-icon="mdi-numeric" clearable />
</v-col>
<v-col cols="4">
<v-text-field :label="$t('userInfo.houseNumber')" clearable />
</v-col>
</v-row>
<v-row>
<v-col cols="4">
<v-text-field :label="$t('userInfo.postalCode')" prepend-icon="mdi-city" clearable />
</v-col>
<v-col>
<v-text-field :label="$t('userInfo.city')" clearable />
</v-col>
</v-row>
</template>
<template #actions>
<v-btn prepend-icon="mdi-account-plus" color="primary" variant="outlined">{{ $t('register') }}</v-btn>
</template>
</action-dialog>
</template>

92
software/src/pages/productsPage/productDetails.vue
View File

@@ -5,6 +5,7 @@ import { CategoryModel } from '@/data/models/categoryModel';
import { ModelRef, ref } from 'vue';
import { useBasketStore } from '@/data/stores/basketStore';
import { calcProductPrice, productToBasketItem } from '@/scripts/productScripts';
import ActionDialog from '@/components/actionDialog.vue'
const showDialog: ModelRef<boolean> = defineModel()
const nrOfArticles = ref(1)
@@ -23,54 +24,51 @@ function addProductToBasket() {
</script>
<template>
<v-dialog max-width="800" v-model="showDialog">
<v-card :title="product.name" :subtitle="product.brand" >
<v-img :src="'http://127.0.0.1:3000/static/' + product.imageUrl" max-height="300" />
<action-dialog
:title="product.name"
:subtitle="product.brand"
:image-url="'http://127.0.0.1:3000/static/' + product.imageUrl"
v-model="showDialog"
>
<template #content>
<v-row>
<v-col>
<v-icon :icon="productCategory.icon" />
{{ productCategory.name }}
</v-col>
</v-row>
<v-row>
<v-col>
{{ product.description }}
</v-col>
</v-row>
<v-row>
<v-col>
<v-number-input
:reverse="false"
controlVariant="default"
:label="$t('quantity')"
:hideInput="false"
:inset="false"
v-model="nrOfArticles"
:min="1"
:max="10"
density="comfortable"
/>
</v-col>
<v-card-text>
<v-row>
<v-col>
<v-icon :icon="productCategory.icon" />
{{ productCategory.name }}
</v-col>
</v-row>
<v-row>
<v-col>
{{ product.description }}
</v-col>
</v-row>
<v-row>
<v-col>
<v-number-input
:reverse="false"
controlVariant="default"
:label="$t('quantity')"
:hideInput="false"
:inset="false"
v-model="nrOfArticles"
:min="1"
:max="10"
density="comfortable"
/>
</v-col>
<v-spacer />
<v-spacer />
<v-col cols="2" class="justify-center d-flex">
{{ calcProductPrice(product, nrOfArticles) }} €
</v-col>
</v-row>
</template>
<v-col cols="2" class="justify-center d-flex">
{{ calcProductPrice(product, nrOfArticles) }} €
</v-col>
</v-row>
</v-card-text>
<v-card-actions>
<v-btn
prepend-icon="mdi-cart-plus"
@click="addProductToBasket"
>
{{ $t('addToBasket') }}
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<template #actions>
<v-btn prepend-icon="mdi-cart-plus" @click="addProductToBasket" color="primary" variant="outlined">
{{ $t('addToBasket') }}
</v-btn>
</template>
</action-dialog>
</template>