kashkool ver 1

src/views/base/cart/index.vue

@@ -80,27 +80,56 @@
         <!-- Total and Checkout -->
         <div class=" flex justify-center  fixed bottom-20 left-0 right-0  z-1">
           <div class="md:w-[426px] w-full bg-white border-t border-gray-200 p-4 shadow-lg">
+            <div
+              v-if="discountInfo?.amount > 0"
+              class="mb-3 flex items-center justify-between rounded-lg bg-purple-50 px-3 py-2"
+            >
+              <div class="flex flex-col gap-0.5 text-sm">
+                <div class="flex items-center gap-2">
+                  <span class="text-gray-600">کد تخفیف:</span>
+                  <span class="font-semibold">{{ discountInfo.code }}</span>
+                </div>
+                <div class="text-xs text-green-600">
+                  {{ discountPercentLabel }} تخفیف اعمال شد
+                </div>
+              </div>
+              <button
+                type="button"
+                class="flex items-center gap-1 text-xs text-red-500"
+                @click="removeDiscount"
+              >
+                <BasicIcon icon="vuesax-linear:close-circle" size="18" />
+                <span>حذف</span>
+              </button>
+            </div>
+
             <div class="flex justify-between items-center mb-4">
               <div class="text-lg font-semibold">مجموع:</div>
-              <div class="flex flex-col gap-2 ">
+              <div class="flex flex-col items-end gap-1">
                 <div class="text-primary font-bold text-xl">
                   {{ usePrice(displaytotalPrice) }}
                 </div>
-
+                <div
+                  v-if="discountInfo?.amount > 0"
+                  class="text-xs text-gray-400 line-through"
+                >
+                  {{ usePrice(totalPrice) }}
+                </div>
               </div>
-
-              <div class="!text-primary font-bold text-xs line-through  cursor-pointer "
-                   v-if="discountInfo?.amount>0"
-                   @click="showDiscountModal=true">
-                {{ usePrice(totalPrice) }}
-              </div>
-              <div v-else
-                   class="!text-primary font-bold text-xs underline-solid underline cursor-pointer"
-                   @click="showDiscountModal=true">
-                کد تخفیف دارم
-              </div>
-
             </div>
+
+            <div
+              v-if="!discountInfo?.amount"
+              class="mb-3 text-center"
+            >
+              <span
+                class="text-xs text-primary underline cursor-pointer"
+                @click="showDiscountModal = true"
+              >
+                کد تخفیف دارم
+              </span>
+            </div>
+
             <BasicButton
                 class="w-full py-3"
                 type="primary"
@@ -186,6 +215,18 @@ const displaytotalPrice = computed(() => {
     return totalPrice.value
 })
 
+const discountPercentLabel = computed(() => {
+  const amount = Number(discountInfo.value?.amount ?? 0)
+  if (amount <= 0) return ''
+  return `${Math.round(amount * 100)}٪`
+})
+
+function removeDiscount() {
+  discountInfo.value = undefined
+  discountCode.value = ''
+  message.success('کد تخفیف حذف شد')
+}
+
 async function submitDiscount() {
   try {
     loading.value = true

src/views/base/index.vue

@@ -127,8 +127,6 @@
                src="@/assets/img/logo.png"
              />
            </div>
-<!--           <div class="flex justify-center">خرید </div>
-           <div class="flex justify-center">محصول </div>-->
          </div>
         </div>
 <!--        <div :class="setNavColor('buyProduct')" class="tab" @click="setRoute('buyProduct')">
@@ -166,16 +164,14 @@
           <div class="text-xs mt-1 font-bold">درباره ما</div>
         </div>
         <div class="main_in">
-          <div class="text-white circle_in">
-            <div class="circle_into " @click="popVisible = !popVisible">
-              <img
-                  class="p-2"
-                  src="@/assets/img/logo.png"
-              />
-            </div>
-            <!--           <div class="flex justify-center">خرید </div>
-                       <div class="flex justify-center">محصول </div>-->
-          </div>
+         <div class="text-white circle_in">
+           <div class="circle_into " @click="popVisible = !popVisible">
+             <img
+               class="p-2"
+               src="@/assets/img/logo.png"
+             />
+           </div>
+         </div>
         </div>
         <!--        <div :class="setNavColor('buyProduct')" class="tab" @click="setRoute('buyProduct')">
                   <Icon icon="vuesax-linear:coin" />