feat:通行证

wk

2024-09-14 0bd15917637362c104eb157d5163f65bf9503780

 pages/customer-page/customer-my/userMange/userManageEdit/userManageEdit.vue

@@ -6,32 +6,7 @@
            :rules="rules"
            ref="uForm"
            :errorType="errorType">
            <u-form-item label="服务部门"
               labelWidth="20%"
               @click="treeOpen"
               borderBottom
               prop="deptIds">
               <u--input placeholder="请选择服务部门"
                  v-model="model1.deptIds"
                  class="input"
                  type="text"></u--input>
               <qian-tree ref="tkitree"
                  :range="department"
                  confirmColor="#4e8af7"
                  :multiple="true"
                  :selectParent="true"
                  title="选择部门"
                  @confirm="treeChooseValue" />
            </u-form-item>
            <u-form-item label="身份证"
               labelWidth="20%"
               borderBottom
               prop="idCard">
               <u--input border="none"
                  v-model="model1.idCard"
                  placeholder="请输入身份证"></u--input>
            </u-form-item>
            <u-form-item label="真实姓名"
            <u-form-item label="姓名"
               labelWidth="20%"
               borderBottom
               prop="name">
@@ -55,6 +30,21 @@
                  v-model="model1.password"
                  placeholder="请输入密码"></u--input>
            </u-form-item>
              <view class="intensity">
               <view class="psdText">密码强度</view>
               <view
                  class="line"
                  :class="[level.includes('low') ? 'low' : '']"></view>
               <view
                  class="line"
                  :class="[level.includes('middle') ? 'middle' : '']"></view>
               <view
                  class="line"
                  :class="[level.includes('high') ? 'high' : '']"></view>
               <div class="warningtext">
               密码应由8-16位数字、字母、符号组成。请不要使用容易被猜到的密码
               </div>
            </view>
         </u--form>
      </view>
      <view class="submit-button"><u-button :text="userId ? '确认修改' : '确认提交'"
@@ -72,7 +62,79 @@
         qianTree
      },
      data() {
         const checkPassword = (rule, value, callback) => {
        // let roles = this.$store.getters.roles;//当前用户角色id
        // let passL = 8;
        // if (roles.concat(1)){
        //   passL = 10
        // }
        let passL = 8;
        this.level = []
        if(!value) {
          return callback()
        }
        if(value.length < passL) {
          return callback(`密码不能少于${passL}位`)
        }
        if(value.length > 16) {
          return callback('密码不能大于16位')
        }
        //校验是数字
        const regex1 = /^\d+$/
        // 校验字母
        const regex2 = /^[A-Za-z]+$/
        // 校验符号
        const regex3 =
            /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘'，。、]+$/;
        if(regex1.test(value)) {
          this.level.push('low')
          return callback('密码强度过低')
        }else if(regex2.test(value)) {
          this.level.push('low')
          return callback('密码强度过低')
        }else if(regex3.test(value)) {
          this.level.push('low')
          return callback('密码强度过低')
        }else if(/^[A-Za-z\d]+$/.test(value)) {
          this.level.push('low')
          this.level.push('middle')
          return callback('密码强度过低')
        }else if(
            /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘'，。、\d]+$/.test(
                value
            )
        ) {
          this.level.push('low')
          this.level.push('middle')
          return callback('密码强度过低')
        }else if(
            /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘'，。、A-Za-z]+$/.test(
                value
            )
        ) {
          this.level.push('low')
          this.level.push('middle')
          return callback('密码强度过低')
        } else if (
            /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘'，。、A-Za-z\d]+$/.test(
                value
            )
        ) {
          this.level.push('low')
          this.level.push('middle')
          this.level.push('high')
        }
        return callback()
      };
     const phone = (rule, value, callback) =>{
          if(/^1[34578]\d{9}$/.test(value) == false){
                    callback(new Error("请输入正确的手机号"));
                }else{
                    callback();
                }
     }
         return {
            level:[],
            department: [],
            model1: {
               departmentName: '',
@@ -106,18 +168,24 @@
                  message: '请填写姓名',
                  trigger: ['blur', 'change']
               },
               phone: {
                  type: 'string',
                  required: true,
                  message: '请填写手机号',
                  trigger: ['blur', 'change']
               },
               password: {
                  type: 'string',
                  required: true,
                  message: '请填写密码',
                  trigger: ['blur', 'change']
               }
               phone:  [{
                     required: true,
                     message: '请输入手机号',
                     trigger: ['blur', 'change']
                  },
                     {
                     validator: phone,
                     trigger: 'change'
                     }],
                        password: [{
                     required: false,
                     message: '请设置密码',
                     trigger: ['blur', 'change']
                  },
                     {
                     validator: checkPassword,
                     trigger: 'change'
                     }],
            },
            errorType: 'message'
         };
@@ -145,7 +213,8 @@
               url: `${BaseUrl}/admin/dept/ownTree`,
               header: {
                  Authorization: 'Bearer' + ' ' + uni.getStorageSync('token'),
                  CLIENT_TOC: 'Y'
                  clientToc: 'Y',
                   'CLIENT_TOC': 'Y',
               },
               success: res => {
                  this.department = res.data.data;
@@ -280,4 +349,43 @@
         }
      }
   }
   .intensity {
    width: 100%;
    margin-top: 10rpx;
    .psdText {
      font-size: 14px;
      margin-right: 10px;
    }

    .line {
      display: inline-block;
      width: 70rpx;
      height: 8rpx;
      background: #d8d8d8;
      border-radius: 6rpx;
      margin-right: 16rpx;

      &.low {
        background: #f4664a;
      }

      &.middle {
        background: #ffb700;
      }

      &.high {
        background: #2cbb79;
      }
    }

    .level {
      margin: 0 32rpx 0 16rpx;
    }

    .warningtext {
      color: #5a5a5a;
      font-size: 24rpx;
      margin-top: 10rpx;
    }
  }
</style>