From 56ef0500de7867dc11f723fb59dc3cbbf7e63d10 Mon Sep 17 00:00:00 2001
From: 819527061@qq.com <123456>
Date: 星期二, 11 六月 2024 16:28:37 +0800
Subject: [PATCH] docs:密码强度细节完善
---
pages/register/register.vue | 347 +++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 286 insertions(+), 61 deletions(-)
diff --git a/pages/register/register.vue b/pages/register/register.vue
index 95ebd0f..3d11c68 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"
@@ -58,17 +57,71 @@
borderBottom
required>
<u--input v-model="registerFormModel.password"
- placeholder="璇疯緭鍏ュ唴瀹�"
+ placeholder="瀵嗙爜搴旂敱8-16浣嶆暟瀛椼�佸瓧姣嶃�佺鍙风粍鎴愩��"
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%"
borderBottom
required>
<u--input v-model="registerFormModel.confirmPassword"
- placeholder="璇疯緭鍏ュ唴瀹�"
+ placeholder="璇峰啀娆¤緭鍏ュ瘑鐮�"
+ password
+ clearable
+ @blur="jiaoYanPassword"></u--input>
+ </u-form-item>
+ <!-- 瀹㈡埛鐙湁鐨� 鏄惁绠＄悊鍛�-->
+
+ <u-form-item labelWidth="30%"
+ label="鏄惁绠＄悊鍛�"
+ borderBottom
+ prop="isHostUser"
+ v-if="radiovalue1 == '瀹㈡埛'"
+ ref="roleRef"
+ required>
+ <u-radio-group v-model="registerFormModel.isHostUser"
+ placement="row"
+ size="30"
+ shape="circle"
+ iconSize="20">
+ <u-radio labelSize="14px"
+ size="20px"
+ :key="0"
+ :label="'鏄�'"
+ :name="0"></u-radio>
+ <u-radio labelSize="14px"
+ size="20px"
+ :key="1"
+ :label="'鍚�'"
+ :name="1"></u-radio>
+ </u-radio-group>
+ </u-form-item>
+
+ <u-form-item prop="invitationCode"
+ label="閭�璇风爜"
+ v-if="radiovalue1 == '瀹㈡埛'"
+ labelWidth="20%"
+ borderBottom
+ required>
+ <u--input v-model="registerFormModel.invitationCode"
+ placeholder="璇疯緭鍏ラ個璇风爜"
password
clearable
@blur="jiaoYanPassword"></u--input>
@@ -159,7 +212,25 @@
:previewFullImage="true">
</u-upload>
</u-form-item>
- <u-form-item label="鏄惁闈炵叅杞﹁締"
+ <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
@@ -168,11 +239,28 @@
placement="row"
size="40"
@change="isNonCoalChange">
- <u-checkbox :label="registerFormModel.isNonCoal.length!==0?'鏄�':'鍚�'"
- name="鏄�"
+ <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>
@@ -207,7 +295,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: '',
@@ -219,21 +383,33 @@
openId: '',
type: 3,
idCard: '',
+ isHostUser:'',
carNo: '',
carImg: '',
drivingImg: '',
tuiJianMa: '',
+ invitationCode:'', //閭�璇风爜
confirmPassword: '',
tradeQualificationImg: '',
roadTransportImg: '',
isNonCoal: [],
- isCoalCar: 1 //鏄惁涓虹叅鐐溅杈�(鍙告満浣跨敤瀛楁) 1 鏄� 2 涓嶆槸
+ 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,
@@ -276,23 +452,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,
@@ -333,7 +502,7 @@
required: true,
message: '璇蜂笂浼犱粠涓氳祫鏍艰瘉鐓х墖',
trigger: ['blur', 'change']
- }
+ },
},
radiolist1: [{
name: '鍙告満',
@@ -342,6 +511,23 @@
{
name: '璐т唬',
disabled: false
+ },
+ {
+ name: '瀹㈡埛',
+ disabled: false
+ }
+ ],
+ countryNumberCarList: [{
+ name: 1,
+ label: '鍥戒簲',
+ },
+ {
+ name: 2,
+ label: '鍥藉叚',
+ },
+ {
+ name: 3,
+ label: '鏂拌兘婧�',
}
],
radiovalue1: '鍙告満',
@@ -372,6 +558,9 @@
case '鍙告満':
this.registerFormModel.type = 3;
break;
+ case '瀹㈡埛':
+ this.registerFormModel.type = 1;
+ break;
default:
break;
}
@@ -381,40 +570,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,'isHostUserisHostUser');
+ 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) {},
@@ -477,9 +662,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;
@@ -493,6 +675,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}`);
}
@@ -560,4 +746,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