1404/10/28-base

2026-01-18 13:01:46 +03:30
parent f95b0cef95
commit 9d96ae106b
455 changed files with 58164 additions and 0 deletions
@@ -0,0 +1,654 @@
+<template>
+  <div class="w-full  flex flex-col">
+    <img :src="config.config.avatar" alt="" class="z-100  rounded-full  aspect-square self-center w-42 " STYLE="margin-bottom: 60px">
+
+    <!--    <div class="font-bold text-center text-xl">{{  URLUserType() === 'single' ? 'ورود' : 'ورود همکار'  }}</div>-->
+<!--    <div v-if="URLUserType() === 'single'" class="font-bold text-center text-xl">ورود</div>-->
+<!--    <div v-else class="font-bold text-center text-xl">ورود همکار</div>-->
+    <a-form ref="formRef" :model="userFormState" class="!mt-5" name="basic" @finish="phoneVerification">
+      <!--      <a-segmented v-model:value="value" :options="data" />-->
+      <div class="flex justify-evenly w-full px-2 h-11 items-center bg-gray-50 relative rounded mb-5">
+        <div :class="isSMS?'text-primary':'text-gray-400'" class="w-full text-center z-2"
+             @click.stop="setIsSMS(true) ">
+          ورود با پیامک
+        </div>
+        <div :class="!isSMS?'text-primary':'text-gray-400'" class="w-full text-center z-2"
+             @click.stop="setIsSMS(false) ">
+          ورود با کلمه عبور
+        </div>
+        <!--        <div ref="bganim" class="absolute bg-white h-8 w-1/2 rounded-lg " :style="`transform: translateX(${isDeposit? '0':'-100%'}); left: ${isDeposit? '0':'100%'}`"></div>-->
+        <div ref="bganim" :style="useStyle()"
+             class="absolute bg-white h-8 w-1/2 rounded-lg animate right"></div>
+      </div>
+
+      <!--      <transition name="fade" mode="out-in">-->
+      <a-form-item v-if="!stepTwoVerify" :rules="[required('شماره تلفن'),mobileValidation()]"
+                   class="home_appear_fade_in_down" label="شماره تلفن"
+                   name="mobile">
+        <BasicInput v-model:value="userFormState.mobile" place-holder="شماره تلفن" size="large" inputmode="decimal"/>
+      </a-form-item>
+      <!--      </transition>-->
+      <!--      <transition name="fade" mode="out-in">-->
+      <a-form-item v-if="!isSMS" :rules="[required('کلمه عبور')]" class="home_appear_fade_in_down" label="کلمه عبور"
+                   name="password">
+        <!--        <BasicInput v-model:value="userFormState.password" size="large" place-holder="کلمه عبور"/>-->
+        <AInputPassword v-model:value="userFormState.password" place-holder="کلمه عبور" size="large"/>
+      </a-form-item>
+      <div v-else-if="!stepTwoVerify" class="h-[90px]"></div>
+      <div v-else>
+        <AFormItem
+          :rules="[
+                    {
+                      required: true,
+                      message: 'کد ارسال شده را وارد نمایید',
+                    },
+                    {
+                      min: 4,
+                      max: 4,
+                      message: 'کد ارسال شده را وارد نمایید',
+                    },
+                  ]"
+          class="error-token"
+          name="token"
+        >
+          <OtpInput
+            ref="refOtpInput"
+            :is-input-num="true"
+            :num-inputs="4"
+            :should-auto-focus="true"
+            autocomplete="one-time-code"
+            class="mt-5 justify-center"
+            input-classes="otp-input"
+            separator=""
+            style="direction: ltr"
+            value=""
+            @on-change="handleOnChange"
+            @on-complete="handleOnComplete"
+          />
+        </AFormItem>
+        <div class="flex items-center my-[23px] justify-center">
+          <span class="text-gray-400 mt-1">{{ userFormState.mobile }}</span>
+          <div class="flex items-center text-gray-700 mr-2" @click="stepTwoVerify = false">
+            <span class="ml-1">ویرایش شماره</span>
+            <BasicIcon icon="vuesax-linear:edit" size="20" />
+          </div>
+        </div>
+
+        <div class="mb-2 w-full">
+          <AButton :disabled="!enableSendAgainCode" class="w-full" type="dashed" @click="reSendCode">
+            <div v-if="!enableSendAgainCode" class="flex w-full justify-center">
+              <span>ارسال مجدد کد در </span>
+              <span class="text-primary mx-1">{{ time }}</span>
+              <span> دیگر </span>
+            </div>
+            <div v-else>
+              ارسال مجدد کد تایید
+            </div>
+          </AButton>
+        </div>
+      </div>
+
+      <!--      </transition>-->
+
+
+      <a-form-item>
+        <!--        <div class="flex text-gray-600 text-xs my-2">با ورود یا ثبت نام
+                  <div class="mx-1 font-bold">شرایط و قوانین</div>
+                  را میپذیرم
+                </div>-->
+        <BasicButton
+          :disabled="loading"
+          class=" w-full py-2"
+          html-type="submit"
+          type="primary"
+        >
+          <div>
+            <a-spin v-if="loading" size="small" />
+            <div v-else>{{ !isSMS ? 'ورود' : stepTwoVerify ? 'ورود' : 'ارسال کد' }}</div>
+          </div>
+        </BasicButton>
+        <BasicButton
+          v-if="getToken() && userStore.userInfo?.finger_print"
+          :disabled="loading"
+          class=" w-full py-2 mt-2"
+          @click="enterFingerPrint"
+        >
+          <div>
+            ورود با اثر انگشت
+          </div>
+        </BasicButton>
+        <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',true)">اگر حساب کاربری ندارید
+          <div class="font-bold text-[#0A1B37]">از این قسمت</div>
+          ثبت نام کنید.
+        </div>
+      </a-form-item>
+    </a-form>
+
+<!--        <div v-if="URLUserType() === 'single'" class="fixed bottom-5 left-0 right-0 text-center">
+          <a class="w-full text-center"
+             href="https://abshode.peransagold.com/">ورود
+            همکار</a>
+        </div>-->
+  </div>
+</template>
+
+
+<script lang="ts" setup>
+
+import { mobileValidation, required } from '@/utils/inputRules'
+// import type {UserMobile} from "@/models/login";
+import BasicInput from '@/components/BasicPacks/BasicInput.vue'
+import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import { authenticateWithFingerprint, getToken, loading, removeToken, setToken, URLUserType } from '@/utils'
+import { reactive, ref } from 'vue'
+import OtpInput from 'vue3-otp-input'
+import type { Login } from '@/models/login'
+import type { FormInstance } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import useCountdownTimer from '@/utils/useCountdownTimer'
+import { loginCustomer, verifyToken } from '@/api/login'
+import router from '@/router'
+import { useUserStore } from '@/store/userStore'
+import { useWalletStore } from '@/store/walletStore'
+import logo from '@/assets/img/logo.png'
+import { fingerPosition, setTruth } from '@/main'
+import {useConfigStore} from "@/store/configStore";
+
+const { time, onFinish, reset } = useCountdownTimer('00:02:00', 'mm:ss')
+const enableSendAgainCode = ref<boolean>(false)
+
+const stepTwoVerify = ref<boolean>(false)
+const formRef = ref<FormInstance>()
+const config=useConfigStore()
+const userStore = useUserStore()
+const walletStore = useWalletStore()
+const data = reactive(['ورود با پیامک', 'ورود با کلمه عبور'])
+const value = ref(data[0])
+const refOtpInput = ref<InstanceType<typeof OtpInput> | null>(null)
+
+const userFormState = reactive<Login>({
+  provider: 'customer'
+})
+
+//time
+onFinish(() => {
+  enableSendAgainCode.value = true
+})
+
+async function reSendCode() {
+  userFormState.token = undefined
+  // refOtpInput.value?.clearInput()
+  enableSendAgainCode.value = false
+  await loginCustomer(userFormState)
+  reset()
+}
+
+const isSMS = ref<boolean>(true)
+
+function setIsSMS(val: boolean) {
+  isSMS.value = val
+  if (!val) stepTwoVerify.value = false
+  userFormState.token = ''
+  userFormState.password = ''
+  // console.log(bganim.value.classList)
+  // bganim?.value?.classList.add(val?'right':'left')
+  // bganim?.value?.style.transform = `translateX(${val ? '0' : '-100'});`
+  // bganim?.value?.style.animationDirection = val? 'normal':'reverse'
+  // val? bganim?.value?.classList?.add("move") : bganim?.value?.classList?.remove("move")
+  // const el = bganim.value?.
+  // el.
+}
+
+async function enterFingerPrint() {
+  const fingerPrint = await authenticateWithFingerprint()
+  if (fingerPrint) {
+    setTruth()
+    await router.push({ name: 'home' })
+  } else {
+    message.error('خطا در اعتبارسنجی')
+  }
+}
+
+function useStyle() {
+  if (isSMS.value) return 'right: 2%;'
+    // if (isDeposit.value) return 'animation-direction: normal'
+  // else return 'animation-direction: reverse'
+  else return ' right: 98%; transform: translate(100%, 0);'
+}
+
+function handleOnChange(value: string) {
+  userFormState.token = value
+  // formRef.value?.validateFields()
+}
+
+async function handleOnComplete(value: string) {
+  userFormState.token = value
+  phoneVerification()
+}
+
+async function login(accessToken: string | undefined) {
+  setToken(accessToken)
+  await userStore.getMyInfo()
+  // console.log(URLUserType())
+  // console.log(userStore.userInfo?.type)
+  /*  if (userStore.userInfo?.type === (URLUserType() === 'customer' ? 1 : 2)) {*/
+  await walletStore.getMyWallet()
+  setTruth()
+  await router.push({ name: 'home' })
+  /*  } else {
+      removeToken()
+      userStore.removeInformation()
+      message.error('شما مجوز ورود به این بخش را ندارید')
+    }*/
+}
+
+function phoneVerification() {
+  formRef.value?.validateFields().then(async () => {
+    try {
+      loading.value = true
+      if (isSMS.value) {
+        if (!stepTwoVerify.value) {
+          userFormState.token = undefined
+          userFormState.password = undefined
+          userFormState.provider = 'customer'
+          const { id } = await loginCustomer(userFormState)
+          userFormState.id = id
+          stepTwoVerify.value = true
+          getcode()
+          reset()
+        } else {
+          const { access_token } = await verifyToken(userFormState)
+          await login(access_token)
+        }
+      } else {
+        userFormState.token = undefined
+        const { access_token } = await loginCustomer(userFormState)
+        await login(access_token)
+      }
+    } catch (e) {
+      console.log(e)
+    } finally {
+      loading.value = false
+    }
+  })
+}
+const getcode=()=>{
+  if ('OTPCredential' in window) {
+    console.log('run')
+    const ac = new AbortController();
+    navigator.credentials
+        .get({
+          otp: { transport: ['sms'] },
+          signal: ac.signal,
+        })
+        .then((otp) => {
+          console.log('otp recived');
+          userFormState.token = otp?.code;
+          refOtpInput.value.fillInput(otp?.code)
+          phoneVerification();
+          ac.abort();
+        })
+        .catch((err) => {
+          ac.abort();
+          console.log(err);
+        });
+  } else {
+    console.log('not supported');
+  }
+}
+</script>
+
+
+<style lang="less">
+.animate.right {
+  right: 0;
+}
+
+.animate.right.move {
+  right: 100%;
+  transform: translate(100%, 0);
+}
+
+
+</style>
+
+
+
+<!--
+<template>
+  <div class="w-full  flex flex-col">
+    <img :src="logo" alt="" class="z-100 w-full aspect-square self-center h-20">
+    <img :src="logoFull" alt="" class="z-100 w-50 aspect-square self-center mb-5 h-10">
+    &lt;!&ndash;    <div class="font-bold text-center text-xl">{{  URLUserType() === 'single' ? 'ورود' : 'ورود همکار'  }}</div>&ndash;&gt;
+    &lt;!&ndash;    <div v-if="URLUserType() === 'single'" class="font-bold text-center text-xl">ورود</div>&ndash;&gt;
+    &lt;!&ndash;    <div v-else class="font-bold text-center text-xl">ورود همکار</div>&ndash;&gt;
+    <a-form ref="formRef" :model="userFormState" class="!mt-5" name="basic" @finish="phoneVerification">
+      &lt;!&ndash;      <a-segmented v-model:value="value" :options="data" />&ndash;&gt;
+      <div class="flex justify-evenly w-full px-2 h-11 items-center bg-gray-50 relative rounded mb-5">
+        <div :class="isSMS?'text-primary':'text-gray-400'" class="w-full text-center z-2"
+             @click.stop="setIsSMS(true) ">
+          ورود با پیامک
+        </div>
+        <div :class="!isSMS?'text-primary':'text-gray-400'" class="w-full text-center z-2"
+             @click.stop="setIsSMS(false) ">
+          ورود با کلمه عبور
+        </div>
+        &lt;!&ndash;        <div ref="bganim" class="absolute bg-white h-8 w-1/2 rounded-lg " :style="`transform: translateX(${isDeposit? '0':'-100%'}); left: ${isDeposit? '0':'100%'}`"></div>&ndash;&gt;
+        <div ref="bganim" :style="useStyle()"
+             class="absolute bg-white h-8 w-1/2 rounded-lg animate right"></div>
+      </div>
+
+      &lt;!&ndash;      <transition name="fade" mode="out-in">&ndash;&gt;
+      <a-form-item v-if="!stepTwoVerify" :rules="[required('شماره تلفن'),mobileValidation()]"
+                   class="home_appear_fade_in_down" label="شماره تلفن"
+                   name="mobile">
+        <BasicInput v-model:value="userFormState.mobile" place-holder="شماره تلفن" size="large" type="number" />
+      </a-form-item>
+      &lt;!&ndash;      </transition>&ndash;&gt;
+      &lt;!&ndash;      <transition name="fade" mode="out-in">&ndash;&gt;
+      <a-form-item v-if="!isSMS" :rules="[required('کلمه عبور')]" class="home_appear_fade_in_down" label="کلمه عبور"
+                   name="password">
+        &lt;!&ndash;        <BasicInput v-model:value="userFormState.password" size="large" place-holder="کلمه عبور"/>&ndash;&gt;
+        <AInputPassword v-model:value="userFormState.password" place-holder="کلمه عبور" size="large" />
+      </a-form-item>
+      <div v-else-if="!stepTwoVerify" class="h-[90px]"></div>
+      <div v-else>
+        <AFormItem
+          :rules="[
+                    {
+                      required: true,
+                      message: 'کد ارسال شده را وارد نمایید',
+                    },
+                    {
+                      min: 4,
+                      max: 4,
+                      message: 'کد ارسال شده را وارد نمایید',
+                    },
+                  ]"
+          class="error-token"
+          name="token"
+        >
+          <OtpInput
+            ref="refOtpInput"
+            :is-input-num="true"
+            :num-inputs="4"
+            :should-auto-focus="true"
+            autocomplete="one-time-code"
+            class="mt-5 justify-center"
+            input-classes="otp-input"
+            separator=""
+            style="direction: ltr"
+            value=""
+            @on-change="handleOnChange"
+            @on-complete="handleOnComplete"
+          />
+        </AFormItem>
+        <div class="flex items-center my-[23px] justify-center">
+          <span class="text-gray-400 mt-1">{{ userFormState.mobile }}</span>
+          <div class="flex items-center text-gray-700 mr-2" @click="stepTwoVerify = false">
+            <span class="ml-1">ویرایش شماره</span>
+            <BasicIcon icon="vuesax-linear:edit" size="20" />
+          </div>
+        </div>
+
+        <div class="mb-2 w-full">
+          <AButton :disabled="!enableSendAgainCode" class="w-full" type="dashed" @click="reSendCode">
+            <div v-if="!enableSendAgainCode" class="flex w-full justify-center">
+              <span>ارسال مجدد کد در </span>
+              <span class="text-primary mx-1">{{ time }}</span>
+              <span> دیگر </span>
+            </div>
+            <div v-else>
+              ارسال مجدد کد تایید
+            </div>
+          </AButton>
+        </div>
+      </div>
+
+      &lt;!&ndash;      </transition>&ndash;&gt;
+
+
+      <a-form-item>
+        &lt;!&ndash;        <div class="flex text-gray-600 text-xs my-2">با ورود یا ثبت نام
+                  <div class="mx-1 font-bold">شرایط و قوانین</div>
+                  را میپذیرم
+                </div>&ndash;&gt;
+        <BasicButton
+          :disabled="loading"
+          class=" w-full py-2"
+          html-type="submit"
+          type="primary"
+        >
+          <div>
+            <a-spin v-if="loading" size="small" />
+            <div v-else>{{ !isSMS ? 'ورود' : stepTwoVerify ? 'ورود' : 'ارسال کد' }}</div>
+          </div>
+        </BasicButton>
+        <BasicButton
+          v-if="getToken() && userStore.userInfo?.finger_print"
+          :disabled="loading"
+          class=" w-full py-2 mt-2"
+          @click="enterFingerPrint"
+        >
+          <div>
+            ورود با اثر انگشت
+          </div>
+        </BasicButton>
+        <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',true)">اگر حساب کاربری ندارید
+          <div class="font-bold text-[#0A1B37]">از این قسمت</div>
+          ثبت نام کنید.
+        </div>
+      </a-form-item>
+    </a-form>
+
+    &lt;!&ndash;        <div v-if="URLUserType() === 'single'" class="fixed bottom-5 left-0 right-0 text-center">
+              <a class="w-full text-center"
+                 href="https://abshode.peransagold.com/">ورود
+                همکار</a>
+            </div>&ndash;&gt;
+  </div>
+</template>
+
+
+<script lang="ts" setup>
+
+import { mobileValidation, required } from '@/utils/inputRules'
+// import type {UserMobile} from "@/models/login";
+import BasicInput from '@/components/BasicPacks/BasicInput.vue'
+import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import {
+  authenticateWithFingerprint,
+  getToken,
+  loading,
+  removeToken,
+  setFingerPrint,
+  setToken,
+  URLUserType
+} from '@/utils'
+import { onMounted, reactive, ref } from 'vue'
+import OtpInput from 'vue3-otp-input'
+import type { Login } from '@/models/login'
+import type { FormInstance } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import useCountdownTimer from '@/utils/useCountdownTimer'
+import { loginCustomer, verifyToken } from '@/api/login'
+import router from '@/router'
+import { useUserStore } from '@/store/userStore'
+import { useWalletStore } from '@/store/walletStore'
+import logo from '@/assets/img/logo.svg'
+import { fingerPosition, setFingerPosition, setFingerTimeOut, setTruth } from '@/main'
+
+const { time, onFinish, reset } = useCountdownTimer('00:02:00', 'mm:ss')
+const enableSendAgainCode = ref<boolean>(false)
+
+const stepTwoVerify = ref<boolean>(false)
+const formRef = ref<FormInstance>()
+
+const userStore = useUserStore()
+const walletStore = useWalletStore()
+const data = reactive(['ورود با پیامک', 'ورود با کلمه عبور'])
+const value = ref(data[0])
+const refOtpInput = ref<InstanceType<typeof VOtpInput> | null>(null)
+
+const userFormState = reactive<Login>({
+  provider: 'customer'
+})
+
+//time
+onFinish(() => {
+  enableSendAgainCode.value = true
+})
+const isAuthenticated = ref(false);
+onMounted(async () => {
+  if (getToken()) {
+    const result = await authenticateWithFingerprint();
+    setFingerPosition(result)
+    if (result) {
+      isAuthenticated.value = true;
+      await router.push({ name: 'home' }); // Redirect to home on successful authentication
+    } else {
+      isAuthenticated.value = false;
+      // Handle failed authentication
+    }
+  }
+});
+
+async function reSendCode() {
+  userFormState.token = undefined
+  // refOtpInput.value?.clearInput()
+  enableSendAgainCode.value = false
+  await loginCustomer(userFormState)
+  reset()
+}
+
+const isSMS = ref<boolean>(true)
+
+function setIsSMS(val: boolean) {
+  isSMS.value = val
+  if (!val) stepTwoVerify.value = false
+  userFormState.token = ''
+  userFormState.password = ''
+  // console.log(bganim.value.classList)
+  // bganim?.value?.classList.add(val?'right':'left')
+  // bganim?.value?.style.transform = `translateX(${val ? '0' : '-100'});`
+  // bganim?.value?.style.animationDirection = val? 'normal':'reverse'
+  // val? bganim?.value?.classList?.add("move") : bganim?.value?.classList?.remove("move")
+  // const el = bganim.value?.
+  // el.
+}
+
+async function enterFingerPrint() {
+  const fingerPrint = await authenticateWithFingerprint()
+  if (fingerPrint) {
+    setTruth()
+    await router.push({ name: 'home' })
+  } else {
+    message.error('خطا در اعتبارسنجی')
+  }
+}
+
+function useStyle() {
+  if (isSMS.value) return 'right: 2%;'
+    // if (isDeposit.value) return 'animation-direction: normal'
+  // else return 'animation-direction: reverse'
+  else return ' right: 98%; transform: translate(100%, 0);'
+}
+
+function handleOnChange(value: string) {
+  userFormState.token = value
+  // formRef.value?.validateFields()
+}
+
+async function handleOnComplete(value: string) {
+  userFormState.token = value
+  phoneVerification()
+}
+
+async function login(accessToken: string | undefined) {
+  setToken(accessToken)
+  setFingerTimeOut(router.currentRoute.value)
+  await userStore.getMyInfo()
+  // console.log(URLUserType())
+  // console.log(userStore.userInfo?.type)
+  /*  if (userStore.userInfo?.type === (URLUserType() === 'customer' ? 1 : 2)) {*/
+  await walletStore.getMyWallet()
+  setTruth()
+  await router.push({ name: 'home' })
+  /*  } else {
+      removeToken()
+      userStore.removeInformation()
+      message.error('شما مجوز ورود به این بخش را ندارید')
+    }*/
+}
+
+function phoneVerification() {
+  formRef.value?.validateFields().then(async () => {
+    try {
+      loading.value = true
+      if (isSMS.value) {
+        if (!stepTwoVerify.value) {
+          userFormState.token = undefined
+          userFormState.password = undefined
+          userFormState.provider = 'customer'
+          const { id } = await loginCustomer(userFormState)
+          userFormState.id = id
+          stepTwoVerify.value = true
+          getcode()
+          reset()
+        } else {
+          const { access_token } = await verifyToken(userFormState)
+          await login(access_token)
+        }
+      } else {
+        userFormState.token = undefined
+        const { access_token } = await loginCustomer(userFormState)
+        await login(access_token)
+      }
+    } catch (e) {
+      console.log(e)
+    } finally {
+      loading.value = false
+    }
+  })
+}
+const getcode=()=>{
+  if ('OTPCredential' in window) {
+    console.log('run')
+    const ac = new AbortController();
+    navigator.credentials
+      .get({
+        otp: { transport: ['sms'] },
+        signal: ac.signal,
+      })
+      .then((otp) => {
+        console.log('otp recived');
+        userFormState.token = otp?.code;
+        refOtpInput.value.fillInput(otp?.code)
+        phoneVerification();
+        ac.abort();
+      })
+      .catch((err) => {
+        ac.abort();
+        console.log(err);
+      });
+  } else {
+    console.log('not supported');
+  }
+}
+</script>
+
+
+<style lang="less">
+.animate.right {
+  right: 0;
+}
+
+.animate.right.move {
+  right: 100%;
+  transform: translate(100%, 0);
+}
+
+
+</style>-->
@@ -0,0 +1,54 @@
+<template>
+  <div class="w-full p-8">
+    <div class="font-bold text-center text-xl">ورود / ثبت نام</div>
+    <a-form :model="userFormState" name="basic" @finish="phoneVerification" class="!mt-5">
+      <a-form-item label="شماره تلفن همراه" name="mobile" :rules="[lengthValidation(11),required]">
+        <BasicInput v-model:value="userFormState.mobile" type="tel" size="large" place-holder="شماره تلفن همراه"/>
+        <div class="text-xs mt-1 text-gray-400">مالکیت شماره باید به نام خودتان باشد</div>
+      </a-form-item>
+      <a-form-item>
+<!--        <div class="flex text-gray-600 text-xs my-2">با ورود یا ثبت نام
+          <div class="mx-1 font-bold">شرایط و قوانین</div>
+          را میپذیرم
+        </div>-->
+        <BasicButton
+            class=" w-full py-2"
+            :disabled="loading"
+            type="primary"
+            html-type="submit"
+        >
+          <div>
+            <a-spin v-if="loading" size="small"/>
+            <div v-else>ادامه</div>
+          </div>
+        </BasicButton>
+      </a-form-item>
+    </a-form>
+  </div>
+</template>
+
+
+<script setup lang="ts">
+
+import {lengthValidation, required} from "@/utils/inputRules";
+import type {UserMobile} from "@/models/login";
+import BasicInput from "@/components/BasicPacks/BasicInput.vue";
+import BasicButton from "@/components/BasicPacks/BasicButton.vue";
+import {loading} from "@/utils";
+import {ref} from "vue";
+import router from "@/router";
+
+const userFormState = ref<UserMobile>({
+  mobile: '',
+})
+
+function phoneVerification() {
+ router.push({name: 'home' })
+}
+
+</script>
+
+
+<style scoped>
+
+</style>
@@ -0,0 +1,198 @@
+<template>
+  <div class="w-full flex flex-col">
+    <img :src="config.config.avatar" alt="" class="z-100  rounded-full  aspect-square self-center w-42 " STYLE="">
+    <div class="font-bold text-center text-xl">ثبت نام</div>
+    <a-form ref="formRef" :model="userFormState" class="!mt-5" name="basic"
+            @finish="registerAccount">
+      <a-form-item :rules="[required()]" class="home_appear_fade_in_down" label="نام" name="fname">
+        <BasicInput v-model:value="userFormState.fname" place-holder="نام" />
+      </a-form-item>
+      <a-form-item :rules="[required()]" class="home_appear_fade_in_down" label="نام خانوادگی" name="lname">
+        <BasicInput v-model:value="userFormState.lname" place-holder="نام خانوادگی" />
+      </a-form-item>
+      <a-form-item :rules="[required(),mobileValidation()]" class="home_appear_fade_in_down" label="شماره تلفن"
+                   name="mobile">
+        <BasicInput v-model:value="userFormState.mobile" place-holder="شماره تلفن" inputmode="decimal"/>
+      </a-form-item>
+      <a-form-item :rules="[required()]" class="home_appear_fade_in_down" label="کلمه عبور" name="password">
+        <!--        <BasicInput v-model:value="userFormState.password" size="large" place-holder="کلمه عبور"/>-->
+        <AInputPassword v-model:value="userFormState.password" place-holder="کلمه عبور" />
+      </a-form-item>
+      <a-form-item  :rules="[required()]" class="home_appear_fade_in_down" label="کد معرف" name="referral_id">
+        <BasicInput :disabled="disableForm" v-model:value="userFormState.referral_id" place-holder="کد معرف"/>
+      </a-form-item>
+      <!--      <a-form-item v-if="URLUserType() === 'customer'" :rules="[required()]" class="home_appear_fade_in_down"
+                         label="نام فروشگاه" name="shop_name">
+              <BasicInput v-model:value="userFormState.shop_name" place-holder="نام فروشگاه"/>
+            </a-form-item>-->
+      <a-form-item>
+
+        <BasicButton
+          :disabled="loading"
+          class=" w-full py-2 mt-4"
+          html-type="submit"
+          type="primary"
+        >
+          <div>
+            <a-spin v-if="loading" size="small" />
+            <div v-else>ثبت نام</div>
+          </div>
+        </BasicButton>
+        <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',false)">اگر حساب کاربری دارید
+          <div class="font-bold text-[#0A1B37]">از این قسمت</div>
+          وارد شوید.
+        </div>
+      </a-form-item>
+    </a-form>
+    <DialogVantOneButton v-model:show="registeredInfo" :closeOnClickOverlay="false" :timeOut="-1">
+      <template v-slot:img>
+        <img :src="registerDelayImage" alt="" class="opacity-80">
+      </template>
+
+      <template v-slot:title>
+        <div class="p-5 text-center text-sm">
+          ثبت نام شما با موفقیت انجام شد. پس از تایید ادمین، شما میتوانید با اطلاعات خود، وارد اپلیکیشن شوید.
+        </div>
+      </template>
+
+      <template v-slot:button>
+        <div class="text-center" @click="$emit('register',false)">
+          متوجه شدم
+        </div>
+      </template>
+
+    </DialogVantOneButton>
+
+    <!--    <van-dialog/>-->
+    <!--
+        <div v-else>
+          <AFormItem
+              class="error-token"
+              :rules="[
+                        {
+                          required: true,
+                          message: 'کد ارسال شده را وارد نمایید',
+                        },
+                        {
+                          min: 4,
+                          max: 4,
+                          message: 'کد ارسال شده را وارد نمایید',
+                        },
+                      ]"
+              name="token"
+          >
+            <OtpInput
+                style="direction: ltr"
+                class="mt-5 justify-center"
+                ref="refOtpInput"
+                autocomplete="one-time-code"
+                input-classes="otp-input"
+                separator=""
+                value=""
+                :num-inputs="4"
+                :should-auto-focus="true"
+                :is-input-num="true"
+                @on-change="handleOnChange"
+                @on-complete="handleOnComplete"
+            />
+          </AFormItem>
+          <div class="flex items-center my-[23px] justify-center">
+            <span class="text-gray-400 mt-1">{{ userFormState.mobile }}</span>
+            <div class="flex items-center text-gray-700 mr-2" @click="stepTwoVerify = false">
+              <span class="ml-1">ویرایش شماره</span>
+              <BasicIcon icon="vuesax-linear:edit" size="20"/>
+            </div>
+          </div>
+
+          <div class="mb-2 w-full">
+            <AButton type="dashed" class="w-full" @click="reSendCode"> ارسال مجدد کد تایید</AButton>
+          </div>
+        </div>
+    -->
+  </div>
+</template>
+
+
+<script lang="ts" setup>
+
+import { mobileValidation, required } from '@/utils/inputRules'
+import type { User } from '@/models/login'
+import BasicInput from '@/components/BasicPacks/BasicInput.vue'
+import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import { loading, URLUserType } from '@/utils'
+import { onMounted, reactive, ref } from 'vue'
+import type { FormInstance } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
+import registerDelayImage from '@/assets/img/registerDelay.svg'
+import DialogVantOneButton from '@/components/DialogVantOneButton.vue'
+import { registerCustomer } from '@/api/login'
+import router from '@/router'
+import logo from "@/assets/img/logo.png";
+
+
+// const stepTwoVerify = ref<boolean>(false)
+const registeredInfo = ref<boolean>(false)
+
+const userFormState = reactive<User>({
+  access_token: ''
+})
+const formRef = ref<FormInstance>()
+const disableForm=ref(false)
+/*function handleOnChange(value: string) {
+  userFormState.token = value
+  // formRef.value?.validateFields()
+}
+
+async function handleOnComplete(value: string) {
+  userFormState.token = value
+  registerAccount()
+}*/
+onMounted(() => {
+  if (router.currentRoute.value.query.id){
+    userFormState.referral_id = router.currentRoute.value.query.id
+    disableForm.value=true
+  }
+
+
+})
+
+function registerAccount() {
+  // console.log('test')
+  formRef.value?.validateFields().then(async () => {
+    try {
+      // console.log('test',stepTwoVerify.value)
+      loading.value = true
+      // if (!stepTwoVerify.value) {
+      URLUserType() === 'single' ? userFormState.type = 2 : userFormState.type = 1
+      // console.log(userFormState)
+      if (!userFormState.referral_id || userFormState.referral_id === '') delete userFormState.referral_id
+      const { id } = await registerCustomer(userFormState)
+      registeredInfo.value = true
+      // console.log(registeredInfo.value)
+      // userFormState.id = id
+      // stepTwoVerify.value = true
+      // } else {
+      //   userFormState.mobile = undefined
+      //   userFormState.password = undefined
+      //   userFormState.fname = undefined
+      //   userFormState.lname = undefined
+      //   userFormState.shop_name = undefined
+      //   await verifyToken(userFormState)
+      // }
+    } catch (e) {
+      console.log(e)
+      if (e.response?.status === 422) {
+        // message.error('این شماره همراه قبلا ثبت نام کرده است')
+      }
+    } finally {
+      loading.value = false
+    }
+  })
+}
+
+</script>
+
+
+<style scoped>
+
+</style>