Small_goose_Vue3/pages/mine/setPassword.vue

<template>
  <view class="set-password-container">
    <view class="header">设置密码</view>
    <view class="form">
      <input v-model="password" type="password" placeholder="请输入新密码" class="input" />
      <input v-model="confirmPassword" type="password" placeholder="请确认新密码" class="input" />
      <button class="submit-btn" @click="submit">确认设置</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      password: '',
      confirmPassword: ''
    }
  },
  methods: {
    submit() {
      if (!this.password || this.password.length < 6) {
        uni.showToast({ title: '密码至少6位', icon: 'none' })
        return
      }
      if (this.password !== this.confirmPassword) {
        uni.showToast({ title: '两次密码不一致', icon: 'none' })
        return
      }
      uni.request({
        url: 'http://localhost:9527/api/setPassword',
        method: 'POST',
        data: {
          uid: uni.getStorageSync('uid'),
          password: this.password
        },
        success: (res) => {
          if (res.statusCode === 200 && res.data.code === 200) {
            uni.showToast({ title: '设置成功', icon: 'success' })
            setTimeout(() => uni.navigateBack(), 1000)
          } else {
            uni.showToast({ title: res.data.message || '设置失败', icon: 'none' })
          }
        }
      })
    }
  }
}
</script>

<style scoped>
.set-password-container {
  min-height: 100vh;
  background: #f7f8fa;
  padding: 40rpx 0;
}
.header {
  text-align: center;
  font-size: 36rpx;
  font-weight: bold;
  margin-bottom: 40rpx;
  background: #fff;
  padding: 32rpx 0;
}
.form {
  background: #fff;
  border-radius: 20rpx;
  margin: 0 32rpx;
  padding: 40rpx 32rpx;
  box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.04);
  display: flex;
  flex-direction: column;
  gap: 32rpx;
}
.input {
  width: 100%;
  height: 80rpx;
  border: 1rpx solid #eee;
  border-radius: 12rpx;
  padding: 0 24rpx;
  font-size: 30rpx;
  background: #f7f8fa;
}
.submit-btn {
  width: 100%;
  background: #409EFF;
  color: #fff;
  border-radius: 12rpx;
  font-size: 32rpx;
  margin-top: 16rpx;
  height: 80rpx;
}
</style>