<template>
  <view class="modify-password-page">
    <view class="form-item">
      <text>旧密码</text>
      <input type="password" placeholder="请输入旧密码" v-model="oldPassword"/>
    </view>
    <view class="form-item">
      <text>新密码</text>
      <input type="password" placeholder="请输入新密码" v-model="newPassword"/>
    </view>
    <view class="form-item">
      <text>确认新密码</text>
      <input type="password" placeholder="再次输入新密码" v-model="confirmPassword"/>
    </view>
    <button @click="submitPassword">提交</button>
  </view>
</template>
<script>
import request from "@/utils/request";

export default {
  data() {
    return {
      oldPassword: '',
      newPassword: '',
      confirmPassword: ''
    };
  },
  methods: {
    submitPassword() {
      if (!this.oldPassword || !this.newPassword || !this.confirmPassword) {
        uni.showToast({
          title: '请填写完整信息',
          icon: 'none'
        });
        return;
      }
      if (this.newPassword !== this.confirmPassword) {
        uni.showToast({
          title: '两次密码输入不一致',
          icon: 'none'
        });
        return;
      }

      // 在这里调用接口提交新密码
      request({
        url: '/system/user/profile/update-password', // 修改为实际的 API 地址
        method: 'PUT',
        data: {
          oldPassword: this.oldPassword,
          newPassword: this.newPassword
        },
      }).then(res => {
        if (res.data) {
          uni.showToast({
            title: '密码修改成功',
            icon: 'success'
          });
          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        } else {
          uni.showToast({
            title: '修改失败，请重试',
            icon: 'none'
          });
        }
      });
    }
  }
};
</script>
<style scoped>
.modify-password-page {
  padding: 20px;
}

.form-item {
  margin-bottom: 15px;
}

.form-item text {
  display: block;
  margin-bottom: 5px;
  font-size: 16px;
}

input {
  width: 95%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

button {
  width: 100%;
  padding: 10px;
  background-color: #007aff;
  color: #fff;
  font-size: 16px;
  text-align: center;
  border-radius: 4px;
}

</style>
