From cfe04910a5b70d220dd1e6ac9b84328112c76808 Mon Sep 17 00:00:00 2001 From: 819527061@qq.com <123456> Date: 星期五, 07 六月 2024 15:54:20 +0800 Subject: [PATCH] feture:密码强制修改及密码强度限制 --- pages/register/register.vue | 358 +++++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 258 insertions(+), 100 deletions(-) diff --git a/pages/register/register.vue b/pages/register/register.vue index 63160fd..774d10c 100644 --- a/pages/register/register.vue +++ b/pages/register/register.vue @@ -17,7 +17,6 @@ iconSize="20"> <u-radio labelSize="14px" size="20px" - :customStyle="{ marginBottom: '8px' }" v-for="(item, index) in radiolist1" :key="index" :label="item.name" @@ -62,6 +61,21 @@ password clearable></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-item prop="confirmPassword" label="纭瀵嗙爜" labelWidth="20%" @@ -70,8 +84,7 @@ <u--input v-model="registerFormModel.confirmPassword" placeholder="璇疯緭鍏ュ唴瀹�" password - clearable - @blur="jiaoYanPassword"></u--input> + clearable></u--input> </u-form-item> <u-form-item prop="carNo" label="杞︾墝鍙�" @@ -159,12 +172,55 @@ :previewFullImage="true"> </u-upload> </u-form-item> - <u-form-item label="鎺ㄨ崘浜鸿处鍙�" - labelWidth="25%" - borderBottom> - <u--input v-model="registerFormModel.tuiJianMa" - placeholder="璇疯緭鍏ュ唴瀹�" - clearable></u--input> + <u-form-item prop="inventoryImg" + label="鐜繚娓呭崟" + labelWidth="24%" + borderBottom + v-if="radiovalue1 == '鍙告満'" + @click="beforeRead"> + <u-upload :fileList="fileList5" + deletable + @afterRead="afterRead" + @delete="deletePic" + name="5" + multiple + :maxCount="3" + width="250" + height="150" + :previewFullImage="true"> + </u-upload> + </u-form-item> + <u-form-item label="鏄惁闈炵叅杞﹁締" + v-if="radiovalue1 == '鍙告満'" + labelWidth="30%" + borderBottom + prop="isNonCoal"> + <u-checkbox-group v-model="registerFormModel.isNonCoal" + placement="row" + size="40" + @change="isNonCoalChange"> + <u-checkbox name="鏄�" + label-size="30"> + </u-checkbox> + </u-checkbox-group> + </u-form-item> + <u-form-item labelWidth="20%" + v-if="radiovalue1 == '鍙告満'" + label="杞﹁締绫诲瀷" + borderBottom + prop="countryNumberCar"> + <u-radio-group v-model="registerFormModel.countryNumberCar" + placement="row" + size="30" + shape="circle" + iconSize="20"> + <u-radio labelSize="14px" + size="20px" + v-for="(item, index) in countryNumberCarList" + :key="index" + :label="item.label" + :name="item.name"></u-radio> + </u-radio-group> </u-form-item> </u--form> </view> @@ -180,12 +236,6 @@ type="primary" @click="registerClick" :loading="registerClickloading"></u-button></view> - <!-- 鍥剧墖棰勮寮瑰嚭妗� --> - <!-- <view class="previewImage-container"> - <u-popup :show="previewImageShow" mode="center" @close="previewImageClose" @open="previewImageOpen"> - <u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''" width="400px" height="400px"></u--image> - </u-popup> - </view> --> </view> </template> @@ -194,27 +244,9 @@ import { BaseUrl } from '@/api/publicInterface.js'; import { mapMutations } from 'vuex'; export default { - // onLoad: function() { - // // 鏌ョ湅鏄惁鎺堟潈 - // wx.getSetting({ - // success (res){ - // if (res.authSetting['scope.userInfo']) { - // // 宸茬粡鎺堟潈锛屽彲浠ョ洿鎺ヨ皟鐢� getUserInfo 鑾峰彇澶村儚鏄电О - // wx.getUserInfo({ - // success: function(res) { - // console.log('res.userInfo',res.userInfo) - // } - // }) - // } - // } - // }) - // }, // 鐩戝惉椤甸潰鍒濇娓叉煋瀹屾垚銆傛敞鎰忓鏋滄覆鏌撻�熷害蹇紝浼氬湪椤甸潰杩涘叆鍔ㄧ敾瀹屾垚鍓嶈Е鍙� onReady() { this.$refs.regesterFormRef.setRules(this.rules); - // this.$refs.regesterFormRef.validate().then(res => {}).catch(err => { - // console.log(err); - // }) }, onLoad(params) { if (params) { @@ -223,7 +255,83 @@ } }, data() { + const validatePass = (rule, value, callback) => { + if (this.registerFormModel.confirmPassword !== "") { + if (value !== this.registerFormModel.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:[], //瀵嗙爜寮哄害鏁扮粍 // 杞︾墝鍙烽敭鐩樻帶鍒� carNumShow: false, keyValue: '', @@ -233,7 +341,7 @@ name: '', username: '', openId: '', - type: 2, + type: 3, idCard: '', carNo: '', carImg: '', @@ -241,13 +349,25 @@ tuiJianMa: '', confirmPassword: '', tradeQualificationImg: '', - roadTransportImg: '' + roadTransportImg: '', + isNonCoal: [], + isCoalCar: 1, //鏄惁涓虹叅鐐溅杈�(鍙告満浣跨敤瀛楁) 1 鏄� 2 涓嶆槸 + inventoryImg: '', + countryNumberCar: 0, //杞﹁締绫诲瀷;鍥戒簲 1锛屽浗鍏� 2 }, fileList1: [], fileList2: [], fileList3: [], fileList4: [], + fileList5: [], + fileList6: [], rules: { + inventoryImg: { + required: false, + }, + countryNumberCar: { + required: false, + }, name: { type: 'string', required: true, @@ -290,23 +410,16 @@ message: '璇疯缃垵濮嬪瘑鐮�', trigger: ['blur', 'change'] }, - { - min: 6, - max: 12, - message: '闀垮害鍦�6-12涓瓧绗︿箣闂�' - } + { + validator: checkPassword, + trigger: 'change' + } ], confirmPassword: [{ - required: true, - message: '璇疯缃垵濮嬪瘑鐮�', - trigger: ['blur', 'change'] - }, - { - min: 6, - max: 12, - message: '闀垮害鍦�6-12涓瓧绗︿箣闂�' - } - ], + required: true, + validator: validatePass, + trigger: "blur" + }], carNo: [{ type: 'string', required: true, @@ -347,20 +460,31 @@ required: true, message: '璇蜂笂浼犱粠涓氳祫鏍艰瘉鐓х墖', trigger: ['blur', 'change'] - } + }, }, - // 鍩烘湰妗堝垪鏁版嵁 radiolist1: [{ - name: '璐т唬', + name: '鍙告満', disabled: false }, { - name: '鍙告満', + name: '璐т唬', disabled: false } ], - // u-radio-group鐨剉-model缁戝畾鐨勫�煎鏋滆缃负鏌愪釜radio鐨刵ame锛屽氨浼氳榛樿閫変腑 - radiovalue1: '璐т唬', + countryNumberCarList: [{ + name: 1, + label: '鍥戒簲', + }, + { + name: 2, + label: '鍥藉叚', + }, + { + name: 3, + label: '鏂拌兘婧�', + } + ], + radiovalue1: '鍙告満', beforeChangeValue: '', // 鏇存崲瑙掕壊寮规 editRoleModelShow: false, @@ -368,7 +492,7 @@ content: '褰撳墠濉叆淇℃伅锛屽垏鎹㈣鑹插悗锛屽嵆娓呴櫎锛屾槸鍚﹀垏鎹紵', wxcode: '', openid: '', - registerClickloading: false + registerClickloading: false, }; }, watch: { @@ -397,40 +521,36 @@ methods: { ...mapMutations(['changeisUploadimg']), registerClick() { - if (this.registerFormModel.password == this.registerFormModel.confirmPassword) { - this.$refs.regesterFormRef - .validate() - .then(res => { - console.log(this.registerFormModel); - this.registerClickloading = true; - this.registerFormModel.username = this.registerFormModel.phone; - apiRegister(this.registerFormModel) - .then(res => { - this.registerClickloading = false; - if (res.data.code == 0) { - uni.showToast({ - title: '娉ㄥ唽鎴愬姛,鍗冲皢杩斿洖鐧诲綍椤�', - icon: 'none', - duration: 1000 - }); - setTimeout(() => { - uni.redirectTo({ url: '/pages/login/login' }); - }, 1000); - } else { - this.$u.toast(res.data.msg ? res.data.msg : '娣诲姞澶辫触'); - } - }) - .catch(err => { - console.log('閿欒', err); - }); - }) - .catch(err => { - console.log('err', err); - this.$u.toast('璇疯鑼冭緭鍏ュ唴瀹�'); - }); - } else { - this.$u.toast('涓ゆ瀵嗙爜涓嶄竴鑷�'); - } + this.$refs.regesterFormRef + .validate() + .then(res => { + console.log(this.registerFormModel); + this.registerClickloading = true; + this.registerFormModel.username = this.registerFormModel.phone; + apiRegister(this.registerFormModel) + .then(res => { + this.registerClickloading = false; + if (res.data.code == 0) { + uni.showToast({ + title: '娉ㄥ唽鎴愬姛,鍗冲皢杩斿洖鐧诲綍椤�', + icon: 'none', + duration: 1000 + }); + setTimeout(() => { + uni.redirectTo({ url: '/pages/login/login' }); + }, 1000); + } else { + this.$u.toast(res.data.msg ? res.data.msg : '娣诲姞澶辫触'); + } + }) + .catch(err => { + console.log('閿欒', err); + }); + }) + .catch(err => { + console.log('err', err); + this.$u.toast('璇疯鑼冭緭鍏ュ唴瀹�'); + }); }, // 鍗曢�夋浜嬩欢 groupChange(e) {}, @@ -444,11 +564,6 @@ ) { this.$refs.regesterFormRef.clearValidate(); this.beforeChangeValue = e; - } - }, - jiaoYanPassword() { - if (this.registerFormModel.password != this.registerFormModel.confirmPassword) { - this.$u.toast('涓ゆ瀵嗙爜涓嶄竴鑷�'); } }, // 涓婁紶鍥剧墖鏂规硶 @@ -493,9 +608,6 @@ url: BaseUrl + '/admin/sys-file/uploadUnToken', filePath: url, name: 'file', - formData: { - // user: '' - }, success: res => { if (num == 1) { this.registerFormModel.carImg = JSON.parse(res.data).data.url; @@ -509,6 +621,10 @@ resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); } else if (num == 4) { this.registerFormModel.tradeQualificationImg = JSON.parse(res.data) + .data.url; + resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); + } else if (num == 5) { + this.registerFormModel.inventoryImg = JSON.parse(res.data) .data.url; resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); } @@ -535,6 +651,9 @@ this.$nextTick(() => { this.editRoleModelShow = false; }); + }, + isNonCoalChange() { + this.registerFormModel.isCoalCar = this.registerFormModel.isNonCoal.length !== 0 ? 1 : 2 } } }; @@ -573,4 +692,43 @@ } } } -</style> \ No newline at end of file + .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> -- Gitblit v1.9.1