From 05273ace3da665cb10c36ca0dac4413a8284302a Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期三, 17 五月 2023 18:10:36 +0800 Subject: [PATCH] 增加部分限制,增加新功能 --- pages/register/register.vue | 269 ++++++++++++++++++++++++++++++++--------------------- 1 files changed, 164 insertions(+), 105 deletions(-) diff --git a/pages/register/register.vue b/pages/register/register.vue index 0f1fb88..c901a7b 100644 --- a/pages/register/register.vue +++ b/pages/register/register.vue @@ -1,6 +1,5 @@ <template> <view class="register"> - <!-- <home-species title="娉ㄥ唽"></home-species> --> <view class="registerForm"> <u--form :rules="rules" :model="registerFormModel" ref="regesterFormRef"> <u-form-item labelWidth="20%" label="閫夋嫨韬唤" borderBottom ref="roleRef" required> @@ -18,49 +17,79 @@ </u-radio-group> </u-form-item> <u-form-item prop="name" label="濮撳悕" labelWidth="20%" borderBottom required> - <u--input v-model="registerFormModel.name" placeholder="璇疯緭鍏ュ唴瀹�"></u--input> + <u--input v-model="registerFormModel.name" placeholder="璇疯緭鍏ュ唴瀹�" clearable></u--input> </u-form-item> <u-form-item prop="idCard" label="韬唤璇�" labelWidth="20%" borderBottom required> - <u--input v-model="registerFormModel.idCard" placeholder="璇疯緭鍏ュ唴瀹�"></u--input> + <u--input v-model="registerFormModel.idCard" placeholder="璇疯緭鍏ュ唴瀹�" clearable></u--input> </u-form-item> <u-form-item prop="phone" label="鎵嬫満鍙�" labelWidth="20%" borderBottom required> - <u--input v-model="registerFormModel.phone" placeholder="璇疯緭鍏ュ唴瀹�"></u--input> + <u--input v-model="registerFormModel.phone" placeholder="璇疯緭鍏ュ唴瀹�" clearable></u--input> </u-form-item> <u-form-item prop="password" label="瀵嗙爜" labelWidth="20%" borderBottom required> - <u--input v-model="registerFormModel.password" placeholder="璇疯緭鍏ュ唴瀹�"></u--input> + <u--input v-model="registerFormModel.password" placeholder="璇疯緭鍏ュ唴瀹�" password clearable></u--input> + </u-form-item> + <u-form-item prop="confirmPassword" label="纭瀵嗙爜" labelWidth="20%" borderBottom required> + <u--input v-model="registerFormModel.confirmPassword" placeholder="璇疯緭鍏ュ唴瀹�" password clearable @blur="jiaoYanPassword"></u--input> </u-form-item> <u-form-item prop="carNo" label="杞︾墝鍙�" labelWidth="20%" borderBottom v-if="radiovalue1 == '鍙告満'" required> - <u--input v-model="registerFormModel.carNo" placeholder="璇疯緭鍏ュ唴瀹�"></u--input> + <u--input v-model="registerFormModel.carNo" placeholder="璇疯緭鍏ュ唴瀹�" clearable></u--input> </u-form-item> - <u-form-item prop="carPhoto" label="杞﹁締鐓х墖" labelWidth="20%" borderBottom v-if="radiovalue1 == '鍙告満'" required> - <u-upload :fileList="fileList6" @afterRead="afterRead" @delete="deletePic" name="6" multiple :maxCount="1" width="250" height="150"> + <u-form-item prop="carImg" label="杞﹁締鐓х墖" labelWidth="20%" borderBottom v-if="radiovalue1 == '鍙告満'" required @click="beforeRead"> + <u-upload + :fileList="fileList1" + deletable + @afterRead="afterRead" + @delete="deletePic" + name="1" + multiple + :maxCount="1" + width="250" + height="150" + :previewFullImage="true" + > <!-- <image src="https://cdn.uviewui.com/uview/demo/upload/positive.png" mode="widthFix" style="width: 250px;height: 150px;"></image> --> </u-upload> </u-form-item> - <u-form-item prop="drivingLicense" label="琛岄┒璇�" labelWidth="20%" borderBottom v-if="radiovalue1 == '鍙告満'" required> - <u-upload :fileList="fileList5" @afterRead="afterRead" @delete="deletePic" name="5" multiple :maxCount="1" width="250" height="150"> + <u-form-item prop="drivingImg" label="琛岄┒璇�" labelWidth="20%" borderBottom v-if="radiovalue1 == '鍙告満'" required @click="beforeRead"> + <u-upload + :fileList="fileList2" + deletable + @afterRead="afterRead" + @delete="deletePic" + name="2" + multiple + :maxCount="1" + width="250" + height="150" + :previewFullImage="true" + > <!-- <image src="https://cdn.uviewui.com/uview/demo/upload/positive.png" mode="widthFix" style="width: 250px;height: 150px;"></image> --> </u-upload> </u-form-item> - <u-form-item label="鎺ㄨ崘浜鸿处鍙�" labelWidth="25%" borderBottom ><u--input v-model="registerFormModel.tuiJianMa" placeholder="璇疯緭鍏ュ唴瀹�"></u--input></u-form-item> + <u-form-item label="鎺ㄨ崘浜鸿处鍙�" labelWidth="25%" borderBottom> + <u--input v-model="registerFormModel.tuiJianMa" placeholder="璇疯緭鍏ュ唴瀹�" clearable></u--input> + </u-form-item> </u--form> </view> <view class="roleModel"> <u-modal :show="editRoleModelShow" :title="title" :content="content" :showCancelButton="true" @confirm="roleConfirm" @cancel="roleCancel"></u-modal> </view> <view class="registerBtn"><u-button text="娉ㄥ唽" type="primary" @click="registerClick"></u-button></view> - - <!-- <view class="utils"> - <text @click="callingIn">鎵撶數璇�</text> + <!-- 鍥剧墖棰勮寮瑰嚭妗� --> + <!-- <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> <script> -// import HomeSpecies from '@/components/home-species/HomeSpecies.vue'; import { apiRegister } from '@/api/publicInterface.js'; +import { BaseUrl } from '@/api/publicInterface.js'; +import { mapMutations } from 'vuex'; export default { // onLoad: function() { // // 鏌ョ湅鏄惁鎺堟潈 @@ -77,12 +106,9 @@ // } // }) // }, - components: { - // HomeSpecies - }, // 鐩戝惉椤甸潰鍒濇娓叉煋瀹屾垚銆傛敞鎰忓鏋滄覆鏌撻�熷害蹇紝浼氬湪椤甸潰杩涘叆鍔ㄧ敾瀹屾垚鍓嶈Е鍙� onReady() { - // this.$refs.regesterFormRef.setRules(this.rules); + this.$refs.regesterFormRef.setRules(this.rules); // this.$refs.regesterFormRef.validate().then(res => {}).catch(err => { // console.log(err); // }) @@ -95,19 +121,25 @@ }, data() { return { + // 杞︾墝鍙烽敭鐩樻帶鍒� + carNumShow: false, + keyValue: '', registerFormModel: { phone: '', password: '', name: '', - username:'', + username: '', openId: '', type: 2, idCard: '', carNo: '', carImg: '', drivingImg: '', - tuiJianMa: '' + tuiJianMa: '', + confirmPassword: '' }, + fileList1: [], + fileList2: [], rules: { name: { type: 'string', @@ -115,16 +147,22 @@ message: '璇峰~鍐欏鍚�', trigger: ['blur', 'change'] }, - idCard: { - type: 'string', - required: true, - message: '璇疯緭鍏ヨ韩浠借瘉鍙�', - trigger: ['blur', 'change'] - }, + idCard: [ + { + type: 'string', + required: true, + message: '璇疯緭鍏ヨ韩浠借瘉鍙�', + trigger: ['blur', 'change'] + }, + { + pattern: /^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, + message: '韬唤璇佸彿鏍煎紡涓嶆纭�' + } + ], phone: [ { required: true, - message: '姝や负蹇呭~瀛楁', + message: '姝ら」涓哄繀濉」', // blur鍜宑hange浜嬩欢瑙﹀彂妫�楠� trigger: ['blur', 'change'] }, @@ -132,6 +170,13 @@ min: 11, max: 11, message: '璇疯緭鍏ュ悎娉曟墜鏈哄彿' + }, + { + validator: (rule, value, callback) => { + return uni.$u.test.mobile(value); + }, + message: '鎵嬫満鍙风爜涓嶆纭�', + trigger: ['change', 'blur'] } ], password: [ @@ -142,8 +187,20 @@ }, { min: 6, - max: 8, - message: '闀垮害鍦�6-8涓瓧绗︿箣闂�' + max: 12, + message: '闀垮害鍦�6-12涓瓧绗︿箣闂�' + } + ], + confirmPassword: [ + { + required: true, + message: '璇疯缃垵濮嬪瘑鐮�', + trigger: ['blur', 'change'] + }, + { + min: 6, + max: 12, + message: '闀垮害鍦�6-12涓瓧绗︿箣闂�' } ], carNo: [ @@ -152,20 +209,30 @@ required: true, message: '璇疯緭鍏ヨ溅鐗屽彿', trigger: ['blur', 'change'] + }, + { + transform(value) { + return String(value); + }, + validator: (rule, value, callback) => { + return uni.$u.test.carNo(value); + }, + message: '璇疯緭鍏ユ纭殑杞︾墝鍙�', + trigger: ['change', 'blur'] } ], - // carPhoto: { - // type: 'string', - // required: true, - // message: '璇蜂笂浼犺溅杈嗗浘鐗�', - // trigger: ['blur', 'change'] - // }, - // drivingLicense: { - // type: 'string', - // required: true, - // message: '璇蜂笂浼犺椹惰瘉鐓х墖', - // trigger: ['blur', 'change'] - // } + carImg: { + type: 'string', + required: true, + message: '璇蜂笂浼犺溅杈嗗浘鐗�', + trigger: ['blur', 'change'] + }, + drivingImg: { + type: 'string', + required: true, + message: '璇蜂笂浼犺椹惰瘉鐓х墖', + trigger: ['blur', 'change'] + } }, // 鍩烘湰妗堝垪鏁版嵁 radiolist1: [ @@ -181,8 +248,6 @@ // u-radio-group鐨剉-model缁戝畾鐨勫�煎鏋滆缃负鏌愪釜radio鐨刵ame锛屽氨浼氳榛樿閫変腑 radiovalue1: '璐т唬', beforeChangeValue: '', - fileList5: [], - fileList6: [], // 鏇存崲瑙掕壊寮规 editRoleModelShow: false, title: '鎻愮ず', @@ -214,49 +279,44 @@ } }, methods: { + ...mapMutations(['changeisUploadimg']), registerClick() { - this.$refs.regesterFormRef - .validate() - .then(res => { - console.log(this.registerFormModel); - this.registerFormModel.username = this.registerFormModel.name - apiRegister(this.registerFormModel) - .then(res => { - console.log(res); - 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) - } - }) - .catch(err => { - console.log('閿欒', err); - }); - }) - .catch(err => { - console.log('err', err); - uni.$u.toast('鏁堥獙澶辫触'); - }); + if (this.registerFormModel.password == this.registerFormModel.confirmPassword) { + this.$refs.regesterFormRef + .validate() + .then(res => { + console.log(this.registerFormModel); + this.registerFormModel.username = this.registerFormModel.phone; + apiRegister(this.registerFormModel) + .then(res => { + 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.msg ? res.msg : '娣诲姞澶辫触'); + } + }) + .catch(err => { + console.log('閿欒', err); + }); + }) + .catch(err => { + console.log('err', err); + this.$u.toast('璇疯鑼冭緭鍏ュ唴瀹�'); + }); + } else { + this.$u.toast('涓ゆ瀵嗙爜涓嶄竴鑷�'); + } }, - // 闊宠棰戦�氳瘽 - // callingIn() { - // uni.navigateTo({ - // url: '/pages/calling-index/calling-index' - // }); - // }, // 鍗曢�夋浜嬩欢 - groupChange(e) { - console.log('鍗曢�夋灏忕粍', e); - }, + groupChange(e) {}, radioChange(e) { - console.log('鍗曢�夋', e); if ( this.registerFormModel.name == '' && this.registerFormModel.idCard == '' && @@ -264,19 +324,26 @@ this.registerFormModel.carNo == '' && this.registerFormModel.password == '' ) { - console.log('鍙樹簡'); this.$refs.regesterFormRef.clearValidate(); this.beforeChangeValue = e; } }, + jiaoYanPassword() { + if (this.registerFormModel.password != this.registerFormModel.confirmPassword) { + this.$u.toast('涓ゆ瀵嗙爜涓嶄竴鑷�'); + } + }, // 涓婁紶鍥剧墖鏂规硶 + beforeRead() { + this.changeisUploadimg(true); + }, // 鍒犻櫎鍥剧墖 deletePic(event) { + this.changeisUploadimg(true); this[`fileList${event.name}`].splice(event.index, 1); }, // 鏂板鍥剧墖 async afterRead(event) { - console.log('event', event); // 褰撹缃� mutiple 涓� true 鏃�, file 涓烘暟缁勬牸寮忥紝鍚﹀垯涓哄璞℃牸寮� let lists = [].concat(event.file); let fileListLen = this[`fileList${event.name}`].length; @@ -288,33 +355,37 @@ }); }); for (let i = 0; i < lists.length; i++) { - const result = await this.uploadFilePromise(lists[i].url); + const result = await this.uploadFilePromise(lists[i].url, event.name); let item = this[`fileList${event.name}`][fileListLen]; this[`fileList${event.name}`].splice( fileListLen, 1, Object.assign(item, { status: 'success', - message: '', + message: '涓婁紶鎴愬姛', url: result }) ); fileListLen++; } }, - uploadFilePromise(url) { + uploadFilePromise(url, num) { return new Promise((resolve, reject) => { let a = uni.uploadFile({ - url: 'http://192.168.2.21:7001/upload', // 浠呬负绀轰緥锛岄潪鐪熷疄鐨勬帴鍙e湴鍧� + url: BaseUrl + '/admin/sys-file/uploadUnToken', filePath: url, name: 'file', formData: { - user: 'test' + // user: '' }, success: res => { - setTimeout(() => { - resolve(res.data.data); - }, 1000); + if (num == 1) { + this.registerFormModel.carImg = JSON.parse(res.data).data.url; + resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); + } else if (num == 2) { + this.registerFormModel.drivingImg = JSON.parse(res.data).data.url; + resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`); + } } }); }); @@ -331,7 +402,6 @@ * @resetFields 涓嶇鐢ㄦ椂鍊欑敤涓婅竟鐨勪唬鏇� */ this.$refs.regesterFormRef.resetFields(); - this.editRoleModelShow = false; }, roleCancel() { @@ -339,17 +409,6 @@ this.$nextTick(() => { this.editRoleModelShow = false; }); - // switch (this.radiovalue1) { - // case '瀹㈡埛': - // this.radiovalue1 = ''; - // break; - // case '璐т唬': - // this.radiovalue1 = '鍙告満'; - // break; - // case '鍙告満': - // this.radiovalue1 = '璐т唬'; - // break; - // } } } }; -- Gitblit v1.9.1