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

<template>
  <div>
    <div class="wrap-fix z-1 bg-white 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">
<!--          <div class="h-20vh flex justify-center">
            <img :src="logoFull" class="mb-20 h-15vh mt-5" />
          </div>-->
          <div class="overflow-y-auto h-60vh pb-20 border-primary">
            <div
              class="mt-5 text-5 border-solid border-2 border-primary text-primary rounded-[12px] p-4"
            >
              <div class="font-bold text-sm text-primary">
                {{ rulesTitle }}
              </div>
              <div class="w-full h-1px my-3 bg-secondary"></div>
              <div
                v-for="(rule, index) in rulesItems"
                :key="`rule-${index}`"
                class="mt-5 text-xs leading-5"
              >
                {{ rule }}
              </div>
              <template v-if="supplementaryRulesTitle">
                <div class="w-full h-1px my-3 bg-secondary"></div>
                <div class="font-bold text-sm text-primary">
                  {{ supplementaryRulesTitle }}
                </div>
                <div
                  v-for="(rule, index) in supplementaryRulesItems"
                  :key="`supplementary-${index}`"
                  class="mt-5 text-xs leading-5"
                >
                  {{ rule }}
                </div>
              </template>
            </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, computed } 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 BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
import {useConfigStore} from "../../../store/configStore";
import {getReferralShareText, getReferralShareTitle, isBoursecuProject} from "@/utils/config";
import {
  getRulesItems,
  getRulesTitle,
  getSupplementaryRulesItems,
  getSupplementaryRulesTitle,
} from './rulesContent'
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 isBoursecu = computed(() => isBoursecuProject())
const rulesTitle = computed(() => getRulesTitle(nameProject, isBoursecu.value))
const rulesItems = computed(() => getRulesItems(nameProject, isBoursecu.value))
const supplementaryRulesTitle = computed(() => getSupplementaryRulesTitle(isBoursecu.value))
const supplementaryRulesItems = computed(() => getSupplementaryRulesItems(nameProject, isBoursecu.value))
// 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() {
  const val = getReferralShareText({
    userName: userStore.userInfo?.name,
    projectName: nameProject,
    referralId: userStore.userInfo?.referral_id,
  })
  navigator.share({
    title: getReferralShareTitle(nameProject),
    text: val
  })
}

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>