xyc
4 天以前 3c3f049cc498e56d485936ba76e5adfd680c6839
traffic-audit-web/src/views/Login.vue
@@ -9,8 +9,11 @@
        <el-form-item prop="password">
          <el-input v-model="form.password" type="password" placeholder="密码" @keyup.enter.native="login"></el-input>
        </el-form-item>
        <el-form-item>
        <el-form-item v-if="captchaRequired">
          <captcha3-d ref="captcha" @verified="onCaptchaVerified" @reset="onCaptchaReset"></captcha3-d>
        </el-form-item>
        <el-form-item v-else>
          <div class="captcha-skip-tip">测试模式:行为验证码已跳过,可直接点击登录(正式发布后将启用)</div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" :loading="loggingIn" @click="login" style="width:100%">登 录</el-button>
@@ -36,8 +39,17 @@
      captchaVerified: false,
      captchaId: '',
      clickIds: [],
      loggingIn: false
      loggingIn: false,
      captchaRequired: true
    }
  },
  created() {
    axios.get('/api/auth/captcha-config')
      .then(res => {
        const d = res.data
        if (d && d.code === 200) this.captchaRequired = d.data.required !== false
      })
      .catch(() => {})
  },
  methods: {
    onCaptchaVerified(payload) {
@@ -53,7 +65,7 @@
    login() {
      this.$refs.form.validate(valid => {
        if (!valid) return
        if (!this.captchaVerified) {
        if (this.captchaRequired && !this.captchaVerified) {
          this.$message.warning('请先完成行为验证')
          return
        }
@@ -75,13 +87,13 @@
            this.$router.push('/dashboard')
          } else if (d.code === 401) {
            this.$message.error(d.message || '用户名或密码错误')
            this.$refs.captcha.load()
            if (this.$refs.captcha) this.$refs.captcha.load()
          } else if (d.code === 4001 || d.code === 4002 || d.code === 4003) {
            this.$message.error(d.message || '验证未通过,请重新验证')
            this.$refs.captcha.load()
            if (this.$refs.captcha) this.$refs.captcha.load()
          } else {
            this.$message.error(d.message || '登录失败,请重试')
            this.$refs.captcha.load()
            if (this.$refs.captcha) this.$refs.captcha.load()
          }
        }).catch(() => {
          this.loggingIn = false
@@ -94,6 +106,7 @@
</script>
<style scoped>
.login-container { display: flex; justify-content: center; align-items: center; min-height: 100vh; padding: 20px 0; box-sizing: border-box; background: #f0f2f5; }
.captcha-skip-tip { font-size: 12px; color: #909399; line-height: 1.6; padding: 8px 10px; background: #F5F7FA; border-radius: 4px; }
.login-card { width: 400px; }
.login-card h2 { text-align: center; margin-bottom: 18px; }
.login-card .el-form-item { margin-bottom: 16px; }