resetPassword.vue 1.59 KB
<template>
  <div class="login_container">
    <img src="@/assets/icon/bg_login_2.png" />
    <div class="login_box">
      <NafmHeader navClass="nafmii-head-bg1" :title="title" bgColor="transparent" />
    </div>
    <div class="login_content">
      <div class="login_form_box">
        <div class="login_form">
          <van-field v-model.trim="password" clearable type="password" maxlength="16" :left-icon="passwordIcon" placeholder="请输入6-16位密码" />
          <van-field v-model.trim="aginPassword" clearable type="password" maxlength="16" :left-icon="passwordIcon" placeholder="再次输入6-16位密码" />
          <div class="login_btn" :class="{loginActive:isBothValue}" @click="handleReset">重 置</div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'Login',
  components: {},
  data() {
    return {
      password: "",
      aginPassword: "",
      passwordIcon: require('@/assets/icon/password.png'),
    }
  },
  computed: {
    isBothValue() {
      if (this.password && this.aginPassword) {
        return true
      } else {
        return false
      }
    },
  },
  methods: {
    // 登录操作
    handleReset() {
      if (!this.password) {
        Toast('请输入密码')
        return
      }
      if (!this.aginPassword) {
        Toast('请再次输入密码')
        return
      }
      if (this.password != this.aginPassword) {
        Toast('两次输入的密码不一致')
        return
      }

      // todo 请求接口
      console.log(1)
    },
  }
}
</script>
<style lang="less" scoped>
@import "./less/login.less";
</style>