13/7/1404

src/components/BasicPacks/BasicInfoItem.vue

@@ -0,0 +1,48 @@
+<template>
+  <div :class="isLine?'flex justify-between items-center':''">
+    <div class="flex items-center gap-1">
+      <div class="">{{ title }}:</div>
+      <BasicIcon v-if="info" icon="vuesax-linear:info-circle" size="18" color="orange" @click="infoVisible = true"/>
+    </div>
+    <div v-if="value" class="font-bold mt-1">{{ value }}</div>
+    <div v-else class="mt-1">
+      <slot></slot>
+    </div>
+  </div>
+  <van-dialog v-model:show="infoVisible" class="updateButton" confirm-button-text="متوجه شدم"
+              show-confirm-button @confirm="update()">
+    <div class="flex flex-col items-center p-6 text-center">
+<!--      <DotLottieVue class="w-5rem h-5rem" autoplay
+                    src="https://lottie.host/embed/63ef9cee-3d94-4294-8bd2-2efd7b563880/eKMhaUMaGp.json" />-->
+      <!--        <div class="home_appear_fade_in_up delay-100">به روز رسانی</div>-->
+      <div v-if="infoHead" class="font-bold">{{infoHead}}</div>
+      <div class="home_appear_fade_in_up mt-2 text-sm">{{info}}</div>
+    </div>
+  </van-dialog>
+</template>
+
+<script setup lang="ts">
+
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import { update } from 'lodash'
+import { ref } from 'vue'
+import { DotLottieVue } from '@lottiefiles/dotlottie-vue'
+// import anim from '@/assets/lottie/animInfo.json'
+
+interface Prop {
+  title: string
+  info?: string
+  infoHead?: string
+  isLine?: boolean
+  value?: string | number
+}
+
+const props = withDefaults(defineProps<Prop>(),{
+  isLine: false
+})
+const infoVisible = ref<boolean>()
+</script>
+
+<style scoped lang="less">
+
+</style>