张含笑
2025-11-07 450dc8a1e4e0d643817ffd0eee04b938cc84af74
src/subPackages/userDetail/password/index.vue
@@ -6,19 +6,16 @@
            <div class="orderRow">
               <!-- type="password" :password-icon="passwordIcon" -->
               <div class="rowTitle">原始密码</div>
               <u-input input-align="right" v-model="passwordForm.oldPassword"   placeholder="请输入"
                  class="input-item" />
               <input type="password" v-model="passwordForm.oldPassword" placeholder="请输入" class="input-item" />
            </div>
            <div class="orderRow">
               <div class="rowTitle">新密码</div>
               <u-input input-align="right" v-model="passwordForm.newPassword" placeholder="请输入"
                  class="input-item" />
               <input type="password" v-model="passwordForm.newPassword" placeholder="请输入" class="input-item" />
            </div>
            <div class="orderRow">
               <div class="rowTitle">确认密码</div>
               <u-input input-align="right" v-model="passwordForm.newPassword1"  placeholder="请输入"
                  class="input-item" />
               <input type="password" v-model="passwordForm.newPassword1" placeholder="请输入" class="input-item" />
            </div>
         </div>
      </view>
@@ -39,10 +36,10 @@
      updateInfo,
      updatePassword
   } from '@/api/user/index.js';
 const passwordIcon={
      show: 'fas fa-eye',     // 显示密码时的图标
      hide: 'fas fa-eye-slash' // 隐藏密码时的图标
    }
   const passwordIcon = {
      show: 'fas fa-eye', // 显示密码时的图标
      hide: 'fas fa-eye-slash' // 隐藏密码时的图标
   }
   const userStore = useUserStore();
   const passwordForm = ref({
      oldPassword: '',
@@ -51,36 +48,36 @@
   });
   // 校验密码不能包含中文
   const validatePasswordNoChinese = (password) => {
     const chineseRegex = /[\u4e00-\u9fa5]/;
     if (chineseRegex.test(password)) {
      const chineseRegex = /[\u4e00-\u9fa5]/;
      if (chineseRegex.test(password)) {
      uni.showToast({
         title: '密码不能包含中文字符',
         icon: 'none',
         duration: 2000
      });
       return false;
     }
     return true;
         uni.showToast({
            title: '密码不能包含中文字符',
            icon: 'none',
            duration: 2000
         });
         return false;
      }
      return true;
   };
   // 校验密码复杂度(长度≥6位,包含字母和数字)
   const validatePasswordStrength = (password) => {
     if (password.length < 6) {
      if (password.length < 6) {
      uni.showToast({
         title: '密码长度不能少于6位',
         icon: 'none',
         duration: 2000
      });
       return false;
     }
     // const hasLetter = /[a-zA-Z]/.test(password);
     // const hasNumber = /\d/.test(password);
     // if (!hasLetter || !hasNumber) {
     //   ElMessage.error('密码需同时包含字母和数字');
     //   return false;
     // }
     return true;
         uni.showToast({
            title: '密码长度不能少于6位',
            icon: 'none',
            duration: 2000
         });
         return false;
      }
      // const hasLetter = /[a-zA-Z]/.test(password);
      // const hasNumber = /\d/.test(password);
      // if (!hasLetter || !hasNumber) {
      //   ElMessage.error('密码需同时包含字母和数字');
      //   return false;
      // }
      return true;
   };
   const clearForm = () => {
      passwordForm.value = {
@@ -93,41 +90,41 @@
      clearForm();
   };
   const submit = () => {
// 原始密码校验
    if (!passwordForm.value.oldPassword) {
      // 原始密码校验
      if (!passwordForm.value.oldPassword) {
     uni.showToast({
        title: '请输入原始密码',
        icon: 'none',
        duration: 2000
     });
      return;
    }
     // 中文校验
    if (!validatePasswordNoChinese(passwordForm.value.newPassword)) return;
    // 新密码校验
    if (!passwordForm.value.newPassword) {
         uni.showToast({
            title: '请输入原始密码',
            icon: 'none',
            duration: 2000
         });
         return;
      }
      // 中文校验
      if (!validatePasswordNoChinese(passwordForm.value.newPassword)) return;
      // 新密码校验
      if (!passwordForm.value.newPassword) {
     uni.showToast({
        title: '请输入新密码',
        icon: 'none',
        duration: 2000
     });
      return;
    }
    // 确认密码校验
    if (passwordForm.value.newPassword !== passwordForm.value.newPassword1) {
         uni.showToast({
            title: '请输入新密码',
            icon: 'none',
            duration: 2000
         });
         return;
      }
      // 确认密码校验
      if (passwordForm.value.newPassword !== passwordForm.value.newPassword1) {
     uni.showToast({
        title: '两次输入的新密码不一致',
        icon: 'none',
        duration: 2000
     });
      return;
    }
         uni.showToast({
            title: '两次输入的新密码不一致',
            icon: 'none',
            duration: 2000
         });
         return;
      }
    // 复杂度校验
    if (!validatePasswordStrength(passwordForm.value.newPassword)) return;
      // 复杂度校验
      if (!validatePasswordStrength(passwordForm.value.newPassword)) return;
      updatePassword(md5(passwordForm.value.oldPassword),
         md5(passwordForm.value.newPassword),
         md5(passwordForm.value.newPassword1)).then(res => {
@@ -139,6 +136,7 @@
            });
            clearForm();
            userStore.setUserInfo(null)
            uni.removeStorageSync('rememberedUser');
            uni.reLaunch({
               url: '/pages/login/index'
            })
@@ -170,22 +168,24 @@
   .detailBox {
      margin-top: 40rpx;
   width: 702rpx;
      width: 702rpx;
      min-height: 326rpx;
      background: #FFFFFF;
      border-radius: 12rpx;
      box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05);
.detailCon {
      .detailCon {
         padding: 0 24rpx;
      }
      .orderRow {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 96rpx;
      border-bottom: 2rpx solid #f5f5f5;
      color: #7b7b7b;
         display: flex;
         justify-content: space-between;
         align-items: center;
         height: 96rpx;
         border-bottom: 2rpx solid #f5f5f5;
         color: #7b7b7b;
         .rowTitle {
@@ -195,28 +195,36 @@
            color: #222324;
            white-space: nowrap;
         }
         ::v-deep .u-input {
            border: none !important;
            background: transparent !important;
         }
         ::v-deep .u-input__input {
         input.input-item {
            text-align: right;
            border: none !important;
            box-shadow: none !important;
            background: transparent !important;
            box-shadow: none !important;
            padding: 0 !important;
            margin: 0 !important;
            height: auto !important;
            outline: none;
            font-size: 30rpx;
            color: #222324;
            font-family: Source Han Sans CN, Source Han Sans CN;
         }
         input.input-item::placeholder {
            color: #c9c9c9;
            font-size: 30rpx;
         }
      }
   }
.btngroup {
   .btngroup {
      display: flex;
      position: absolute;
      bottom:150rpx;
      bottom: 150rpx;
   }
   .u-button:first-child{
   .u-button:first-child {
      margin-right: 30rpx;
   }
@@ -224,4 +232,4 @@
      width: 276rpx;
      height: 76rpx;
   }
</style>
</style>