InspectionCleaning/pages/changePwd/index.vue

<template>
  <view class="content">
    <view class="tip-1">更改密码</view>
    <view class="tip-2">您可以设置新的密码</view>
    <u-input v-model="oldPwd" type="password" border placeholder="原密码" class="input-box" style="margin-top: 100rpx;"></u-input>

    <u-input v-model="newPwd" type="password" border placeholder="请输入新的密码" class="input-box"></u-input>

    <u-input v-model="confirmPwd" type="password" border placeholder="请再一次输入新密码" class="input-box"></u-input>
    <u-button type="primary" @click="submit()" class="submit-btn">确认</u-button>
  </view>
</template>
<script>
import bcrypt from 'bcryptjs'
import { jwtDecode } from 'jwt-decode'
import { UpdatePwdApi } from '@/api/apiAdmin'
import { loginApi } from '@/api/apiList'
export default {
  data() {
    return {
      oldPwd: '',
      newPwd: '',
      confirmPwd: ''
    }
  },
  mounted() {
    // console.log("%c%s", "color:red", "mounted--");
    uni.hideLoading() // 关闭 Loading
  },
  onLoad() {},
  methods: {
    async submit() {
      if (!this.oldPwd) {
        return uni.showToast({
          title: '请输入原密码',
          icon: 'none'
        })
      }
      if (!this.newPwd) {
        return uni.showToast({
          title: '请输入新密码',
          icon: 'none'
        })
      }
      if (!this.confirmPwd) {
        return uni.showToast({
          title: '请再次输入新密码',
          icon: 'none'
        })
      }
      if (this.confirmPwd !== this.newPwd) {
        return uni.showToast({
          title: '两次密码校验不一致',
          icon: 'none'
        })
      }
      if (!RegExp(/^(?![^a-zA-Z]+$)(?!\D+$)/).test(this.newPwd)) {
        return uni.showToast({
          title: '密码必须有数字和字母组成,且长度为8~16',
          icon: 'none'
        })
      }
      // return
      // let salt = bcrypt.genSaltSync(12)
      let req = {
        oldPwd: this.oldPwd,
        pwd: this.newPwd
      }
      const res = await UpdatePwdApi(req)
      if (!res.succeed) {
        uni.showToast({
          title: res.data.errors || '修改失败',
          icon: 'none'
        })
        return
      }
      uni.showModal({
        title: '提示',
        content: '密码修改成功，请重新登录',
        showCancel: false,
        success: function (res) {
          if (res.confirm) {
            // 确定退出
            let u = navigator.userAgent
            let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 //android
            // let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios
            try {
              if (isAndroid && AndroidJs) {
                console.log('%c%s', 'color:red', '安卓--调用返回方法')
                const reqRow = {
                  name: 'logout',
                  data: ''
                }
                AndroidJs.func(JSON.stringify(reqRow)) // 给安卓传参
              } else {
                console.log('%c%s', 'color:red', '苹果--调用返回方法')
                const reqRow = {
                  name: 'back-iphone',
                  data: ''
                }
                window.webkit.messageHandlers.func.postMessage(JSON.stringify(reqRow)) // 给ios 传参
              }
            } catch (e) {
              console.log(e, 'e-----判断安卓苹果类型出错')
            }
            return
          }
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.content {
  // height: 100vh; // 确保容器有明确高度
  background: linear-gradient(to bottom, #f7fcfd, #f7f8fc);
  // background-color: #f7f8fc;
  overflow: hidden;
  .tip-1 {
    font-size: 40rpx;
    font-weight: 700;
    margin-left: 50rpx;
    margin-top: 60rpx;
  }
  .tip-2 {
    margin-left: 50rpx;
    color: #afb3be;
    margin-top: 10rpx;
  }
  .input-box {
    border-radius: 10rpx;
    margin-left: 35rpx;
    margin-right: 35rpx;
    height: 80rpx;
    margin-top: 40rpx;
    background-color: #f2f4f5;
    border: 1px solid transparent !important;
  }
  .submit-btn {
    border-radius: 35rpx;
    margin-left: 35rpx;
    margin-right: 35rpx;
    height: 80rpx;
    margin-top: 80rpx;
  }
}
</style>