<template>
  <sail-page type="loading-view" title="修改密码" isHead>
    <div slot="content">
      <div class="ModifyPassword">
          <div class="weui-cells zero-top">
            <div class="weui-cell">
              <div class="weui-cell__bd">
                <input class="weui-input" v-model="password.oldPassword" type="Password" placeholder="请输入旧密码">
              </div>
            </div>
            <div class="weui-cell">
              <div class="weui-cell__bd">
                <input class="weui-input" v-model="password.newPassword" type="Password" placeholder="请输入新密码">
              </div>
            </div>
            <div class="weui-cell">
              <div class="weui-cell__bd">
                <input class="weui-input" v-model="password.confirmPassword" type="Password" placeholder="请确认新密码">
              </div>
            </div>
          </div>
      </div>
      <van-button size="large" @click="updatePassword" :loading="registLoading" class="submit-btn">确认</van-button>
    </div>
  </sail-page>
</template>

<script>

import sailPage from "@/components/sail-page.vue";
import { Toast } from "vant";
export default {
  components: {
    sailPage
  },
  data: function(){
    return {
      registLoading:false,
      password:{
        "newPassword": "",
        "confirmPassword": "",
        "oldPassword": ""
      }
    }; 
  },
  methods: {
    updatePassword(){
      if(!this.password.oldPassword) {
        Toast.fail({
          duration: 1000,
          message: "请输入旧密码"
        });
        return;
      }
      if(!this.password.newPassword) {
        Toast.fail({
          duration: 1000,
          message: "请输入新密码"
        });
        return;
      }
      if(!this.password.confirmPassword) {
        Toast.fail({
          duration: 1000,
          message: "请再次输入新密码"
        });
        return;
      }
      this.registLoading = true;
      this.$store.dispatch("updatePasswordModule/updatePassword", this.password).then(res=>{
        this.registLoading = false;
        if (res) {
          Toast.success({
            duration: 1000,
            message: "修改密码成功"
          });
          setTimeout(() => {
            this.$router.push({ path: "/MyPersonalInfor" }); // -> 编程式跳转
          }, 1000);
        }
      });
    }
  }
};
</script>
<style lang="less">
  
</style>
<style lang="less" scoped>
  .ModifyPassword {
    margin-top: 15px;
  }
</style>