🕟 优化

kicc-ui/src/views/core/login/ForgetPasswordForm.vue

@@ -1,33 +1,41 @@
 <template>
   <template v-if="getShow">
-    <LoginFormTitle class="enter-x" />
-    <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
+    <LoginFormTitle class="enter-x"/>
+    <Form ref="formRef"
+          :model="formData"
+          class="p-4 enter-x"
+          :rules="getFormRules"
+    >
       <FormItem name="account" class="enter-x">
-        <Input
-          size="large"
-          v-model:value="formData.account"
-          :placeholder="t('sys.login.userName')"
+        <Input v-model:value="formData.account"
+               size="large"
+               :placeholder="t('sys.login.userName')"
         />
       </FormItem>
-
       <FormItem name="mobile" class="enter-x">
-        <Input size="large" v-model:value="formData.mobile" :placeholder="t('sys.login.mobile')" />
+        <Input v-model:value="formData.mobile"
+               size="large"
+               :placeholder="t('sys.login.mobile')"
+        />
       </FormItem>
       <FormItem name="sms" class="enter-x">
-        <CountdownInput
-          size="large"
-          v-model:value="formData.sms"
-          :placeholder="t('sys.login.smsCode')"
+        <CountdownInput v-model:value="formData.sms"
+                        size="large"
+                        :placeholder="t('sys.login.smsCode')"
         />
       </FormItem>
-
       <FormItem class="enter-x">
-        <Button type="primary" size="large" block @click="handleReset" :loading="loading">
-          {{ t('common.resetText') }}
-        </Button>
-        <Button size="large" block class="mt-4" @click="handleBackLogin">
-          {{ t('sys.login.backSignIn') }}
-        </Button>
+        <Button type="primary"
+                size="large"
+                block
+                :loading="loading"
+                @click="handleReset"
+        >{{ t('common.resetText') }}</Button>
+        <Button size="large"
+                block
+                class="mt-4"
+                @click="handleBackLogin"
+        >{{ t('sys.login.backSignIn') }}</Button>
       </FormItem>
     </Form>
   </template>
@@ -44,10 +52,8 @@
   const { t } = useI18n();
   const { handleBackLogin, getLoginState } = useLoginState();
   const { getFormRules } = useFormRules();
-
   const formRef = ref();
   const loading = ref(false);
-
   const formData = reactive({
     account: '',
     mobile: '',

kicc-ui/src/views/core/login/useLogin.ts

@@ -72,36 +72,29 @@ export function useFormRules(formData?: Recordable) {
       sms: smsFormRule,
       mobile: mobileFormRule,
     };
-    switch (unref(currentState)) {
-      // register form rules
-      case LoginStateEnum.REGISTER:
-        return {
-          account: accountFormRule,
-          password: passwordFormRule,
-          confirmPassword: [
-            { validator: validateConfirmPassword(formData?.password), trigger: 'change' },
-          ],
-          policy: [{ validator: validatePolicy, trigger: 'change' }],
-          ...mobileRule,
-        };
-
-      // reset password form rules
-      case LoginStateEnum.RESET_PASSWORD:
-        return {
-          account: accountFormRule,
-          ...mobileRule,
-        };
-
-      // mobile form rules
-      case LoginStateEnum.MOBILE:
-        return mobileRule;
-
-      // login form rules
-      default:
-        return {
-          account: accountFormRule,
-          password: passwordFormRule,
-        };
+    let login = unref(currentState);
+    if (login === LoginStateEnum.REGISTER) {
+      return {
+        account: accountFormRule,
+        password: passwordFormRule,
+        confirmPassword: [
+          {validator: validateConfirmPassword(formData?.password), trigger: 'change'},
+        ],
+        policy: [{validator: validatePolicy, trigger: 'change'}],
+        ...mobileRule,
+      };
+    } else if (login === LoginStateEnum.RESET_PASSWORD) {
+      return {
+        account: accountFormRule,
+        ...mobileRule,
+      };
+    } else if (login === LoginStateEnum.MOBILE) {
+      return mobileRule;
+    } else {
+      return {
+        account: accountFormRule,
+        password: passwordFormRule,
+      };
     }
   });
   return { getFormRules };