init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,92 @@
+<template>
+    <div class="user-profile-card">
+        <img :src="profilePhoto" />
+        <h2>{{ firstName }} {{ lastName }}</h2>
+        <ul>
+            <li v-for="(value, key) in data" :key="key">
+                <label>{{ $t(key) }}</label>
+                <span>{{ value }}</span>
+            </li>
+        </ul>
+        <template v-if="device == 'desktop'">
+            <router-link to="/panel/edit">
+                <Button v-bind="btns.edit.props" />
+            </router-link>
+            <Button v-bind="btns.security.props" @click="handleClick" />
+        </template>
+    </div>
+</template>
+
+<script setup>
+import init from '../../initialize/userProfileCard.js'
+const { btns, items } = init()
+const { device, dialog } = inject('service')
+const profile = inject('data')
+const { profilePhoto = '/images/empty-profile.svg', firstName, lastName } = profile
+const data = reactive({});
+
+const temp = {
+    true: 'تایید شده', false: 'تایید نشده', 'WHOLESALER': 'عمده فروش', 'BUYER': 'خریدار', 'RETAILER': 'خرده فروش'
+}
+
+items.forEach(key => {
+    const value = profile[key];
+    data[key] = temp[value] || value
+});
+
+const handleClick = () =>
+    dialog.show(resolveComponent('PanelDialogPasswordChange'))
+</script>
+
+<style lang="scss">
+.user-profile-card {
+    @apply bg-[#FAFAFA] rounded-[0.6rem] border-[#E5E5E5];
+    @apply flex flex-col gap-3 p-6 relative overflow-hidden;
+    @apply w-[21.4rem] h-[20.1rem] lg:w-[20.8rem] lg:h-[34.9rem] lg:border-2;
+
+    &::before {
+        @apply content-['_'] top-0 inset-x-0 h-[4.4rem] lg:h-[6.3rem] bg-primary-600 absolute;
+    }
+
+    img {
+        @apply w-20 h-20 lg:w-[7.5rem] lg:h-[7.5rem] rounded-full border-2 border-[#FAFAFA] z-0 self-center mt-4;
+    }
+
+    h2 {
+        @apply text-[#333333] text-sm lg:text-xl font-bold font-vazir self-center;
+    }
+
+    ul {
+        @apply flex flex-col gap-4 my-auto;
+
+        li {
+            @apply flex justify-between items-center pb-4 border-b border-dotted;
+            @apply text-xs lg:text-base font-medium font-vazir border-[#E5E5E5] last:border-0;
+
+            label {
+                @apply text-[#999999];
+            }
+
+            span {
+                @apply text-[#333333];
+            }
+        }
+    }
+
+    a {
+        @apply w-full flex;
+    }
+
+    button {
+        @apply w-full h-[2.8rem] lg:h-12 justify-center #{!important};
+
+        span:not(.isax) {
+            @apply grow-0 text-[0.7em] lg:text-sm font-medium font-iran-sans;
+        }
+
+        .isax {
+            @apply text-xl;
+        }
+    }
+}
+</style>