nikitakiselev/interview-demo-code
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(products): show correct product prices

Browse Source
This commit is contained in:
Nikita Kiselev
2025-09-25 19:06:15 +03:00
parent acbfaebcf4
commit 35dd0de261
12 changed files with 270 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
spa/src/views/Product.vue
View File

@@ -22,21 +22,33 @@
/>
<!-- Product info -->
<div
class="mx-auto max-w-2xl px-4 pt-3 pb-24 sm:px-6 rounded-t-lg">
<div class="mx-auto max-w-2xl px-4 pt-3 pb-32 sm:px-6 rounded-t-lg">
<div class="lg:col-span-2 lg:border-r lg:pr-8">
<h1 class="text-2xl font-bold tracking-tight sm:text-3xl">{{ product.name }}</h1>
<h1 class="font-bold tracking-tight text-3xl">{{ product.name }}</h1>
</div>
<div>
<h3 class="text-sm font-medium">{{ product.manufacturer }}</h3>
</div>
<div class="mt-4 lg:row-span-3 lg:mt-0">
<p class="text-3xl tracking-tight">{{ product.price }}</p>
<div v-if="product.special" class="flex items-center">
<p class="text-2xl tracking-tight mr-3">{{ product.special }}</p>
<p class="text-base-400 line-through">{{ product.price }}</p>
</div>
<p v-else class="text-3xl tracking-tight">{{ product.price }}</p>
<p v-if="product.tax" class="text-sm">Без НДС: {{ product.tax }}</p>
<p v-if="product.points && product.points > 0" class="text-sm">Бонусные баллы: {{ product.points }}</p>
<p v-for="discount in product.discounts" class="text-sm">
{{ discount.quantity }} или больше {{ discount.price }}
</p>
<p v-if="false" class="text-xs">Кол-во на складе: {{ product.quantity }} шт.</p>
<p v-if="product.minimum && product.minimum > 1">Минимальное кол-ва для заказа: {{ product.minimum }}</p>
<p v-if="product.minimum && product.minimum > 1">Минимальное кол-во для заказа: {{ product.minimum }}</p>
</div>
<div class="badge badge-primary">{{ product.stock }}</div>
<div v-if="product.options && product.options.length" class="mt-4">
<ProductOptions v-model="product.options"/>
</div>
@@ -51,14 +63,14 @@
</div>
</div>
<div v-if="product.attributes && product.attributes.length > 0" class="mt-3">
<div v-if="product.attribute_groups && product.attribute_groups.length > 0" class="mt-3">
<h3 class="font-bold mb-2">Характеристики</h3>
<div class="space-y-6">
<div class="overflow-x-auto">
<table class="table table-xs">
<tbody>
<template v-for="attrGroup in product.attributes" :key="attrGroup.attribute_group_id">
<template v-for="attrGroup in product.attribute_groups" :key="attrGroup.attribute_group_id">
<tr class="bg-base-200 font-semibold">
<td colspan="2">{{ attrGroup.name }}</td>
</tr>
@@ -76,7 +88,7 @@
</div>
</div>
<div v-if="product.id" class="fixed px-4 pb-10 pt-4 bottom-0 left-0 w-full bg-base-200 z-50 flex flex-col gap-2 border-t-1 border-t-base-300">
<div v-if="product.product_id" class="fixed px-4 pb-10 pt-4 bottom-0 left-0 w-full bg-base-200 z-50 flex flex-col gap-2 border-t-1 border-t-base-300">
<div class="text-error">
{{ error }}
</div>
@@ -107,6 +119,8 @@
</div>
</div>
<ProductNotFound v-else/>
<FullScreenImageViewer
v-if="isFullScreen"
:images="product.images"
@@ -127,6 +141,7 @@ import {SUPPORTED_OPTION_TYPES} from "@/constants/options.js";
import {apiFetch} from "@/utils/ftch.js";
import FullScreenImageViewer from "@/components/FullScreenImageViewer.vue";
import LoadingFullScreen from "@/components/LoadingFullScreen.vue";
import ProductNotFound from "@/components/ProductNotFound.vue";
const route = useRoute();
const productId = computed(() => route.params.id);