代码复用：将输入验证逻辑封装成一个独立的函数validateInput ，提高代码的复用性。

validateInput 函数：该函数用于验证输入是否为空，若为空则显示错误提示并返回 false，否则返回 true。

main/manager-web/src/views/login.vue

@@ -4,15 +4,15 @@
       <el-header>
         <div
             style="display: flex;align-items: center;margin-top: 15px;margin-left: 10px;gap: 10px;">
-          <img src="@/assets/xiaozhi-logo.png" alt="" style="width: 45px;height: 45px;"/>
-          <img src="@/assets/xiaozhi-ai.png" alt="" style="width: 70px;height: 13px;"/>
+          <img alt="" src="@/assets/xiaozhi-logo.png" style="width: 45px;height: 45px;"/>
+          <img alt="" src="@/assets/xiaozhi-ai.png" style="width: 70px;height: 13px;"/>
         </div>
       </el-header>
       <el-main style="position: relative;">
         <div class="login-box">
           <div
               style="display: flex;align-items: center;gap: 20px;margin-bottom: 39px;padding: 0 30px;">
-            <img src="@/assets/login/hi.png" alt="" style="width: 34px;height: 34px;"/>
+            <img alt="" src="@/assets/login/hi.png" style="width: 34px;height: 34px;"/>
             <div class="login-text">登录</div>
             <div class="login-welcome">
               WELCOME TO LOGIN
@@ -20,16 +20,16 @@
           </div>
           <div style="padding: 0 30px;">
             <div class="input-box">
-              <img src="@/assets/login/username.png" alt="" class="input-icon"/>
+              <img alt="" class="input-icon" src="@/assets/login/username.png"/>
               <el-input v-model="form.username" placeholder="请输入用户名"/>
             </div>
             <div class="input-box">
-              <img src="@/assets/login/password.png" alt="" class="input-icon"/>
-              <el-input v-model="form.password" type="password" placeholder="请输入密码"/>
+              <img alt="" class="input-icon" src="@/assets/login/password.png"/>
+              <el-input v-model="form.password" placeholder="请输入密码" type="password"/>
             </div>
             <div style="display: flex; align-items: center; margin-top: 20px; width: 100%; gap: 10px;">
               <div class="input-box" style="width: calc(100% - 130px); margin-top: 0;">
-                <img src="@/assets/login/shield.png" alt="" class="input-icon"/>
+                <img alt="" class="input-icon" src="@/assets/login/shield.png"/>
                 <el-input v-model="form.captcha" placeholder="请输入验证码" style="flex: 1;"/>
               </div>
               <img v-if="captchaUrl"
@@ -105,33 +105,43 @@ export default {
       }
     },
 
+    // 封装输入验证逻辑
+    validateInput(input, message) {
+      if (!input.trim()) {
+        showDanger(message);
+        return false;
+      }
+      return true;
+    },
+
     async login() {
-      if (!this.form.username.trim()) {  // 替换isNull校验
-        showDanger('用户名不能为空')
-        return
+      // 验证用户名
+      if (!this.validateInput(this.form.username, '用户名不能为空')) {
+        return;
       }
-      if (!this.form.password.trim()) {  // 替换isNull校验
-        showDanger('密码不能为空')
-        return
+      // 验证密码
+      if (!this.validateInput(this.form.password, '密码不能为空')) {
+        return;
       }
-      if (!this.form.captcha.trim()) {  // 替换isNull校验
-        showDanger('验证码不能为空')
-        return
+      // 验证验证码
+      if (!this.validateInput(this.form.captcha, '验证码不能为空')) {
+        return;
       }
 
       this.form.captchaId = this.captchaUuid
       Api.user.login(this.form, ({data}) => {
         console.log(data)
         showSuccess('登陆成功！')
-        
+        // 将令牌存储到 Vuex 中
         this.$store.commit('setToken', JSON.stringify(data.data))
 
         goToPage('/home')
       })
 
+      // 重新获取验证码
       setTimeout(() => {
-        this.fetchCaptcha()
-      }, 1000)
+        this.fetchCaptcha();
+      }, 1000);
     },
 
     goToRegister() {
@@ -140,6 +150,6 @@ export default {
   }
 }
 </script>
-<style scoped lang="scss">
+<style lang="scss" scoped>
 @import './auth.scss'; // 添加这行引用
 </style>