lohir
2024-10-17 f2a9cb154099a59a97de312ea2bb45d37639868b
src/views/login/index.vue
@@ -63,8 +63,8 @@
      :show-close="false"
    >
      <div style="margin-bottom: 10px; color: #aa1111">您的密码已经过期,请重新设置~</div>
      <el-form :model="updatePasswordForm">
        <el-form-item label="新密码">
      <el-form ref="updatePasswordForm" :model="updatePasswordForm" :rules="updatePasswordRules">
        <el-form-item label="新密码" prop="newPassword">
          <el-input v-model="updatePasswordForm.newPassword" placeholder="应包含大小写、数字" show-password></el-input>
        </el-form-item>
        <el-form-item label="确认密码">
@@ -88,16 +88,15 @@
export default {
  name: 'Login',
  data () {
    const validateUsername = (rule, value, callback) => {
      if (value.length < 5) {
        callback(new Error('用户名不能少于5个字符'))
      } else {
        callback()
      }
    }
    const validatePassword = (rule, value, callback) => {
      if (value.length < 5) {
        callback(new Error('密码不能少于5个字符'))
      if (value === '') {
        callback(new Error('请输入密码'))
      } else if (!/[A-Z]/.test(value)) {
        callback(new Error('密码必须包含至少一个大写字母'))
      } else if (!/[a-z]/.test(value)) {
        callback(new Error('密码必须包含至少一个小写字母'))
      } else if (!/[0-9]/.test(value)) {
        callback(new Error('密码必须包含至少一个数字'))
      } else {
        callback()
      }
@@ -109,14 +108,19 @@
        newPassword: '',
        confirmPassword: ''
      },
      updatePasswordRules: {
        newPassword: [
          { validator: validatePassword, trigger: 'blur' }
        ]
      },
      loginForm: {
        userName: '',
        password: '',
        remember: false
      },
      loginRules: {
        userName: [{ required: true, trigger: 'blur'}],
        password: [{ required: true, trigger: 'blur'}]
        userName: [{ required: true, trigger: 'blur' }],
        password: [{ required: true, trigger: 'blur' }]
      },
      passwordType: 'password',
      capsTooltip: false,
@@ -139,15 +143,22 @@
  },
  methods: {
    updatePassword () {
      if (this.updatePasswordForm.newPassword !== this.updatePasswordForm.confirmPassword) {
        this.$message.error("两次输入的密码不一致")
        return
      }
      UserApi.updatePassword(this.updatePasswordForm).then(res => {
        if (res.code === 1) {
          this.$message.success('密码修改成功。请重新登录')
          this.loginForm.password = ''
          this.forceUpdateShow = false
      let _this = this
      _this.$refs.updatePasswordForm.validate(valid => {
        if (valid) {
          if (this.updatePasswordForm.newPassword !== this.updatePasswordForm.confirmPassword) {
            _this.$message.error('两次输入的密码不一致')
            return
          }
          UserApi.updatePassword(this.updatePasswordForm).then(res => {
            if (res.code === 1) {
              _this.$message.success('密码修改成功。请重新登录')
              _this.loginForm.password = ''
              _this.forceUpdateShow = false
            }
          })
        } else {
          return false
        }
      })
    },
@@ -189,6 +200,7 @@
            }
            if (result && result.code === 1) {
              _this.setUserName(_this.loginForm.userName)
              _this.setUserInfo(result.data)
              _this.$router.push({ path: '/dashboard' })
            } else {
              _this.loading = false
@@ -205,7 +217,7 @@
        }
      })
    },
    ...mapMutations('user', ['setUserName'])
    ...mapMutations('user', ['setUserName', 'setUserInfo'])
  }
}
</script>
@@ -333,4 +345,3 @@
  }
}
</style>