danak/anahita-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed add to cart bugs

Browse Source
This commit is contained in:
mohadese-nm
2024-10-02 09:38:51 +03:30
parent dad18b1a34
commit 1c2169b807
16 changed files with 840 additions and 443 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/app/desktop/header/cart/Item.vue
+66 -43
View File
@@ -1,57 +1,80 @@
<template>
<div class="header-cart-list-item">
<span>{{ quantity }}x</span>
<img :src="data.coverPath" />
<div>
<h3>{{ data.category[data.category.length - 1]?.name }}</h3>
<h2>{{ data.title }}</h2>
<span>
<b>{{ numberFormat(data.specialPrice || data.price) }} </b>
{{ $t('priceUnit') }}
</span>
<div class="flex">
<img :src="product.coverPath" />
<div class="w-full">
<h3>{{ product.category[product.category.length - 1]?.name }}</h3>
<h2>{{ product.title }}</h2>
<span class="text-zinc-800 text-[0.9em] mt-auto">
<b>{{ numberFormat(product.specialPrice * productQuantity || product.price * productQuantity) }} </b>
{{ $t("priceUnit") }}
</span>
<div class="flex flex-row justify-start w-48">
<CartQuantity
v-if="cart.items[index]"
v-model="productQuantity"
:range="product.orderRange"
/>
</div>
</div>
<Button icon="isax isax-trash" severity="secondary" text @click="$emit('remove', data.id)" />
</div>
<!-- <Button
icon="isax isax-trash"
severity="secondary"
text
@click="$emit('remove', product)"
/> -->
</div>
</template>
<script setup>
defineProps(['data', 'quantity'])
const numberFormat = (number) =>
new Intl.NumberFormat('fa-IR', { maximumSignificantDigits: 3 }).format(number)
</script>
<style lang="scss">
.header-cart-list-item {
</template>
<script setup>
const props = defineProps(["id", "index"]);
const cart = useCartStore();
console.log(props.id);
console.log(props.index);
const product = cart.items[props.index].product;
console.log(product);
const productQuantity = computed({
get: () => cart.items[props.index].quantity || 0,
set: (v) => cart.update(product, v),
});
const numberFormat = (number) =>
new Intl.NumberFormat("fa-IR", { maximumSignificantDigits: 3 }).format(
number
);
</script>
<style lang="scss">
.header-cart-list-item {
box-shadow: 0px 2px 12px #004b8226;
@apply flex p-2 pl-6 w-[26.9rem] h-[10.1rem] bg-white rounded-lg shadow border relative;
&>span {
@apply flex p-2 pl-6 w-[26.9rem] bg-white rounded-lg shadow border relative;
& > div {
& > span {
@apply absolute left-5 top-4 text-xs font-poppins;
}
img {
}
img {
@apply w-[9.2rem] h-[9.2rem] p-2;
}
div {
}
div:nth-of-type(1) {
@apply w-max gap-1 flex flex-col py-4 font-vazir mr-6;
h3 {
@apply text-right text-neutral-400 text-[0.9em] font-medium;
@apply text-right text-neutral-400 text-[0.9em] font-medium;
}
h2 {
@apply w-[13.1rem] h-14 text-right text-zinc-800 text-[1.1em] font-bold line-clamp-2;
@apply w-[13.1rem] h-14 text-right text-zinc-800 text-[1.1em] font-bold line-clamp-2;
}
span {
@apply text-zinc-800 text-[0.9em] mt-auto;
& > div {
@apply flex flex-row mr-0 h-14 items-center #{!important};
}
}
}
button {
@apply w-10 h-10 mb-2 -mx-2 shrink-0 self-end text-2xl text-[#7F7F7F] rounded-full #{!important};
}
}
</style>
}
</style>