优化登录、注册页

src/views/login/LoginForm.vue

@@ -104,20 +104,29 @@
   const captchaImg = ref('');
   // 动态加载滑块验证码组件
 
+  /**
+   * 定义表单参数
+   */
   interface FormState {
     username: string;
     password: string;
     code: string;
     key: string;
   }
+
+  /**
+   * 定义参数
+   */
   const message = useMessage();
   const emit = defineEmits(['backLogin']);
   const formRef = ref();
-
   const loading = ref(false);
   const autoLogin = ref(true);
   const LOGIN_NAME = PageEnum.BASE_LOGIN_NAME;
 
+  /**
+   * 定义表单提交参数
+   */
   const formInline = reactive({
     username: '',
     password: '',
@@ -125,16 +134,21 @@
     key: '',
   });
 
+  /**
+   * 定义验证规则
+   */
   const rules: FormRules = {
     username: { required: true, message: '请输入登录账号', trigger: 'blur' },
     password: { required: true, message: '请输入密码', trigger: 'blur' },
     code: { required: true, message: '请输入验证码', trigger: 'blur' },
   };
-  const userStore = useUserStore();
 
+  /**
+   * 执行表单提交
+   */
+  const userStore = useUserStore();
   const router = useRouter();
   const route = useRoute();
-
   const handleSubmit = () => {
     if (!formRef.value) return;
     formRef.value
@@ -171,15 +185,25 @@
       });
   };
 
+  /**
+   * 获取验证码
+   */
   const getCaptcha = async () => {
     let { key, captcha } = await getInfoCaptcha();
     formInline.key = key;
     captchaImg.value = captcha;
   };
+
+  /**
+   * 执行去注册
+   */
   const goRegister = () => {
     emit('backLogin', false);
   };
 
+  /**
+   * 获取验证码
+   */
   getCaptcha();
 </script>
 

src/views/login/PhoneForm.vue

@@ -54,6 +54,9 @@
   const captchaImg = ref('');
   // 动态加载滑块验证码组件
 
+  /**
+   * 定义表单参数
+   */
   interface FormState {
     username: string;
     password: string;
@@ -154,13 +157,6 @@
       }
     });
   };
-
-  const getCaptcha = async () => {
-    let { key, captcha } = await getInfoCaptcha();
-    formInline.key = key;
-    captchaImg.value = captcha;
-  };
-  getCaptcha();
 </script>
 
 <style lang="less" scoped>

src/views/login/index.vue

@@ -51,15 +51,33 @@
   import RegisterForm from './RegisterForm.vue';
   import { UserAddOutlined, RollbackOutlined } from '@vicons/antd';
   import { ArrowUndoOutline } from '@vicons/ionicons5';
+
+  /**
+   * 定义参数
+   */
   const loginFlag = ref(true);
   const activeIndex = ref(0);
   const tabData = ref(['账号登录', '手机号登录', '扫码登录']);
+
+  /**
+   * 执行切换TAB
+   * @param index 参数
+   */
   const handleClick = (index) => {
     activeIndex.value = index;
   };
+
+  /**
+   * 执行切换登录、注册表单
+   */
   const handleCornerClick = () => {
     loginFlag.value = !loginFlag.value;
   };
+
+  /**
+   * 执行去登录
+   * @param type 参数
+   */
   const goLogin = (type) => {
     loginFlag.value = type;
   };