init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,120 @@
+<template>
+    <div class="seller-add-spec">
+        <div>
+            <div>
+                <h2>{{ $t("addSpec") }}</h2>
+                <Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
+            </div>
+            <p>{{ dialog.data.title }}</p>
+        </div>
+        <ul>
+            <li>
+                <InputText v-model="form.key" placeholder id="key" />
+                <label for="key">{{ $t('title') }}</label>
+            </li>
+            <li>
+                <Textarea v-model="form.value" placeholder id="value" />
+                <label for="value">{{ $t("description") }}</label>
+            </li>
+        </ul>
+        <Button :label="$t('submitSpec')" @click="add()" />
+    </div>
+</template>
+
+<script setup>
+const dialog = inject('dialogRef')
+const form = reactive({})
+
+const add = () => {
+    dialog.value.data.specs[form.key] = form.value
+    dialog.value.close();
+}
+</script>
+
+<style lang="scss">
+.seller-add-spec {
+    @apply w-full lg:w-[40.1rem] lg:h-[38.6rem] bg-white rounded-t-[0.6rem] lg:rounded-[0.6rem] flex flex-col relative;
+
+    &::after {
+        @apply content-['_'] absolute inset-x-0 bottom-[4.5rem] h-3 shadow-[0px_-2px_5px_#0000000a] lg:shadow-none;
+    }
+
+    &>div {
+        @apply flex flex-col gap-1.5 lg:h-[7.8rem] lg:gap-3 border-b lg:border-b-2 border-[#E5E5E5] p-6 lg:px-10 lg:pt-8 pb-6;
+
+        &>div {
+            @apply flex justify-between items-center;
+
+            h2 {
+                @apply text-[#333333] text-sm lg:text-xl font-bold font-vazir;
+            }
+
+            button {
+                @apply -mx-4 -my-3;
+
+                .p-button-icon {
+                    @apply text-[1.4em] lg:text-3xl text-[#191919];
+                }
+            }
+        }
+
+        p {
+            @apply text-[#7F7F7F] text-[0.7em] lg:text-lg font-normal font-vazir;
+        }
+    }
+
+    &>ul {
+        @apply flex flex-col h-full items-center gap-[1.1rem] px-6 pt-9 lg:gap-5 lg:pt-6 lg:px-10;
+
+        li {
+            @apply flex items-center gap-4 cursor-pointer w-max select-none relative;
+            @apply w-[21.4rem] lg:w-[27.1rem];
+
+            label {
+                @apply w-max absolute right-3 top-4 lg:top-3.5 px-1 bg-white transition-['top'];
+                @apply text-neutral-400 text-sm lg:text-base font-medium font-vazir cursor-text;
+                @apply pointer-events-none;
+            }
+
+            input, textarea {
+                @apply h-[3.4rem] pl-10 rtl w-full rounded-[0.6rem] border shadow-none;
+                @apply text-[#4C4C4C] font-vazir grow;
+            }
+
+            &:has(input:focus),
+            &:has(textarea:focus),
+            &:has(input:not(:placeholder-shown)),
+            &:has(textarea:not(:placeholder-shown)) {
+                label {
+                    @apply -top-2 h-4;
+                    @apply text-[#4C4C4C] text-xs font-normal font-vazir;
+                }
+            }
+        }
+
+        li:last-child {
+            @apply w-full lg:w-[27.1rem] h-full flex flex-col items-start gap-4 mt-3 lg:mt-4;
+
+            // label {
+            //     @apply text-[#7F7F7F] text-xs lg:text-xl font-medium font-vazir max-lg:mr-2.5;
+            // }
+
+            textarea {
+                @apply w-full h-[9.6rem] lg:h-full p-4 rounded-[0.6rem] border border-[#E5E5E5];
+
+                // &::placeholder {
+                //     @apply text-[#999999] text-[0.7em] lg:text-lg font-normal font-vazir;
+                // }
+            }
+        }
+    }
+
+    &>button {
+        @apply h-[2.9rem] m-6 mt-8 lg:h-14 lg:m-10 lg:mt-9 shrink-0 #{!important};
+
+        .p-button-label {
+            @apply font-bold font-iran-sans text-sm lg:text-base;
+        }
+    }
+}
+</style>
@@ -0,0 +1,31 @@
+<template>
+    <div class="seller-product-added">
+        <div>
+            <i class="isax isax-tick-square"></i>
+            <h2>{{ $t('productAdded') }}</h2>
+        </div>
+        <Button :label="$t('confirm')" />
+    </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss">
+.eller-product-added {
+    @apply flex flex-col justify-between pt-[1.1rem] max-lg:h-[11.8rem] lg:w-[28.3rem] lg:h-64 lg:p-10;
+
+    div {
+        @apply flex max-lg:flex-col items-center gap-4 lg:mt-4;
+
+        h2 {
+            @apply text-[#333333] text-xl font-bold font-vazir leading-[2.8rem];
+        }
+    }
+
+    button {
+        @apply w-full h-12 lg:h-14;
+    }
+}
+</style>
@@ -0,0 +1,73 @@
+<template>
+    <div class="seller-details-best-selling">
+        <div>
+            <Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
+            <h2>{{ title }}</h2>
+            <img :src="coverImage">
+        </div>
+        <ul>
+            <li v-for="(value, key ) in items" :key="key">
+                <label>{{ $t(key) }}</label>
+                <span>{{ value }}</span>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script setup>
+const dialog = inject('dialogRef')
+const { product, quantity, total } = dialog.value.data
+const { title, coverImagem, stockQuantity} = product
+
+const numberFormat = (number) =>
+    new Intl.NumberFormat('fa-IR', { maximumSignificantDigits: 3 }).format(number)
+
+const items = reactive({
+    salesNumber: quantity,
+    salesPrice: numberFormat(total),
+    inventory: stockQuantity,
+    status: "دارای رقیب",
+})
+</script>
+
+<style lang="scss">
+.seller-details-best-selling {
+    @apply flex flex-col bg-white rounded-t-[0.6rem] gap-[1.9rem] px-6 py-[1.1rem] rtl;
+
+    &>div {
+        @apply flex gap-1.5;
+
+        h2 {
+            @apply w-56 text-[#333333] text-sm font-medium font-vazir pt-0.5;
+        }
+
+        button {
+            @apply -mx-4 -my-3;
+
+            .p-button-icon {
+                @apply text-lg text-[#B2B2B2] #{!important};
+            }
+        }
+
+        img {
+            @apply w-[3.8rem] h-[3.8rem] mr-auto;
+        }
+    }
+
+    &>ul {
+        @apply flex flex-col gap-[1.1rem] mt-1.5;
+
+        li {
+            @apply flex justify-between;
+
+            label {
+                @apply text-[#5D5D5D] text-xs font-vazir
+            }
+
+            span {
+                @apply text-[#333333] text-xs font-medium font-vazir;
+            }
+        }
+    }
+}
+</style>
@@ -0,0 +1,98 @@
+<template>
+    <div class="seller-details-order">
+        <div>
+            <Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
+            <h2>{{ $t('orderDetails') }}</h2>
+            <Button icon="isax isax-receipt-item" iconPos="right" link :label="$t('showFactor')" @click="show()" />
+        </div>
+        <ul>
+            <li v-for="(value, key ) in items" :key="key">
+                <label>{{ $t(key) }}</label>
+                <span>{{ value }}</span>
+            </li>
+        </ul>
+        <ul>
+            <li v-for="(product, k) in [product]" :key="k">
+                <span v-if="product.quantity > 1">
+                    {{ product.quantity }}x
+                </span>
+                <img :src="product.coverImage">
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script setup>
+const dialog = inject('dialogRef')
+const { total, product} = dialog.value.data
+
+const items = reactive({
+    address: ".........................................................................",
+    receiver: "علی مصلحی",
+    purchaseDate: "1402/05/13",
+    postageDate: "1402/05/20",
+    price: "252,000",
+})
+</script>
+
+<style lang="scss">
+.seller-details-order {
+    @apply flex flex-col bg-white rounded-t-[0.6rem]  gap-[1.1rem] px-6 pt-[1.1rem] rtl;
+
+    &>div {
+        @apply flex items-center gap-1.5;
+
+        h2 {
+            @apply text-[#333333] text-sm font-medium font-vazir;
+        }
+
+        &>button {
+            @apply -mx-4 -my-3 last:mr-auto;
+
+            &:first-child {
+                @apply text-lg text-[#B2B2B2] #{!important};
+            }
+
+            &:last-child{
+                @apply text-[#47B556] font-vazir;
+
+                .p-button-label{
+                    @apply text-xs;
+                }
+            }
+        }
+    }
+
+    &>ul:first-of-type {
+        @apply flex flex-col gap-[1.1rem] mt-1.5;
+
+        li {
+            @apply flex justify-between;
+
+            label {
+                @apply text-[#5D5D5D] text-xs font-vazir
+            }
+
+            span {
+                @apply text-[#333333] text-xs font-medium font-vazir;
+            }
+        }
+    }
+
+    &>ul:last-of-type {
+        @apply flex items-center gap-[1.1rem] pb-[1.1rem] border-t border-[#E5E5E5];
+
+        li {
+            @apply flex flex-col h-28 items-center justify-end gap-2.5;
+
+            span {
+                @apply text-[#333333] text-xs font-normal font-poppins
+            }
+
+            img {
+                @apply w-[3.8rem] h-[3.8rem];
+            }
+        }
+    }
+}
+</style>
@@ -0,0 +1,62 @@
+<template>
+    <div class="seller-details-product">
+        <div>
+            <h2>{{ title }}</h2>
+            <Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
+        </div>
+        <ul>
+            <li v-for="(value, key ) in items" :key="key">
+                <label>{{ $t(key) }}</label>
+                <span>{{ value }}</span>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script setup>
+const { title = 'هارددیسک اکسترنال ای دیتا مدل HM900 ظرفیت 4 ترابایت' } = reactive({})
+const items = reactive({
+    salesPrice: "242,523",
+    inventory: "1",
+    status: "دارای رقیب",
+})
+</script>
+
+<style lang="scss">
+.seller-details-product {
+    @apply flex flex-col gap-[1.9rem] px-6 py-[1.1rem] rtl;
+
+    &>div {
+        @apply flex items-center justify-between gap-1.5;
+
+        h2 {
+            @apply w-56 text-[#333333] text-sm font-medium font-vazir;
+        }
+
+        button {
+            @apply -mx-4 -my-3;
+
+            .p-button-icon {
+                @apply text-lg text-[#B2B2B2] #{!important};
+            }
+        }
+    }
+
+    &>ul {
+        @apply felx flex-col gap-[1.1rem] mt-1.5;
+
+        li {
+            @apply flex justify-between;
+
+            label {
+                @apply text-[#5D5D5D] text-xs font-vazir
+            }
+
+            span {
+                @apply text-[#333333] text-xs font-medium font-vazir;
+            }
+        }
+    }
+
+}
+</style>