<!--修改用户密码-->
<template>
    <div>
        <el-form
            :model="password"
            ref="password"
            label-width="100px"
            class="demo-ruleForm"
            :rules="rule"
        >
            <el-form-item
                label="新密码"
                prop="newPwd"
            >
                <el-input
                    type="password"
                    v-model="password.newPwd"
                ></el-input>
            </el-form-item>
            <el-form-item
                label="确认密码"
                prop="oldPwd"
            >
                <el-input
                    type="password"
                    v-model="password.oldPwd"
                ></el-input>
            </el-form-item>
            <el-form-item>
                <div style="text-align: center;margin-top:50px;">
                    <el-button
                        type="primary"
                        @click="submitForm ('password')"
                    >提交</el-button>
                    <el-button @click="resetForm('password')">重置</el-button>
                </div>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
import { changePwd } from "@/api/users/index";
import store from "@/store";
export default {
  data() {
    return {
      password: {
        newPwd: "",
        oldPwd: ""
      },
      rule: {
        newPwd: [{ required: true, message: "请输入新密码", trigger: "blur" }],
        oldPwd: [{ required: true, message: "请输入确认密码", trigger: "blur" }]
      }
    };
  },
  methods: {
    submitForm() {
      if (this.password.newPwd !== this.password.oldPwd) {
        this.$message.error("您两次输入的密码不相同，请重新输入");
      } else {
        const data = {
          id: store.getters.id,
          password: this.password.newPwd
        };
        changePwd(data).then(res => {
          console.log(res, "xiuga9");
          this.$message.success('修改成功!')
          this.logout();
        });
      }
    },
     async logout() {
      await this.$store.dispatch("user/logout").then(() => {
        this.$router.push("/login");
      });
    },
  }
};
</script>
<style lang="scss" scoped>
.demo-ruleForm {
  width: 30%;
  margin: 0 auto;
  margin-top: 100px;
}
</style>