125 lines
4.0 KiB
Vue
125 lines
4.0 KiB
Vue
<script setup lang="ts">
|
|
|
|
import Textarea from "primevue/textarea";
|
|
import InputText from "primevue/inputtext";
|
|
import Button from "primevue/button";
|
|
import FloatLabel from "primevue/floatlabel";
|
|
import {WishlistItem} from "@/models/WishList";
|
|
import {ref} from "vue";
|
|
import InputGroup from "primevue/inputgroup";
|
|
import InputNumber from "primevue/inputnumber";
|
|
import InputGroupAddon from "primevue/inputgroupaddon";
|
|
import {addWishListItemRequest} from "@/services/WishListService";
|
|
import {useToast} from "primevue/usetoast";
|
|
|
|
const toast = useToast()
|
|
|
|
const props = defineProps({
|
|
wishlistId: String,
|
|
editItem: Object,
|
|
})
|
|
|
|
const emits = defineEmits(["item-created", "creation-cancelled"])
|
|
const isEditing = ref(!!props.editItem)
|
|
const item = ref(props.editItem ? props.editItem : new WishlistItem())
|
|
const inputNameRef = ref()
|
|
const inputDescriptionRef = ref()
|
|
const inputPriceRef = ref()
|
|
const inputLinkRef = ref()
|
|
|
|
const checkForm = () => {
|
|
console.log(inputNameRef.value)
|
|
if (!item.value.name || item.value.name.length === 0) {
|
|
toast.add({
|
|
severity: 'error',
|
|
summary: 'Ошибка создания желания',
|
|
detail: "Название должно быть введено",
|
|
life: 3000
|
|
})
|
|
return false
|
|
} else if (!item.value.description || item.value.description.length === 0) {
|
|
toast.add({
|
|
severity: 'error',
|
|
summary: 'Ошибка создания желания',
|
|
detail: "Описание должно быть введено",
|
|
life: 3000
|
|
})
|
|
return false
|
|
} else if (!item.value.link || item.value.link.length === 0) {
|
|
toast.add({
|
|
severity: 'error',
|
|
summary: 'Ошибка создания желания',
|
|
detail: "Ссылка должна быть введена",
|
|
life: 3000
|
|
})
|
|
return false
|
|
} else if (!item.value.price || item.value.price == 0) {
|
|
toast.add({
|
|
severity: 'error',
|
|
summary: 'Ошибка создания желания',
|
|
detail: "Цена должна быть введена",
|
|
life: 3000
|
|
})
|
|
return false
|
|
} else return true
|
|
}
|
|
const itemCreate = async () => {
|
|
if (checkForm()) {
|
|
await addWishListItemRequest(props.wishlistId, item.value)
|
|
.then(res => {
|
|
emits("item-created", res)
|
|
resetForm()
|
|
})
|
|
.catch(err => {
|
|
console.log(err)
|
|
toast.add({
|
|
severity: 'error',
|
|
summary: 'Ошибка создания желания',
|
|
detail: err.response.data.message,
|
|
life: 3000
|
|
})
|
|
})
|
|
}
|
|
}
|
|
const cancelCreation = () => {
|
|
resetForm()
|
|
emits("creation-cancelled")
|
|
}
|
|
const resetForm = () => {
|
|
item.value = new WishlistItem()
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col">
|
|
<div class="flex flex-col gap-4 mt-1">
|
|
<FloatLabel variant="on" class="w-full">
|
|
<label for="name">Название</label>
|
|
<InputText :ref="inputNameRef" v-model="item.name" id="name" class="w-full"/>
|
|
</FloatLabel>
|
|
<FloatLabel variant="on" class="w-full">
|
|
<label for="name">Описание</label>
|
|
<Textarea :ref="inputDescriptionRef" v-model="item.description" id="name" class="w-full"/>
|
|
</FloatLabel>
|
|
<FloatLabel variant="on" class="w-full">
|
|
<label for="name">Ссылка на товар</label>
|
|
<InputText :ref="inputLinkRef" v-model="item.link" id="name" class="w-full"/>
|
|
</FloatLabel>
|
|
<!-- Сумма -->
|
|
<InputGroup class="w-full">
|
|
<InputGroupAddon>₽</InputGroupAddon>
|
|
<InputNumber :ref="inputPriceRef" v-model="item.price" placeholder="Сумма"/>
|
|
<InputGroupAddon>.00</InputGroupAddon>
|
|
</InputGroup>
|
|
<div class="flex flex-row gap-2 justify-end items-center">
|
|
<Button label="Создать" severity="success" icon="pi pi-save" @click="itemCreate"/>
|
|
<Button label="Отмена" severity="secondary" icon="pi pi-times-circle" @click="cancelCreation"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |