fix bugs of physicalRecieve & login-code-input & odometer-digit

src/views/login/composables/useLoginForm.ts

@@ -1,4 +1,4 @@
-import { computed, onMounted, reactive, ref } from 'vue'
+import { computed, nextTick, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
 import type { FormInstance } from 'ant-design-vue'
 import { message } from 'ant-design-vue'
 import OtpInput from 'vue3-otp-input'
@@ -18,6 +18,7 @@ import { useSettingsStore } from '@/store/settingsStore'
 import { setTruth } from '@/app/authBoot'
 import { completeLoginNavigation } from '@/layouts/composables/useMobileScrollReset'
 import { normalizeAuthFormFields } from '@/utils/persianDigits'
+import { listenForSmsOtp } from '@/utils/webOtp'
 
 export function useLoginForm() {
   const { time, onFinish, reset } = useCountdownTimer('00:02:00', 'mm:ss')
@@ -30,6 +31,7 @@ export function useLoginForm() {
   const isSMS = ref(true)
   const isRegister = ref<boolean | undefined>()
   const showPWAInstallGuide = ref(false)
+  let otpAbort: AbortController | null = null
 
   const userFormState = reactive<Login>({
     provider: 'customer',
@@ -39,11 +41,18 @@ export function useLoginForm() {
     enableSendAgainCode.value = true
   })
 
+  onBeforeUnmount(() => {
+    otpAbort?.abort()
+    otpAbort = null
+  })
+
   async function reSendCode() {
     userFormState.token = undefined
+    ;(refOtpInput.value as { clearInput?: () => void } | null)?.clearInput?.()
     enableSendAgainCode.value = false
     normalizeAuthFormFields(userFormState)
     await loginCustomer(userFormState)
+    getcode()
     reset()
   }
 
@@ -83,24 +92,27 @@ export function useLoginForm() {
     await completeLoginNavigation()
   }
 
-  function getcode() {
-    if ('OTPCredential' in window) {
-      const ac = new AbortController()
-      navigator.credentials
-        .get({
-          otp: { transport: ['sms'] },
-          signal: ac.signal,
-        })
-        .then((otp) => {
-          userFormState.token = otp?.code
-          refOtpInput.value?.fillInput(otp?.code)
-          phoneVerification()
-          ac.abort()
-        })
-        .catch(() => {
-          ac.abort()
-        })
+  async function applySmsOtpCode(code: string) {
+    userFormState.token = code
+    await nextTick()
+    const input = refOtpInput.value as { fillInput?: (v: string) => void } | null
+    if (input?.fillInput) {
+      try {
+        input.fillInput(code)
+        // fillInput → on-complete → handleOnComplete → phoneVerification
+        return
+      } catch {
+        /* fall through */
+      }
     }
+    await phoneVerification()
+  }
+
+  function getcode() {
+    otpAbort?.abort()
+    otpAbort = listenForSmsOtp((code) => {
+      void applySmsOtpCode(code)
+    })
   }
 
   function phoneVerification() {