Prefer password login on the home screen with register and forgot-password actions.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/login/components/Login.vue

@@ -6,36 +6,16 @@
 <!--    <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="numeric"/>
       </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" inputmode="decimal"/>
       </a-form-item>
-      <div v-else-if="!stepTwoVerify" class="h-[90px]"></div>
-      <div v-else>
+      <div v-else-if="stepTwoVerify">
         <AFormItem
           :rules="[
                     {
@@ -107,23 +87,42 @@
             <div v-else>{{ !isSMS ? 'ورود' : stepTwoVerify ? 'ورود' : 'ارسال کد' }}</div>
           </div>
         </BasicButton>
+        <BasicButton
+          v-if="isSMS"
+          class="mt-2 w-full"
+          html-type="button"
+          @click="setIsSMS(false)"
+        >
+          ورود با رمز عبور
+        </BasicButton>
         <InstallButton />
-        <BasicButton class="mt-2 w-full" @click="goToAboutSoftware">
+        <BasicButton
+          class="mt-2 w-full"
+          html-type="button"
+          @click="$emit('register', true)"
+        >
+          ثبت نام
+        </BasicButton>
+        <BasicButton class="mt-2 w-full" html-type="button" @click="goToAboutSoftware">
           <div>درباره نرم‌افزار</div>
         </BasicButton>
         <BasicButton
           v-if="getToken() && userStore.userInfo?.finger_print"
           :disabled="loading"
           class=" w-full py-2 mt-2"
+          html-type="button"
           @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-primary">از این قسمت</div>
-          ثبت نام کنید.
+        <div
+          v-if="!isSMS"
+          class="w-full text-center mt-3 text-sm font-bold text-gray-600 cursor-pointer"
+          @click="setIsSMS(true)"
+        >
+          فراموشی رمز عبور
         </div>
       </a-form-item>
     </a-form>
@@ -168,8 +167,6 @@ const formRef = ref<FormInstance>()
 
 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>({
@@ -189,7 +186,7 @@ async function reSendCode() {
   reset()
 }
 
-const isSMS = ref<boolean>(true)
+const isSMS = ref<boolean>(false)
 
 function setIsSMS(val: boolean) {
   isSMS.value = val
@@ -212,13 +209,6 @@ function goToAboutSoftware() {
   router.push({ name: 'aboutSoftware' })
 }
 
-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 = persianToEnglishDigits(String(value ?? ''))
   // formRef.value?.validateFields()