init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,57 @@
+<template>
+    <div class="header-cart-list-item">
+        <span>{{ quantity }}x</span>
+        <img :src="data.coverPath" />
+        <div>
+            <h3>{{ data.category[data.category.length - 1]?.name }}</h3>
+            <h2>{{ data.title }}</h2>
+            <span>
+                <b>{{ numberFormat(data.specialPrice || data.price) }} </b>
+                {{ $t('priceUnit') }}
+            </span>
+        </div>
+        <Button icon="isax isax-trash" severity="secondary" text @click="$emit('remove', data.id)" />
+    </div>
+</template>
+
+<script setup>
+defineProps(['data', 'quantity'])
+
+const numberFormat = (number) =>
+    new Intl.NumberFormat('fa-IR', { maximumSignificantDigits: 3 }).format(number)
+</script>
+
+<style lang="scss">
+.header-cart-list-item {
+    box-shadow: 0px 2px 12px #004b8226;
+    @apply flex p-2 pl-6 w-[26.9rem] h-[10.1rem] bg-white rounded-lg shadow border relative;
+
+    &>span {
+        @apply absolute left-5 top-4 text-xs font-poppins;
+    }
+
+    img {
+        @apply w-[9.2rem] h-[9.2rem] p-2;
+    }
+
+    div {
+        @apply w-max gap-1 flex flex-col py-4 font-vazir mr-6;
+
+        h3 {
+            @apply text-right text-neutral-400 text-[0.9em] font-medium;
+        }
+
+        h2 {
+            @apply w-[13.1rem] h-14 text-right text-zinc-800 text-[1.1em] font-bold line-clamp-2;
+        }
+
+        span {
+            @apply text-zinc-800 text-[0.9em] mt-auto;
+        }
+    }
+
+    button {
+        @apply w-10 h-10 mb-2 -mx-2 shrink-0 self-end text-2xl text-[#7F7F7F] rounded-full #{!important};
+    }
+}
+</style>
@@ -0,0 +1,64 @@
+<template>
+    <div class="header-cart-list">
+        <h3>{{ $t('itemsSubmittedInCart', { count: cart.count }) }}</h3>
+        <div>
+            <ul>
+                <li v-for="({ product, quantity }, i) in items" :key="i">
+                    <AppDesktopHeaderCartItem :data="product" :quantity="quantity" @remove="remove" />
+                </li>
+            </ul>
+        </div>
+        <Button :label="$t('showCart')" @click="show()" />
+    </div>
+</template>
+
+<script setup>
+const { popup } = inject('service')
+const cart = useCartStore()
+const items = computed(() => cart.items)
+
+const emit = defineEmits(['hide'])
+const router = useRouter()
+
+const show = () => {
+    popup.value.hide()
+    router.push('/checkout/cart')
+}
+const remove = async (id) => {
+    await cart.update(id)
+    if (cart.count < 1) popup.value.hide()
+}
+</script>
+
+<style lang="scss">
+.header-cart-list {
+    box-shadow: 0px 2px 10px 0px rgba(0, 75, 130, 0.16);
+    @apply rtl w-[30.9rem] h-[40.6rem] flex flex-col gap-5 py-6 pl-2 bg-white rounded-2xl border overflow-hidden relative;
+
+    &>h3 {
+        @apply text-sky-700 text-[0.9em] font-medium font-vazir mb-2.5 mr-8 ml-6;
+    }
+
+    &>div {
+        @apply overflow-y-auto h-[29.8rem];
+
+        ul {
+            @apply w-full flex py-3 pr-8 pl-4 flex-col gap-3 items-center;
+        }
+
+        &::-webkit-scrollbar {
+            @apply hidden;
+        }
+    }
+
+    &>button {
+        @apply bg-sky-700 border-sky-700 mr-8 ml-6 text-xl font-bold font-vazir #{!important};
+    }
+
+    &::before {
+        content: ' ';
+        box-shadow: 0px -3px 16px 0px rgba(7, 50, 115, 0.16);
+        @apply absolute inset-x-0 -bottom-3 h-28 z-0;
+    }
+}
+</style>