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/product/Buy.vue
+83 -76
View File
@@ -1,89 +1,96 @@
<template>
<div class="buy">
<p>
<span>{{ $t('priceForYou') }}</span>
<small v-if="boxSeller">
{{ $t('everyBox') }}
</small>
</p>
<div>
<span v-if="specialPrice">
{{ numberFormat(specialPrice) }}
<small>{{ $t('priceUnit') }}</small>
</span>
<span>
{{ numberFormat(price) }}
<small v-if="!specialPrice">
{{ $t('priceUnit') }}
</small>
</span>
</div>
<CartQuantity v-if="cart.find(id)" v-model="quantity" :range="orderRange" />
<Button v-else :label="$t('addToCart')" :loading="cart.loading" @click="quantity = orderRange.min" />
<p>
<span>{{ $t("priceForYou") }}</span>
<small v-if="boxSeller">
{{ $t("everyBox") }}
</small>
</p>
<div>
<span v-if="specialPrice">
{{ numberFormat(specialPrice) }}
<small>{{ $t("priceUnit") }}</small>
</span>
<span>
{{ numberFormat(price) }}
<small v-if="!specialPrice">
{{ $t("priceUnit") }}
</small>
</span>
</div>
<CartQuantity v-if="cart.find(id)" v-model="quantity" :range="orderRange" />
<Button v-else :label="$t('addToCart')" :loading="cart.loading" @click="quantity = orderRange.min" />
</div>
</template>
<script setup>
const { id, orderRange, boxSeller, specialPrice, price } = inject('data')
const cart = useCartStore()
const quantity = computed({
</template>
<script setup>
const product = inject("data");
const { id, orderRange, boxSeller, specialPrice, price } = product;
const cart = useCartStore();
const quantity = computed({
get: () => cart.find(id)?.quantity || 0,
set: (v) => cart.update(id, v)
})
const numberFormat = (number) =>
new Intl.NumberFormat('fa-IR', { maximumSignificantDigits: 3 }).format(number)
</script>
<style lang="scss">
.product .buy {
set: (v) => cart.update(product, v),
});
// const productAddedToCart = computed(() => {
// cart.items.find((item) => item.product._id == id);
// });
// console.log(productAddedToCart);
const numberFormat = (number) =>
new Intl.NumberFormat("fa-IR", { maximumSignificantDigits: 3 }).format(
number
);
</script>
<style lang="scss">
.product .buy {
@apply flex flex-wrap justify-between items-center px-6 pt-1 pb-2.5 lg:gap-6 shadow-[0px_-3px_5px_#00000005];
@apply fixed inset-x-0 bottom-0 h-[6.2rem] bg-white shadow border-t border-[#F1F2F4] lg:h-auto;
@apply z-10 lg:z-0 lg:static lg:bg-transparent lg:shadow-none lg:border-t-0 lg:p-0 lg:gap-y-6 lg:mt-auto;
p {
@apply w-full lg:w-max text-[#7F7F7F] font-medium font-vazir pr-1.5 lg:p-0;
span {
@apply text-xs lg:text-xl leading-[2.1rem];
}
small {
@apply text-[0.7em] lg:text-base leading-[1.9rem];
}
@apply w-full lg:w-max text-[#7F7F7F] font-medium font-vazir pr-1.5 lg:p-0;
span {
@apply text-xs lg:text-xl leading-[2.1rem];
}
small {
@apply text-[0.7em] lg:text-base leading-[1.9rem];
}
}
&>div:nth-of-type(1) {
@apply flex flex-col justify-end gap-2 max-lg:order-last;
span {
@apply text-left text-[#333] text-sm font-bold lg:text-[1.6em] font-vazir;
& > div:nth-of-type(1) {
@apply flex flex-col justify-end gap-2 max-lg:order-last;
span {
@apply text-left text-[#333] text-sm font-bold lg:text-[1.6em] font-vazir;
}
small {
@apply text-xs font-medium lg:hidden;
}
&:has(span:nth-child(2)) {
span:first-child {
@apply max-lg:-mt-8;
}
small {
@apply text-xs font-medium lg:hidden;
}
&:has(span:nth-child(2)) {
span:first-child {
@apply max-lg:-mt-8;
}
span:last-child {
@apply line-through text-xs lg:text-base text-gray-600;
}
span:last-child {
@apply line-through text-xs lg:text-base text-gray-600;
}
}
}
&>button {
@apply w-[10.8rem] h-[2.6rem] lg:w-[25.1rem] lg:h-14 #{!important};
.p-button-label {
@apply text-xs lg:text-xl font-bold font-iran-sans;
}
& > button {
@apply w-[10.8rem] h-[2.6rem] lg:w-[25.1rem] lg:h-14 #{!important};
.p-button-label {
@apply text-xs lg:text-xl font-bold font-iran-sans;
}
}
}
</style>
}
</style>