init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,103 @@
+<template>
+    <dialog class="panel-password-renewal">
+        <Button v-bind="btns.close.props" @click="$emit('close')" />
+        <h2>
+            <i class="isax isax-lock-1"></i>
+            <span>{{ $t("newPassword") }}</span>
+        </h2>
+        <p>{{ $t("passwordMustBeCombination") }}</p>
+        <ul>
+            <li v-for="(item, key) in fields" :key="key">
+                <Password v-model="form[key]" v-bind="item.props" :inputId="key" />
+                <label :for="key"> {{ $t(key) }} </label>
+            </li>
+        </ul>
+        <Button v-bind="btns.save.props" @click="save()" />
+    </dialog>
+</template>
+
+<script setup>
+const { btns, fields } = inject('init');
+
+const form = reactive({});
+const userStore = useUserStore();
+
+const save = async () => {
+    const result = await userStore.resetPassword(form);
+}
+</script>
+
+<style lang="scss">
+.panel-password-renewal {
+    @apply w-full lg:w-[47.9rem] lg:h-[31.2rem] bg-white rounded-t-2xl lg:rounded-2xl flex flex-col items-center p-6 lg:p-8;
+
+    &::after {
+        @apply content-['_'] absolute inset-x-0 bottom-[4.5rem] h-3 shadow-[0px_-2px_5px_#0000000a] lg:shadow-none;
+    }
+
+    &>button:nth-of-type(1) {
+        @apply self-end -mt-2 -ml-2;
+
+        .p-button-icon {
+            @apply text-sm text-[#333333] before:content-['\e90b'];
+            @apply lg:text-[2em] lg:text-[#b2b2b29b] lg:before:content-['\e90c'];
+        }
+    }
+
+    &>h2 {
+        @apply flex items-center gap-4 -mt-12 lg:mt-0.5 max-lg:self-start;
+
+        i {
+            @apply max-lg:hidden text-[2em];
+        }
+
+        span {
+            @apply text-[#333333] text-sm lg:text-xl font-bold font-vazir leading-[2.8rem];
+        }
+    }
+
+    &>p {
+        @apply self-start w-[18.1rem] text-[#B2B2B2] text-[0.7em] font-vazir mb-5;
+        @apply lg:w-[23.2rem] lg:text-base lg:mt-2 lg:mb-0 lg:leading-snug lg:self-center lg:text-center;
+    }
+
+    &>ul {
+        @apply flex flex-col gap-6 mt-4 lg:mt-10 w-full items-center;
+
+        li {
+            @apply w-[21.4rem] lg:w-[23.3rem] lg:h-14 relative;
+
+            label {
+                @apply w-max absolute right-3 top-4 px-1 bg-white transition-['top'] pointer-events-none;
+                @apply text-neutral-400 text-sm lg:text-base font-medium cursor-text font-vazir;
+            }
+
+            .p-password {
+                input {
+                    @apply rounded-[0.6rem] border shadow-none border-[#CCCCCC] text-zinc-800 font-vazir;
+                }
+
+                svg {
+                    @apply text-[#CCCCCC] w-5 h-5 -mt-2.5;
+                }
+            }
+
+            &:has(input:focus),
+            &:has(input:not(:placeholder-shown)) {
+                label {
+                    @apply -top-2 h-4;
+                    @apply text-zinc-800 text-xs font-normal font-vazir;
+                }
+            }
+        }
+    }
+
+    &>button:nth-of-type(2) {
+        @apply w-[21.4rem] lg:w-[23.3rem] h-[2.9rem] lg:h-14 mt-8 lg:mt-10;
+
+        .p-button-label {
+            @apply text-sm lg:text-base font-bold font-vazir leading-tight;
+        }
+    }
+}
+</style>