Merge branch 'main' of https://github.com/Byeto-Company/hossein_por_shop
This commit is contained in:
@@ -324,8 +324,8 @@ watch(
|
||||
:to="{ name: nextPage?.name, query: { gw: nextPage?.query } }"
|
||||
>
|
||||
<Button
|
||||
start-icon="arrow-right"
|
||||
class="w-full rounded-100"
|
||||
start-icon="ci:arrow-right"
|
||||
class="w-full rounded-100 py-2 lg:typo-p-sm"
|
||||
variant="primary"
|
||||
>
|
||||
{{ nextPage?.label }}
|
||||
|
||||
@@ -59,7 +59,7 @@ const handleDeleteFromCart = () => {
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
@@ -106,9 +106,9 @@ watch(
|
||||
},
|
||||
});
|
||||
},
|
||||
}
|
||||
},
|
||||
);
|
||||
}
|
||||
},
|
||||
);
|
||||
</script>
|
||||
|
||||
@@ -117,8 +117,12 @@ watch(
|
||||
class="flex flex-col items-center w-full gap-4 p-4 border lg:flex-row border-slate-200 rounded-xl bg-slate-50 overflow-hidden relative"
|
||||
>
|
||||
<div class="flex items-start justify-start w-full gap-2.5 lg:gap-4">
|
||||
<Skeleton
|
||||
v-if="cartImageIsLoading"
|
||||
class="size-[4rem] lg:!size-[12rem] aspect-square shrink-0 !rounded-xl border border-slate-200"
|
||||
/>
|
||||
<div
|
||||
v-if="!cartImageIsLoading"
|
||||
v-else
|
||||
class="size-[4rem] lg:size-[12rem] aspect-square shrink-0 rounded-xl border border-slate-200 overflow-hidden"
|
||||
>
|
||||
<NuxtImg
|
||||
@@ -129,10 +133,6 @@ watch(
|
||||
alt="product"
|
||||
/>
|
||||
</div>
|
||||
<Skeleton
|
||||
v-else
|
||||
class="!size-[12rem] aspect-square shrink-0 !rounded-xl border border-slate-200"
|
||||
/>
|
||||
|
||||
<div class="flex flex-col w-full gap-3 lg:gap-4">
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
@@ -142,7 +142,7 @@ watch(
|
||||
<div class="w-max flex-center gap-2">
|
||||
<div
|
||||
v-if="data.discount > 0"
|
||||
class="text-white bg-blue-500 px-3 lg:px-4 py-1.5 lg:py-2 text-[10px] lg:text-xs rounded-full flex items-center gap-1"
|
||||
class="text-white whitespace-pre bg-blue-500 px-3 lg:px-4 py-1.5 lg:py-2 text-[8px] lg:text-xs rounded-full flex items-center gap-1"
|
||||
>
|
||||
{{ data.discount_amount }}
|
||||
تخفیف
|
||||
@@ -164,7 +164,7 @@ watch(
|
||||
{{ data.product.title }}
|
||||
</NuxtLink>
|
||||
|
||||
<div class="flex items-center justify-start gap-1.5">
|
||||
<div class="flex items-center justify-start flex-wrap gap-1.5">
|
||||
<div
|
||||
v-if="!!data.product.color"
|
||||
class="px-3 py-1 rounded-full border border-slate-200 text-xs lg:text-sm flex-center gap-1.5"
|
||||
@@ -182,7 +182,7 @@ watch(
|
||||
v-if="data.product.product_attributes.length > 0"
|
||||
v-for="(variant, index) in data.product.product_attributes"
|
||||
:index="index"
|
||||
class="px-3 py-1 rounded-full border border-slate-200 text-xs lg:text-sm"
|
||||
class="px-3 py-1 whitespace-pre rounded-full border border-slate-200 text-xs lg:text-sm"
|
||||
>
|
||||
{{ variant.value }}
|
||||
</span>
|
||||
@@ -305,7 +305,7 @@ watch(
|
||||
<div class="flex flex-col items-end">
|
||||
<span
|
||||
v-if="data.discount > 0"
|
||||
class="typo-p-xs relative flex-center w-fit line-through text-slate-400"
|
||||
class="text-[10px] lg:typo-p-xs relative flex-center w-fit line-through text-slate-400"
|
||||
>
|
||||
{{ data.price }}
|
||||
</span>
|
||||
@@ -315,7 +315,7 @@ watch(
|
||||
>
|
||||
تخفیف ویژه: {{ data.special_discount_amount }}
|
||||
</span>
|
||||
<span class="typo-p-md relative flex-center w-fit font-medium">
|
||||
<span class="typo-p-sm lg:typo-p-md relative flex-center w-fit font-medium">
|
||||
{{ data.final_price }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -54,8 +54,7 @@ const handleSubmit = () => {
|
||||
>
|
||||
<template #trigger>
|
||||
<Button
|
||||
class="rounded-full shrink-0 whitespace-pre"
|
||||
end-icon="ci:bi-trash"
|
||||
class="rounded-full shrink-0 whitespace-pre max-lg:text-[10px]! max-lg:py-1"
|
||||
size="md"
|
||||
>
|
||||
حذف همه
|
||||
|
||||
@@ -50,50 +50,44 @@ const isShow = computed({
|
||||
class="bg-black/50 backdrop-blur-sm data-[state=open]:animate-overlay-show fixed inset-0 z-999"
|
||||
/>
|
||||
|
||||
<div
|
||||
class="fixed inset-0 w-full h-svh z-9999 flex-center"
|
||||
v-if="isShow"
|
||||
<DialogContent
|
||||
class="fixed inset-0 z-9999 flex items-start justify-center overflow-y-auto overscroll-contain data-[state=open]:animate-content-show focus:outline-none"
|
||||
style="touch-action: pan-y"
|
||||
>
|
||||
<div
|
||||
:class="contectClass"
|
||||
class="overflow-y-auto max-h-svh absolute left-[50%] py-10 w-fit max-w-[50rem] translate-x-[-50%]"
|
||||
class="relative w-fit max-w-[50rem] my-auto py-10"
|
||||
>
|
||||
<DialogContent
|
||||
class="data-[state=open]:animate-content-show text-black font-iran-yekan-x focus:outline-none z-[100]"
|
||||
<div
|
||||
class="rounded-2xl bg-white text-black font-iran-yekan-x shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px]"
|
||||
>
|
||||
<div
|
||||
class="rounded-2xl bg-white shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px]"
|
||||
class="w-full flex items-center px-6 justify-between py-[1.5rem] border-b border-slate-200"
|
||||
>
|
||||
<div
|
||||
class="w-full flex items-center px-6 justify-between py-[1.5rem] border-b border-slate-200"
|
||||
<DialogClose
|
||||
class="inline-flex size-8 items-center justify-center transition-all rounded-full bg-gray-50 border border-slate-200 hover:border-black focus:outline-none"
|
||||
aria-label="Close"
|
||||
>
|
||||
<DialogClose
|
||||
class="inline-flex size-8 items-center justify-center transition-all rounded-full bg-gray-50 border border-slate-200 hover:border-black focus:outline-none"
|
||||
aria-label="Close"
|
||||
>
|
||||
<Icon
|
||||
name="ci:bi-x-lg"
|
||||
class="**:fill-black"
|
||||
/>
|
||||
</DialogClose>
|
||||
<DialogTitle
|
||||
class="typo-sub-h-md lg:typo-sub-h-xl font-semibold flex items-center gap-3"
|
||||
>
|
||||
{{ title }}
|
||||
<Icon
|
||||
v-if="!!icon"
|
||||
:name="icon"
|
||||
:size="iconSize"
|
||||
/>
|
||||
</DialogTitle>
|
||||
</div>
|
||||
<div class="w-full px-6">
|
||||
<slot name="content" />
|
||||
</div>
|
||||
<Icon
|
||||
name="ci:bi-x-lg"
|
||||
class="**:fill-black"
|
||||
/>
|
||||
</DialogClose>
|
||||
<DialogTitle class="typo-sub-h-md lg:typo-sub-h-xl font-semibold flex items-center gap-3">
|
||||
{{ title }}
|
||||
<Icon
|
||||
v-if="!!icon"
|
||||
:name="icon"
|
||||
:size="iconSize"
|
||||
/>
|
||||
</DialogTitle>
|
||||
</div>
|
||||
</DialogContent>
|
||||
<div class="w-full px-6">
|
||||
<slot name="content" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</DialogPortal>
|
||||
</DialogRoot>
|
||||
</template>
|
||||
|
||||
@@ -124,7 +124,7 @@ const resetAvatarFile = async () => {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="w-full flex-center gap-4 max-w-[500px] flex-wrap">
|
||||
<!-- <div class="w-full flex-center gap-4 max-w-[500px] flex-wrap">
|
||||
<button
|
||||
class="size-6 lg:size-8 rounded-full bg-orange-100 whitespace-nowrap ring-2 hover:ring-black ring-slate-200 ring-offset-3"
|
||||
/>
|
||||
@@ -140,7 +140,7 @@ const resetAvatarFile = async () => {
|
||||
<button
|
||||
class="size-6 lg:size-8 rounded-full bg-amber-800 whitespace-nowrap ring-2 hover:ring-black ring-slate-200 ring-offset-3"
|
||||
/>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="w-full flex-col-center gap-5">
|
||||
<Avatar
|
||||
|
||||
@@ -40,7 +40,7 @@ const hasCartItem = computed(() => !!cart.value && cart.value.items.length! > 0)
|
||||
class="flex items-center gap-2 text-sm lg:text-[1rem] font-medium"
|
||||
>
|
||||
<Icon
|
||||
name="ci:bi-arrow-right"
|
||||
name="ci:arrow-right"
|
||||
class="**:stroke-blue-500"
|
||||
/>
|
||||
<span class="text-blue-500">
|
||||
@@ -49,7 +49,7 @@ const hasCartItem = computed(() => !!cart.value && cart.value.items.length! > 0)
|
||||
</NuxtLink>
|
||||
</div>
|
||||
|
||||
<h1 class="w-full text-center lg:w-6/12 typo-h-5 lg:typo-h-4">
|
||||
<h1 v-if="pageTitle" class="w-full text-center lg:w-6/12 typo-h-5 lg:typo-h-4">
|
||||
{{ pageTitle }}
|
||||
</h1>
|
||||
|
||||
|
||||
@@ -29,7 +29,7 @@ const hasCartItem = computed(() => !!cart.value && cart.value.items.length! > 0)
|
||||
<div class="w-full flex flex-col gap-4 lg:gap-6">
|
||||
<div
|
||||
v-if="hasCartItem"
|
||||
class="flex items-center justify-between w-full gap-3 px-4 py-4 rounded-xl bg-slate-50 border border-slate-200"
|
||||
class="flex items-center justify-between w-full gap-3 px-4 py-2 lg:py-4 rounded-xl bg-slate-50 border border-slate-200"
|
||||
>
|
||||
<Skeleton
|
||||
v-if="cartIsLoading"
|
||||
|
||||
Reference in New Issue
Block a user