heymlz/hossein-por-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed discount button color

Browse Source
This commit is contained in:
Mamalizz
2025-04-17 00:31:21 +03:30
parent dbdadb78b2
commit 325a41076c
1 changed files with 25 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/cart/global/CartSummary.vue
+25 -47
View File
@@ -20,26 +20,15 @@ const { data: cart, isLoading: cartIsLoading } = useGetCartOrders();
const discountCode = ref(cart.value?.discount_code?.code || "");
const {
mutateAsync: submitDiscountCode,
isPending: submitDiscountCodeIsPending,
} = useSubmitDiscountCode();
const { mutateAsync: submitDiscountCode, isPending: submitDiscountCodeIsPending } = useSubmitDiscountCode();
const {
mutateAsync: deleteDiscountCode,
isPending: deleteDiscountCodeIsPending,
} = useDeleteDiscountCode();
const { mutateAsync: deleteDiscountCode, isPending: deleteDiscountCodeIsPending } = useDeleteDiscountCode();
const { mutateAsync: pay, isPending: paymentIsPending } = usePayOrder();
// computed
const nextPage = computed(
() =>
route.meta.nextPage as
| { name: string; label: string; query?: string }
| undefined
);
const nextPage = computed(() => route.meta.nextPage as { name: string; label: string; query?: string } | undefined);
const hasSubmittedDiscountCode = computed(() => !!cart.value?.discount_code);
@@ -109,17 +98,20 @@ const handlePayment = () => {
</script>
<template>
<div
class="flex flex-col bg-slate-50 w-full lg:w-3/12 transition-all border border-slate-200 rounded-xl"
>
<div
class="w-full flex items-center justify-between py-5 px-4 border-b border-slate-200"
>
<div class="flex flex-col bg-slate-50 w-full lg:w-3/12 transition-all border border-slate-200 rounded-xl">
<div class="w-full flex items-center justify-between py-5 px-4 border-b border-slate-200">
<span class="typo-sub-h-xl text-black">فاکتور خرید</span>
<Icon name="ci:cart" class="**:stroke-black" size="24" />
<Icon
name="ci:cart"
class="**:stroke-black"
size="24"
/>
</div>
<div v-if="cartIsLoading" class="flex flex-col p-4 gap-4 !rounded-lg">
<div
v-if="cartIsLoading"
class="flex flex-col p-4 gap-4 !rounded-lg"
>
<Skeleton
v-for="i in 5"
:key="i"
@@ -130,10 +122,11 @@ const handlePayment = () => {
/>
</div>
<div v-else class="flex flex-col p-4 gap-4">
<div
class="flex items-center justify-between w-full text-slate-800"
>
<div
v-else
class="flex flex-col p-4 gap-4"
>
<div class="flex items-center justify-between w-full text-slate-800">
<span class="max-w-1/2 text-sm"> جمع سبد خرید: </span>
<span class="max-w-1/2 text-sm">
@@ -141,9 +134,7 @@ const handlePayment = () => {
</span>
</div>
<div
class="flex items-center justify-between w-full text-slate-800"
>
<div class="flex items-center justify-between w-full text-slate-800">
<span class="max-w-1/2 text-sm"> مالیات ارزش افزوده: </span>
<span class="max-w-1/2 text-sm"> {{ cart?.tax }} </span>
@@ -160,9 +151,7 @@ const handlePayment = () => {
</span>
</div>
<div
class="flex items-center justify-between w-full text-slate-900"
>
<div class="flex items-center justify-between w-full text-slate-900">
<span class="max-w-1/2 text-sm"> جمع کل: </span>
<span class="max-w-1/2 text-sm">
@@ -178,23 +167,12 @@ const handlePayment = () => {
:disabled="hasSubmittedDiscountCode"
/>
<button
@click="
hasSubmittedDiscountCode
? handleDeleteDiscountCode()
: handleSubmitDiscountCode()
"
class="text-xs px-5 rounded-e-100 py-1.5 text-white bg-blue-500 hover:bg-transparent hover:text-blue-500 border-[1.5px] border-blue-500 hover:border-white transition-all disabled:cursor-not-allowed"
:disabled="
!discountCode.length ||
submitDiscountCodeIsPending ||
deleteDiscountCodeIsPending
"
@click="hasSubmittedDiscountCode ? handleDeleteDiscountCode() : handleSubmitDiscountCode()"
class="text-xs px-5 rounded-e-100 py-1.5 text-white bg-black hover:bg-transparent hover:text-black border-[1.5px] border-black hover:border-black transition-all disabled:cursor-not-allowed"
:disabled="!discountCode.length || submitDiscountCodeIsPending || deleteDiscountCodeIsPending"
>
<Icon
v-if="
submitDiscountCodeIsPending ||
deleteDiscountCodeIsPending
"
v-if="submitDiscountCodeIsPending || deleteDiscountCodeIsPending"
name="svg-spinners:180-ring-with-bg"
size="20"
class="**:fill-white"