From 0bd15917637362c104eb157d5163f65bf9503780 Mon Sep 17 00:00:00 2001 From: wk Date: 星期六, 14 九月 2024 16:53:14 +0800 Subject: [PATCH] feat:通行证 --- pages/login/resetPassword/resetPassword.vue | 259 +++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 208 insertions(+), 51 deletions(-) diff --git a/pages/login/resetPassword/resetPassword.vue b/pages/login/resetPassword/resetPassword.vue index b862f88..3aec41c 100644 --- a/pages/login/resetPassword/resetPassword.vue +++ b/pages/login/resetPassword/resetPassword.vue @@ -5,8 +5,26 @@ :rules="rules" ref="uForm" label-width="80px"> + <template v-if="isShowPassword"> + <u-form-item + prop="originalPassword" + label="鍘熷瘑鐮�" + required + borderBottom> + <u-input v-if='inputType==="password"' + v-model="modelForm.originalPassword" + border="surround" + placeholder="瀵嗙爜搴旂敱8-16浣嶆暟瀛椼�佸瓧姣嶃�佺鍙风粍鎴愩��" + :type='inputType' /> + <u-input v-else + v-model="modelForm.originalPassword" + border="surround" + placeholder="瀵嗙爜搴旂敱8-16浣嶆暟瀛椼�佸瓧姣嶃�佺鍙风粍鎴愩��" + :type='inputType' /> + </u-form-item> + </template> <u-form-item prop="password" - label="瀵嗙爜" + label="鏂板瘑鐮�" required borderBottom> <u-input v-if='inputType==="password"' @@ -20,8 +38,23 @@ placeholder="璇疯緭鍏ュ瘑鐮�(浠呮敮鎸佹暟瀛楀瓧姣嶄笅鍒掔嚎)" :type='inputType' /> </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-item prop="secondPassword" - label="浜屾纭" + label="纭瀵嗙爜" required borderBottom> <u-input v-if='inputType==="password"' @@ -40,7 +73,7 @@ <u-button type="primary" text="纭畾" :loading="processLoading" - @click.stop="process"></u-button> + @click="process"></u-button> </view> </u-form-item> <u-form-item prop="checkboxValue"> @@ -62,63 +95,146 @@ <script> export default { data() { + const validatePass = (rule, value, callback) => { + if (this.modelForm.password !== "") { + if (value !== this.modelForm.password) { + callback(new Error("涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!")); + } else { + callback(); + } + } else { + callback(); + } + }; + 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( + /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]路~锛丂#锟�%鈥︹��&*锛堬級鈥斺�擻-+={}|銆娿�嬶紵锛氣�溾�濄�愩�戙�侊紱鈥�'锛屻�傘�丄-Za-z]+$/.test( + value + ) + ) { + this.level.push('low') + this.level.push('middle') + return callback('瀵嗙爜寮哄害杩囦綆') + } else if ( + /^[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]路~锛丂#锟�%鈥︹��&*锛堬級鈥斺�擻-+={}|銆娿�嬶紵锛氣�溾�濄�愩�戙�侊紱鈥�'锛屻�傘�丄-Za-z\d]+$/.test( + value + ) + ) { + this.level.push('low') + this.level.push('middle') + this.level.push('high') + } + return callback() + }; return { + level:[], + isShowPassword: true, userInfo: {}, checkboxValue: [], inputType: 'password', isFocus: false, modelForm: { - password: '', - secondPassword: '' + originalPassword:'', //鍘熷瀵嗙爜 + password: '', //鏂板瘑鐮� + secondPassword: '', //浜屾纭瀵嗙爜 + username:'', + userId:'' }, processLoading: false, rules: { + originalPassword: [{ + type: 'string', + required: this.isShowPassword, + message: '璇峰~鍐欏瘑鐮�', + trigger: ['blur', 'change'] + }], password: [{ - type: 'string', - required: true, - message: '璇峰~鍐欏瘑鐮�', - trigger: ['blur', 'change'] - }, - { - min: 2, - max: 10, - message: '瀵嗙爜闀垮害搴斾笉灏忎簬2浣�,涓嶅ぇ浜�10浣� ', - trigger: ['blur', 'change'] - }, - { - pattern: /^[a-zA-Z0-9_]+$/, - message: '璇疯緭鍏ユ纭牸寮忕殑瀵嗙爜', - trigger: ['blur', 'change'] - } - ], + required: true, + validator: checkPassword, + trigger: 'change' + }], secondPassword: [{ - type: 'string', - required: true, - message: '璇峰~鍐欎簩娆″瘑鐮�', - trigger: ['blur', 'change'] - }, - { - min: 2, - max: 10, - message: '瀵嗙爜闀垮害搴斾笉灏忎簬2,涓嶅ぇ浜�10', - trigger: ['blur', 'change'] - } - ] + required: true, + validator: validatePass, + trigger: "blur" + }] } } }, computed: { roleType() { return uni.getStorageSync('roleType') - } + }, + userId() { + if(uni.getStorageSync('userId')) { + this.modelForm.userId = uni.getStorageSync('userId') + } + return uni.getStorageSync('userId') + } }, onLoad(params) { - if (this.roleType === 3) { - this.userInfo = JSON.parse(params.userInfo) - } else { - this.getUserInfo(params.phone, params.idCard) - } - + // if (this.roleType === 3) { + // this.userInfo = JSON.parse(params.userInfo) + // } else { + // this.getUserInfo(params.phone, params.idCard) + // } + if(params.userInfo) { + this.modelForm.username = JSON.parse(params.userInfo).username + this.modelForm.userId = JSON.parse(params.userInfo).userId.toString() //userId + if(JSON.parse(params.userInfo).isShowPassword) { + this.isShowPassword = false + }else { + this.isShowPassword = true + } + }else { + this.modelForm.username = uni.getStorageSync('userInfo').username + this.modelForm.userId = uni.getStorageSync('userInfo').userId.toString() + this.isShowPassword = true + } }, onReady() { this.$refs.uForm.setRules(this.rules) @@ -139,14 +255,12 @@ this.isFocus = true }, process() { - if (this.modelForm.password !== this.modelForm.secondPassword) return uni.$u.toast('瀵嗙爜涓嶄竴鑷�,璇锋鏌�') - this.userInfo.password = this.modelForm.secondPassword; - this.processLoading = true; this.$refs.uForm.validate().then(res => { - this.$reqAllJson('appUpdateById', this - .userInfo, { method: 'PUT', 'Content-type': 'application/json' }).then(res => { - this.processLoading = false; + this.processLoading = true; + this.$reqAllJson('appUpdateById', this.modelForm, { method: 'PUT', 'Content-type': 'application/json' }).then(res => { + if (res.code === 0) { + this.processLoading = false; this.$u.toast('淇敼鎴愬姛,鍗冲皢鍥炲埌棣栭〉') setTimeout(() => { uni.reLaunch({ @@ -158,8 +272,10 @@ } }) }).catch(errors => { - uni.$u.toast('鏍¢獙澶辫触') - }) + // uni.$u.toast('鏍¢獙澶辫触') + }).finally(() => { + this.processLoading = false; + }) } } } @@ -172,7 +288,48 @@ margin: vww(10) auto; .process-button { - margin-top: vww(20); + width: 30%; + margin: vww(20) auto; + min-width: 200rpx; } + .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> \ No newline at end of file +</style> -- Gitblit v1.9.1