boursecu_user/src/views/base/about/index.vue

<template>
  <div>
    <div class="bg-white wrap-fix z-200001 py-3 px-3 text-primary font-bold drop-shadow flex">
      <div @click="router.back()" class="cursor-pointer">
        <BasicIcon icon="vuesax-linear:arrow-right-1" />
      </div>
      <div class="mr-2">درباره ما</div>
    </div>
    <div class="pt-20">
      <div>
        <img :src="img" alt="" class="mt-2 w-full absolute bottom-0" />
      </div>
      <div class="text-justify text-base z-200000 relative">
        <div class="px-10">
<!--          <img :src="logoFull" class="mb-20 mt-5" />-->
          <div class="overflow-y-auto h-65vh">
            <div class="bg-primary text-white rounded-[12px] p-4 text-xs leading-5">
              <div class="w-full h-1px my-3 bg-tertiary"></div>
              <div>
                طلا علاوه بر کاربرد در ساخت زیورآلات، از دوران کهن به عنوان یک فلز ارزشمند و دارایی
                مقاوم در برابر تورم شناخته می‌شود، به طوری که سرمایه‌گذاران حرفه‌ای همواره بخشی از
                سبد سرمایه‌گذاری‌شان را به طلا اختصاص می‌دهند.
              </div>
              <div class="mt-3">
                با وجود گسترش فناوری‌های نوین در همه حوزه‌ها، ما در شرکت پخش طلای حاجی ابوالفتح با
                تلفیق تجربه سنتی خود در بازار طلا و با دانش تخصصی خود و با بهره‌گیری از سوابق موفق
                قبلی در حوزه فینتک، اقدام به ایجاد {{ nameProject }} نمودیم.
              </div>
              <div class="mt-3">
                مهم‌ترین ارزش پیشنهادی  {{ nameProject }}، امکان پس انداز تدریجی طلا با سرمایه‌های خرد و بدون
                پرداخت هزینه‌های جانبی است و در این راستا {{ nameProject }} تمام تلاش خود را نموده است تا از
                ابتدای سال 1401 با رونمایی محصول اولیه، برای همه افراد با هر سطحی از دارایی، بستری
                امن و مطمئن ایجاد نماید.
              </div>
              <div class="mt-3">
                علاوه بر این  {{ nameProject }} به عنوان یک واحد فناور از سال 1403 با رونمایی نسخه کاملا آنلاین
                و نرم افزاری وارد فاز جدیدی از خرید و فروش طلای آب شده، شده است.
              </div>
              <div class="w-full h-1px my-3 bg-tertiary"></div>
            </div>
          </div>
        </div>
        <div v-if="config.config.name === 'garoosi'" class="wrap-fix bottom-0 px-10 pb-3rem flex gap-2 bg-white">
          <a class="w-full" href="tel:09306612518">
            <BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
          </a>
          <a href="https://ble.ir/garoosigallery">
            <img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
          </a>
        </div>
        <div v-else class="wrap-fix bottom-0 px-10 pb-3rem flex gap-2 bg-white">
          <a class="w-full" href="tel:">
            <BasicButton class="w-full" type="primary">تماس با پشتیبانی</BasicButton>
          </a>
          <a href="https://ble.ir/">
          <img src="@/assets/img/bale.png" alt="" class="h-10 w-10"/>
           </a>
        </div>
      </div>
    </div>
    <!--    <ActionSheet v-model:show="editPassVisible">salam</ActionSheet>-->
  </div>
</template>

<script lang="ts" setup>
import { onMounted, reactive, ref } from 'vue'
import img from '@/assets/img/user_ly1.svg'
import gr_bottom from './assets/img/gr_bottom_white.svg'
import { loading } from '@/utils'
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
import BasicActionSheet from '@/components/BasicPacks/BasicActionSheet.vue'
import { lengthValidation, required } from '@/utils/inputRules'
import BasicInput from '@/components/BasicPacks/BasicInput.vue'
import type { User } from '@/models/login'
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
import router from '@/router'
import type { FormInstance } from 'ant-design-vue'
import { message } from 'ant-design-vue'
import { updateMe } from '@/api/me'
import { useUserStore } from '@/store/userStore'
import {useConfigStore} from "@/store/configStore";

const config=useConfigStore()

const userFormState = ref<User>({
  fname: '',
  lname: '',
  mobile: undefined,
  birth_date: '',
  phone_number: '',
  province: '',
  city: '',
  n_code: undefined
})
const formRef = ref<FormInstance>()
const userStore = useUserStore()
const nameProject= useConfigStore().config.name_fa

// const editPassVisible = ref<boolean>(false)
const editPassVisible = ref<boolean>(false)

function setForm() {
  userFormState.value = userStore.userInfo
}

function copyCode() {
  // nextTick(() => {
  const val = userStore.userInfo?.referral_id
  navigator.clipboard.writeText(val)
  message.info('کد رونوشت شد')
  // })
}

function shareCode() {
  // nextTick(() => {
  const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!

این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای ${nameProject} جا نمونید.
روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.

${window.location.hostname}/login?id=${userStore.userInfo?.referral_id}`
  navigator.share({
    title: nameProject,
    text: val
  })
  // message.info('کد رونوشت شد')
  // })
}

const resetData = () => {
  formRef.value?.resetFields()
  userFormState.value = {
    fname: '',
    lname: '',
    mobile: undefined,
    birth_date: '',
    phone_number: '',
    province: '',
    city: '',
    n_code: undefined
  }
}

onMounted(() => {
  setForm()
})

function ok() {
  formRef.value?.validateFields().then(async () => {
    try {
      loading.value = true
      await updateMe(userFormState.value)
      await userStore.getMyInfo()
      editPassVisible.value = false
      message.success('اطلاعات شما با موفقیت به روز رسانی شد')
    } catch (e) {
      console.log(e)
    } finally {
      loading.value = false
    }
  })
}
</script>

<style scoped>
/*.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.2s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}*/
/*.trans{
  transition:  height 1s;
}*/
</style>