init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,161 @@
+<template>
+    <NuxtLayout :name="device" :config="config">
+        <main class="seller-new-product">
+            <aside v-if="device == 'desktop'">
+                <PanelSellerProfile />
+                <PanelSellerScore />
+            </aside>
+            <section>
+                <div>
+                    <template v-for="i in 3" :key="i">
+                        <span v-text="i" :class="{ 'active': i == step, 'past': i < step }" />
+                        <hr :class="{ 'past': i < step }" />
+                    </template>
+                </div>
+                <Transition name="fade" mode="out-in">
+                    <PanelSellerStepFirst v-if="step == 1" />
+                    <PanelSellerStepSecond v-else-if="step == 2" />
+                    <PanelSellerStepThirdy v-else-if="step == 3" />
+                </Transition>
+            </section>
+        </main>
+    </NuxtLayout>
+</template>
+
+<script setup>
+import init from '../../../initialize/new-product.js'
+provide('init', init())
+
+const { device, t } = inject('service')
+const config = reactive({
+    desktop: { toolbar: true, seller: true },
+    mobile: { header: { back: true, toolbar: true, title: t('userPanel') }, navigation: false },
+})
+
+const { query } = useRoute()
+
+const step = ref(1)
+provide('step', step)
+
+const { status, data, error } = await useFetch('/api/shop/newProduct', {
+    headers: {
+        Authorization: useCookie('token')
+    },
+})
+
+if (status.value == 'success')
+    provide('data', data.value)
+else throw createError(error.value)
+
+const form = ref({
+    specs: {
+        [t("weight")]: "",
+        [t("dimensions")]: "",
+        [t("color")]: "",
+    },
+    images: [null]
+})
+
+if (query.id) {
+    const { status, data } = await useFetch(`/api/products/id/${query.id}`, {
+        headers: {
+            Authorization: useCookie('token')
+        },
+    })
+
+    if (status.value == 'success') {
+        form.value = data.value
+        form.value.subCategory =
+            form.value.category.length > 1 ? form.value.category.slice(-1)[0] : null
+        form.value.category =
+            form.value.category.length > 2 ? form.value.category[1] : form.value.category[0]
+    }
+}
+
+provide('form', form.value)
+</script>
+
+<style lang="scss">
+.seller-new-product {
+    @apply container flex pt-[1.9rem] pb-4 lg:pt-14 max-lg:px-6 gap-6 relative;
+
+    aside {
+        @apply flex flex-col gap-3 lg:gap-5;
+    }
+
+    &>section {
+        @apply flex flex-col gap-9 grow;
+
+        &>div:not([class]) {
+            @apply w-full h-max flex justify-between items-center gap-2;
+
+            hr {
+                @apply grow h-0.5 bg-[#333333] last:hidden;
+            }
+
+            hr.past {
+                @apply bg-[#47B556];
+            }
+
+            span {
+                @apply w-6 h-6 lg:w-[1.9rem] lg:h-[1.9rem] rounded-full flex justify-center items-center;
+                @apply text-xs lg:text-base font-medium font-vazir border border-[#333333];
+            }
+
+            span.past {
+                @apply text-white bg-[#47B556] border-[#47B556];
+
+            }
+
+            span.active {
+                @apply border-[#47B556] text-[#47B556];
+            }
+
+        }
+    }
+
+}
+
+body:has(.seller-new-product) {
+
+    .p-dropdown-panel:has(.p-dropdown-filter-container) {
+        @apply w-[18.3rem] translate-y-3 pb-4 pt-[0.6rem] rounded-[0.6rem];
+
+        .p-dropdown-header {
+            @apply py-0 px-2.5;
+
+            .p-dropdown-filter-container {
+                @apply w-full h-[3.1rem];
+
+                input {
+                    @apply m-0 h-full w-full rtl;
+                }
+
+                svg {
+                    @apply hidden;
+                }
+            }
+        }
+
+        .p-dropdown-items-wrapper {
+            @apply h-[19rem] mt-3 ml-3;
+
+            .p-dropdown-item-group {
+                @apply text-[#47B556] text-xs font-medium font-vazir p-2.5;
+            }
+
+            .p-dropdown-item {
+                @apply h-[2.4rem] px-2.5 text-[#333333] text-base font-medium font-vazir;
+            }
+
+            &::-webkit-scrollbar-thumb {
+                @apply bg-[#47B556];
+            }
+
+            &::-webkit-scrollbar {
+                @apply w-1;
+            }
+        }
+    }
+}
+</style>