Fix in stock 0 logic
This commit is contained in:
marzban-dev
@@ -183,7 +183,7 @@ watch(
|
||||
|
||||
<div class="flex items-center gap-6 flex-wrap">
|
||||
<ProductVariant
|
||||
@click="variant.in_stock > 0 ? (selectedVariantId = variant.id) : undefined"
|
||||
@click="selectedVariantId = variant.id"
|
||||
v-for="variant in product!.variants.filter(p => p.color === selectedColor)"
|
||||
:key="variant.id"
|
||||
:variantDetail="variant"
|
||||
@@ -193,57 +193,67 @@ watch(
|
||||
|
||||
<div class="w-full flex flex-col gap-6 mt-10">
|
||||
<RemainQuantity
|
||||
v-if="selectedVariant!.in_stock > 0"
|
||||
:showSlider="selectedVariant!.cart_quantity === 0"
|
||||
:maxQuantity="selectedVariant!.in_stock"
|
||||
:quantity="selectedQuantity"
|
||||
/>
|
||||
|
||||
<div class="w-full flex gap-3">
|
||||
<template v-if="token">
|
||||
<Button
|
||||
v-if="selectedVariant!.cart_quantity === 0"
|
||||
@click="addItemToCart"
|
||||
:loading="isAddCartItemPending"
|
||||
:disabled="isAddCartItemPending"
|
||||
class="w-full rounded-full max-sm:h-[48px]"
|
||||
end-icon="ci:plus"
|
||||
>
|
||||
افزودن به سبد خرید
|
||||
</Button>
|
||||
<template v-if="selectedVariant!.in_stock > 0">
|
||||
<template v-if="token">
|
||||
<Button
|
||||
v-if="selectedVariant!.cart_quantity === 0"
|
||||
@click="addItemToCart"
|
||||
:loading="isAddCartItemPending"
|
||||
:disabled="isAddCartItemPending"
|
||||
class="w-full rounded-full max-sm:h-[48px]"
|
||||
end-icon="ci:plus"
|
||||
>
|
||||
افزودن به سبد خرید
|
||||
</Button>
|
||||
<NuxtLink
|
||||
v-else
|
||||
to="/cart"
|
||||
class="w-full"
|
||||
>
|
||||
<Button
|
||||
class="w-full rounded-full h-full max-sm:h-[48px]"
|
||||
end-icon="ci:cart"
|
||||
>
|
||||
مشاهده در سبد خرید
|
||||
</Button>
|
||||
</NuxtLink>
|
||||
</template>
|
||||
<NuxtLink
|
||||
v-else
|
||||
to="/cart"
|
||||
to="/signin"
|
||||
class="w-full"
|
||||
>
|
||||
<Button
|
||||
class="w-full rounded-full h-full max-sm:h-[48px]"
|
||||
end-icon="ci:cart"
|
||||
end-icon="ci:user"
|
||||
>
|
||||
مشاهده در سبد خرید
|
||||
ابتدا وارد شوید
|
||||
</Button>
|
||||
</NuxtLink>
|
||||
</template>
|
||||
<NuxtLink
|
||||
|
||||
<Button
|
||||
v-else
|
||||
to="/signin"
|
||||
class="w-full"
|
||||
class="w-full !cursor-default rounded-full h-full max-sm:h-[48px]"
|
||||
end-icon="ci:cart"
|
||||
>
|
||||
<Button
|
||||
class="w-full rounded-full h-full max-sm:h-[48px]"
|
||||
end-icon="ci:user"
|
||||
>
|
||||
ابتدا وارد شوید
|
||||
</Button>
|
||||
</NuxtLink>
|
||||
اتمام موجودی
|
||||
</Button>
|
||||
|
||||
<QuantityCounter
|
||||
v-if="selectedVariant!.cart_quantity === 0"
|
||||
v-if="selectedVariant!.in_stock > 0 && selectedVariant!.cart_quantity === 0"
|
||||
:disable="isAddCartItemPending"
|
||||
v-model="selectedQuantity"
|
||||
:max="selectedVariant!.in_stock"
|
||||
/>
|
||||
|
||||
<UpdateQuantity v-else />
|
||||
<UpdateQuantity v-else-if="selectedVariant!.in_stock > 0" />
|
||||
</div>
|
||||
|
||||
<InfoCard />
|
||||
|
||||
@@ -13,22 +13,12 @@ defineProps<Props>();
|
||||
|
||||
<template>
|
||||
<div
|
||||
:class="[
|
||||
isSelected ? 'border-blue-500' : 'border-slate-300',
|
||||
variantDetail.in_stock > 0 ? 'cursor-pointer' : '!border-slate-100',
|
||||
]"
|
||||
class="transition-all min-w-[350px] w-full duration-100 p-4 rounded-150 border-[2px] flex gap-4"
|
||||
:class="isSelected ? 'border-blue-500' : 'border-slate-300'"
|
||||
class="transition-all min-w-[350px] w-full duration-100 p-4 rounded-150 border-[2px] flex gap-4 cursor-pointer"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
:class="[
|
||||
isSelected
|
||||
? 'ring-blue-500 bg-blue-500'
|
||||
: 'ring-slate-300 bg-slate-300',
|
||||
variantDetail.in_stock > 0
|
||||
? ''
|
||||
: '!ring-slate-100 !bg-slate-300-100',
|
||||
]"
|
||||
:class="isSelected ? 'ring-blue-500 bg-blue-500' : 'ring-slate-300 bg-slate-300'"
|
||||
class="size-3 mt-2 ring-2 ring-offset-2 rounded-full"
|
||||
></div>
|
||||
</div>
|
||||
@@ -38,27 +28,25 @@ defineProps<Props>();
|
||||
{{ variantDetail.price }}
|
||||
</span>
|
||||
<div
|
||||
v-if="variantDetail.discount > 0"
|
||||
:class="
|
||||
variantDetail.in_stock > 0
|
||||
? 'bg-blue-500'
|
||||
: 'bg-slate-400/60'
|
||||
"
|
||||
class="text-white mb-1 px-3 py-1 text-xs rounded-full w-fit flex items-center justify-center gap-1"
|
||||
v-if="variantDetail.in_stock > 0 && variantDetail.discount > 0"
|
||||
class="text-white mb-1 px-3 py-1 bg-blue-500 text-xs rounded-full w-fit flex items-center justify-center gap-1"
|
||||
>
|
||||
<template v-if="variantDetail.in_stock > 0">
|
||||
<Icon name="bi:percent" class="size-3.5" />
|
||||
<span class="mt-px">
|
||||
{{ variantDetail.discount }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<span v-else class="mt-px"> اتمام موجودی </span>
|
||||
<Icon
|
||||
name="bi:percent"
|
||||
class="size-3.5"
|
||||
/>
|
||||
<span class="mt-px">
|
||||
{{ variantDetail.discount }}
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
v-if="variantDetail.in_stock === 0"
|
||||
class="text-slate-700 mb-1 px-3 py-1 bg-slate-200 text-xs rounded-full w-fit flex items-center justify-center gap-1"
|
||||
>
|
||||
اتمام موجودی
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="w-full flex items-center flex-wrap gap-3 max-w-[400px] mt-4"
|
||||
>
|
||||
<div class="w-full flex items-center flex-wrap gap-3 max-w-[400px] mt-4">
|
||||
<!-- <div-->
|
||||
<!-- class="flex items-center gap-2 text-sm rounded-full border border-slate-400 px-4 h-[40px]"-->
|
||||
<!-- >-->
|
||||
|
||||
Reference in New Issue
Block a user