diff --git a/src/components/WishlistHeader.vue b/src/components/WishlistHeader.vue index 97c5663..d967304 100644 --- a/src/components/WishlistHeader.vue +++ b/src/components/WishlistHeader.vue @@ -65,7 +65,7 @@ import BaseButton from '@/components/BaseButton.vue' import InputText from '@/components/InputText.vue' import InputCheckbox from '@/components/InputCheckbox.vue' import InputTextArea from '@/components/InputTextArea.vue' -import { useEditMode, useWishlistStore } from '@/composables' +import { useEditMode } from '@/composables' import { Wishlist } from '@/types' import { PropType } from 'vue' const { isActive: editModeIsActive } = useEditMode() @@ -76,9 +76,9 @@ defineProps({ requried: true, }, }) +const emit = defineEmits(['update']) const { t } = useI18n() -const { update } = useWishlistStore() const schema = object({ title: string().required( @@ -99,8 +99,7 @@ const schema = object({ .url(t('components.wishlist-header.main.form.image-src.error-url')), }) -const onSubmit = async (values: any): Promise<void> => { - console.log(values) - await update(values) +const onSubmit = (values: any): void => { + emit('update', values) } </script> diff --git a/src/views/DetailView.vue b/src/views/DetailView.vue index 4ff5a83..92d539c 100644 --- a/src/views/DetailView.vue +++ b/src/views/DetailView.vue @@ -1,19 +1,20 @@ <script setup lang="ts"> import { useI18n } from 'vue-i18n' -import { WishlistItem as WishlistItemType } from '@/types' +import { Wishlist, WishlistItem as WishlistItemType } from '@/types' import { computed } from 'vue' -import { useRoute } from 'vue-router' +import { useRoute, useRouter } from 'vue-router' import { useWishlistStore, useModal } from '@/composables' import WishlistItem from '@/components/WishlistItem.vue' import WishlistHeader from '@/components/WishlistHeader.vue' import { IconNoGift } from '../components/icons' const route = useRoute() +const router = useRouter() const modal = useModal() const { t } = useI18n() -const { state, fetch, itemBought } = useWishlistStore() +const { state, fetch, itemBought, update: updateWishlist } = useWishlistStore() await fetch(route.params.slug as string) const notBoughtItems = computed(() => { @@ -33,11 +34,16 @@ const bought = async (item: WishlistItemType): Promise<void> => { itemBought(item) } } + +const handleUpdateWishlist = async (values: Wishlist) => { + await updateWishlist(values) + router.push(`/${state.value?.slugUrlText}`) +} </script> <template> <div v-if="state !== null" class="h-full"> - <WishlistHeader v-model="state" /> + <WishlistHeader v-model="state" @update="handleUpdateWishlist" /> <div v-if="notBoughtItems && notBoughtItems.length > 0" class="flex flex-col space-y-14 py-10 md:space-y-8"