|
@@ -25,18 +25,57 @@
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<u-popup v-model="show2" mode="bottom" border-radius="14" :closeable="true" >
|
|
<u-popup v-model="show2" mode="bottom" border-radius="14" :closeable="true" >
|
|
- <view class="QuickRegistrationPopup">
|
|
|
|
|
|
+ <view>
|
|
|
|
+ <ucarkeyboard ref="uKeyboard" mode="car"
|
|
|
|
+ style=" z-index: 999;" :style="!keyShow?'display: none':''"
|
|
|
|
+ :showTips="true" :confirmBtn="false"
|
|
|
|
+ :mask-close-able="false" :tooltip="false" v-model="keyShow" @change="valChange" @backspace="backspace">
|
|
|
|
+
|
|
|
|
+ <view class="ucarkeyboardView" >
|
|
|
|
+ <span >车牌号:{{form.carNumber}}</span>
|
|
|
|
+ <span @tap="keyShow=!keyShow" style="
|
|
|
|
+ float: right;
|
|
|
|
+ padding-right: 10px;
|
|
|
|
+ color: #41a863;
|
|
|
|
+ ">确定</span>
|
|
|
|
+ </view>
|
|
|
|
+ </ucarkeyboard>
|
|
|
|
+ <view class="QuickRegistrationPopup" >
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
<view class="popup1">快速注册</view>
|
|
<view class="popup1">快速注册</view>
|
|
<view class="popup2">欢迎来到优电联盟</view>
|
|
<view class="popup2">欢迎来到优电联盟</view>
|
|
- <view class="popup3"></view>
|
|
|
|
- <view class="popup4">未注册的手机号验证后将自动注册</view>
|
|
|
|
|
|
+
|
|
|
|
+ <view v-show="!keyShow">
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <view class="popup3" >
|
|
|
|
+ <view class="input">
|
|
|
|
+ <u-input :customStyle="customStyle" :clearable="false"
|
|
|
|
+
|
|
|
|
+ v-model="form.telephone" type="number" placeholder="请输入手机号"
|
|
|
|
+ placeholder-style="font-size:16px;color:#ccc;" />
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="popup4" >未注册的手机号验证后将自动注册</view>
|
|
<view class="popup5">验证码</view>
|
|
<view class="popup5">验证码</view>
|
|
- <view class="popup3"></view>
|
|
|
|
|
|
+ <view class="popup3">
|
|
|
|
+ <view class="input">
|
|
|
|
+ <u-input :customStyle="customStyle" :clearable="false"
|
|
|
|
+
|
|
|
|
+ v-model="form.verifyCode" type="number" placeholder="请输入验证码"
|
|
|
|
+ placeholder-style="font-size:16px;color:#ccc;" />
|
|
|
|
+ <view class="code" :style="isCodeTipsColor ? 'color: #999999;' : ''" @click="getCode">
|
|
|
|
+ {{codeTips}}</view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
<view class="popup5">车牌号码</view>
|
|
<view class="popup5">车牌号码</view>
|
|
<view class="popup6" @tap="keyShowBtn(true)" >
|
|
<view class="popup6" @tap="keyShowBtn(true)" >
|
|
<umessageInput :focus="true"
|
|
<umessageInput :focus="true"
|
|
@selectIndex="getSelectIndex"
|
|
@selectIndex="getSelectIndex"
|
|
- :value="form.carNum" :maxlength="maxlength" :disabled-keyboard="true"></umessageInput>
|
|
|
|
|
|
+ :value="form.carNumber" :maxlength="maxlength" :disabled-keyboard="true"></umessageInput>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
<view class="popup7">
|
|
<view class="popup7">
|
|
@@ -51,28 +90,18 @@
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="popup8">
|
|
<view class="popup8">
|
|
- <u-button class="success-btn" shape="circle" type="success" @click="rechargeNow"
|
|
|
|
- >
|
|
|
|
|
|
+ <u-button class="success-btn" shape="circle" type="success" @click="keepCar" >
|
|
完成
|
|
完成
|
|
</u-button>
|
|
</u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
- <ucarkeyboard ref="uKeyboard" mode="car"
|
|
|
|
- style=" z-index: 999;" :style="!keyShow?'display: none':''"
|
|
|
|
- :showTips="true" :confirmBtn="false" :mask-close-able="false" :tooltip="false" v-model="keyShow" @change="valChange" @backspace="backspace">
|
|
|
|
|
|
|
|
- <view style="
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 18px;
|
|
|
|
- ">
|
|
|
|
- <span style="color: #fff;">车牌号:{{form.carNum}}</span>
|
|
|
|
- <span @tap="keyShow=!keyShow" style="
|
|
|
|
- float: right;
|
|
|
|
- padding-right: 10px;
|
|
|
|
- color: #41a863;
|
|
|
|
- ">确定</span>
|
|
|
|
- </view>
|
|
|
|
- </ucarkeyboard>
|
|
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <u-verification-code :seconds="sendMsgSecond" ref="uCode" @change="codeChange" @end="end" @start="start"
|
|
|
|
+ change-text="已发送(Xs)">
|
|
|
|
+ </u-verification-code>
|
|
|
|
+ </view>
|
|
</u-popup>
|
|
</u-popup>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
@@ -80,53 +109,153 @@
|
|
<script>
|
|
<script>
|
|
import umessageInput from '@/components/UmessageInput.vue'
|
|
import umessageInput from '@/components/UmessageInput.vue'
|
|
import ucarkeyboard from '@/components/Ucarkeyboard.vue'
|
|
import ucarkeyboard from '@/components/Ucarkeyboard.vue'
|
|
-
|
|
|
|
|
|
+ import * as loginApi from '@/apis/login.js'
|
|
|
|
+ import {
|
|
|
|
+ checkPhone,newDate
|
|
|
|
+ } from '@/utils'
|
|
export default {
|
|
export default {
|
|
name:"QuickRegistration",
|
|
name:"QuickRegistration",
|
|
components: {
|
|
components: {
|
|
ucarkeyboard,umessageInput
|
|
ucarkeyboard,umessageInput
|
|
},
|
|
},
|
|
|
|
+ props:{
|
|
|
|
+ carNum:""
|
|
|
|
+ },
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ customStyle: {
|
|
|
|
+ 'font-size': '28rpx',
|
|
|
|
+ 'border-radius': '50px',
|
|
|
|
+ 'background-color': 'rgba(237, 240, 239, 1)',
|
|
|
|
+ 'text-align':'center'
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+
|
|
keyShow:false,
|
|
keyShow:false,
|
|
show1:true,
|
|
show1:true,
|
|
show2:false,
|
|
show2:false,
|
|
selectIndex:-1,
|
|
selectIndex:-1,
|
|
maxlength:8,
|
|
maxlength:8,
|
|
value:false,
|
|
value:false,
|
|
|
|
+ personInfo: null,
|
|
|
|
+ isSendMsgIng: false,
|
|
|
|
+ isCodeTipsColor: false,
|
|
|
|
+ sendMsgSecond: 60,
|
|
|
|
+ codeTips: '',
|
|
form: {
|
|
form: {
|
|
- carNum: '',
|
|
|
|
|
|
+ telephone: '',
|
|
|
|
+ verifyCode: '',
|
|
|
|
+ carNumber: '',
|
|
defaultFlag: true,
|
|
defaultFlag: true,
|
|
|
|
+
|
|
},
|
|
},
|
|
};
|
|
};
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ console.log("1")
|
|
|
|
+ this.form.carNumber=this.carNum
|
|
|
|
+ var personInfo = this.carhelp.getPersonInfo()
|
|
|
|
+ this.personInfo = personInfo
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+
|
|
},
|
|
},
|
|
methods:{
|
|
methods:{
|
|
|
|
+
|
|
|
|
+ codeChange(text) {
|
|
|
|
+ this.codeTips = text;
|
|
|
|
+ },
|
|
|
|
+ start() {
|
|
|
|
+ if (!this.isSendMsgIng) {
|
|
|
|
+ uni.showLoading({
|
|
|
|
+ title: "加载中",
|
|
|
|
+ mask: true,
|
|
|
|
+ })
|
|
|
|
+ loginApi.getVerifyCode(this.form.telephone).then((response) => {
|
|
|
|
+ uni.hideLoading();
|
|
|
|
+ this.carhelp.set("getvcodetime", new Date().getTime());
|
|
|
|
+
|
|
|
|
+ if (!"") {
|
|
|
|
+ //倒计时
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "发送成功"
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "您的验证码已经发送[5分钟有效],请勿重复点击"
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }).catch(error => {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: error,
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ //倒计时
|
|
|
|
+ end() {
|
|
|
|
+ this.sendMsgSecond = 60;
|
|
|
|
+ this.isSendMsgIng = false;
|
|
|
|
+ this.isCodeTipsColor = false;
|
|
|
|
+ },
|
|
|
|
+ // 获取验证码
|
|
|
|
+ getCode() {
|
|
|
|
+ if (this.$refs.uCode.canGetCode) {} else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: '倒计时结束后再发送',
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ var checkPhoneResult = checkPhone(this.form.telephone);
|
|
|
|
+
|
|
|
|
+ if (checkPhoneResult !== true) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: checkPhoneResult,
|
|
|
|
+ })
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ this.$refs.uCode.start();
|
|
|
|
+ this.isCodeTipsColor = true;
|
|
|
|
+ },
|
|
keyShowBtn(keyShow){
|
|
keyShowBtn(keyShow){
|
|
|
|
|
|
|
|
+ var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
|
|
+ console.log(aaa,this.form.carNumber.length)
|
|
|
|
+ if((this.form.carNumber.length == 0) && aaa) {
|
|
|
|
+ this.$refs.uKeyboard.changeCarInputMode();
|
|
|
|
+ }else if(!aaa&&(this.form.carNumber.length > 0)){
|
|
|
|
+ this.$refs.uKeyboard.changeCarInputMode();
|
|
|
|
+ }
|
|
|
|
+
|
|
this.keyShow=keyShow;
|
|
this.keyShow=keyShow;
|
|
},
|
|
},
|
|
checkboxChange() {
|
|
checkboxChange() {
|
|
this.value = !this.value;
|
|
this.value = !this.value;
|
|
},
|
|
},
|
|
getSelectIndex(i){
|
|
getSelectIndex(i){
|
|
- this.selectIndex=i;
|
|
|
|
- if(i==0){
|
|
|
|
- var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
|
|
|
|
+ // this.selectIndex=i;
|
|
|
|
+ // if(i==0){
|
|
|
|
+ // var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
|
|
|
|
- if( aaa) {
|
|
|
|
- this.$refs.uKeyboard.changeCarInputMode();
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+ // if( aaa) {
|
|
|
|
+ // this.$refs.uKeyboard.changeCarInputMode();
|
|
|
|
+ // }
|
|
|
|
+ // }
|
|
},
|
|
},
|
|
// 按键被点击(点击退格键不会触发此事件)
|
|
// 按键被点击(点击退格键不会触发此事件)
|
|
valChange(val) {
|
|
valChange(val) {
|
|
|
|
|
|
- if(this.form.carNum.length>=this.maxlength&&this.selectIndex==-1){
|
|
|
|
|
|
+ if(this.form.carNumber.length>=this.maxlength&&this.selectIndex==-1){
|
|
return
|
|
return
|
|
}
|
|
}
|
|
|
|
|
|
if(this.selectIndex==-1){
|
|
if(this.selectIndex==-1){
|
|
- this.form.carNum += val;
|
|
|
|
|
|
+ this.form.carNumber += val;
|
|
}else{
|
|
}else{
|
|
const replaceStr = (str, index, char) => {
|
|
const replaceStr = (str, index, char) => {
|
|
const strAry = str.split('');
|
|
const strAry = str.split('');
|
|
@@ -137,15 +266,15 @@
|
|
return strAry.join('');
|
|
return strAry.join('');
|
|
}
|
|
}
|
|
|
|
|
|
- this.form.carNum=replaceStr(this.form.carNum,this.selectIndex,val) ;
|
|
|
|
|
|
+ this.form.carNumber=replaceStr(this.form.carNumber,this.selectIndex,val) ;
|
|
this.selectIndex=-1;
|
|
this.selectIndex=-1;
|
|
}
|
|
}
|
|
- // 将每次按键的值拼接到form.carNum变量中,注意+=写法
|
|
|
|
|
|
+ // 将每次按键的值拼接到form.carNumber变量中,注意+=写法
|
|
|
|
|
|
- //(this.form.carNum);
|
|
|
|
|
|
+ //(this.form.carNumber);
|
|
|
|
|
|
var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
- if((this.form.carNum.length == 0) && aaa) {
|
|
|
|
|
|
+ if((this.form.carNumber.length == 0) && aaa) {
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
}else if(!aaa){
|
|
}else if(!aaa){
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
@@ -153,11 +282,11 @@
|
|
},
|
|
},
|
|
// 退格键被点击
|
|
// 退格键被点击
|
|
backspace() {
|
|
backspace() {
|
|
- // 删除form.carNum的最后一个字符
|
|
|
|
- if(this.form.carNum.length){
|
|
|
|
|
|
+ // 删除form.carNumber的最后一个字符
|
|
|
|
+ if(this.form.carNumber.length){
|
|
if(this.selectIndex==-1){
|
|
if(this.selectIndex==-1){
|
|
|
|
|
|
- this.form.carNum = this.form.carNum.substr(0, this.form.carNum.length - 1);
|
|
|
|
|
|
+ this.form.carNumber = this.form.carNumber.substr(0, this.form.carNumber.length - 1);
|
|
|
|
|
|
}else{
|
|
}else{
|
|
const replaceStr = (str, index, char) => {
|
|
const replaceStr = (str, index, char) => {
|
|
@@ -169,7 +298,7 @@
|
|
return strAry.join('');
|
|
return strAry.join('');
|
|
}
|
|
}
|
|
|
|
|
|
- this.form.carNum=replaceStr(this.form.carNum,this.selectIndex,'') ;
|
|
|
|
|
|
+ this.form.carNumber=replaceStr(this.form.carNumber,this.selectIndex,'') ;
|
|
|
|
|
|
//this.selectIndex=-1;
|
|
//this.selectIndex=-1;
|
|
}
|
|
}
|
|
@@ -178,16 +307,33 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
- //(this.form.carNum);
|
|
|
|
|
|
+ //(this.form.carNumber);
|
|
|
|
|
|
var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
var aaa = this.$refs.uKeyboard.changeCarInputValue();
|
|
- if(this.form.carNum.length == 0 && aaa) {
|
|
|
|
|
|
+ if(this.form.carNumber.length == 0 && aaa) {
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
this.$refs.uKeyboard.changeCarInputMode();
|
|
}
|
|
}
|
|
},
|
|
},
|
|
keepCar() {
|
|
keepCar() {
|
|
|
|
+
|
|
|
|
+ var checkPhoneResult = checkPhone(this.form.telephone);
|
|
|
|
+
|
|
|
|
+ if (!this.form.telephone || checkPhoneResult != true) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: checkPhoneResult,
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ if (!this.form.verifyCode) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: "请输入验证码",
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ return
|
|
|
|
+ }
|
|
//(this.form)
|
|
//(this.form)
|
|
- if(this.form.carNum.length != 8) {
|
|
|
|
|
|
+ if(this.form.carNumber.length != 8) {
|
|
uni.showToast({
|
|
uni.showToast({
|
|
title:"请填写新能源车牌"
|
|
title:"请填写新能源车牌"
|
|
})
|
|
})
|
|
@@ -196,13 +342,58 @@
|
|
|
|
|
|
if (!this.value) {
|
|
if (!this.value) {
|
|
uni.showToast({
|
|
uni.showToast({
|
|
- title: "请阅读并同意《个人信息处理授权书》"
|
|
|
|
|
|
+ title: "请勾选协议"
|
|
})
|
|
})
|
|
return
|
|
return
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+ //this.form.nickName= this.form.telephone;
|
|
|
|
+ if(this.carhelp.getUserInfo().nickname){
|
|
|
|
+ this.form.nickName = this.carhelp.getUserInfo().nickname;
|
|
|
|
+ this.form.headImg = this.carhelp.getUserInfo().headimgurl;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ this.form.openId = this.carhelp.getOpenId();
|
|
|
|
+ this.form.source = 2 //创建渠道1电单车2电车
|
|
|
|
+ uni.showLoading({
|
|
|
|
+ title: "加载中",
|
|
|
|
+ mask: true,
|
|
|
|
+ })
|
|
|
|
+ if (this.personInfo && this.personInfo.userType == "1") {
|
|
|
|
+
|
|
|
|
+ loginApi.validateGuestCode(this.form).then((response) => {
|
|
|
|
+ this.loginresponse(response, true)
|
|
|
|
+
|
|
|
|
+ }).catch(error => {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: error,
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ loginApi.validateCode(this.form).then((response) => {
|
|
|
|
+ this.loginresponse(response)
|
|
|
|
+
|
|
|
|
+ }).catch(error => {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: error,
|
|
|
|
+ icon: "none"
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
|
|
},
|
|
},
|
|
|
|
+ loginresponse(response, bl) {
|
|
|
|
+
|
|
|
|
+ var token = response ? response.data.token : '';
|
|
|
|
+ this.carhelp.setToken(token);
|
|
|
|
+ this.carhelp.setPersonInfo(response.data.regUser);
|
|
|
|
+ this.carhelp.setPersonInfoPlus(response.data);
|
|
|
|
+ this.show1=false
|
|
|
|
+ this.show2=false
|
|
|
|
+ uni.hideLoading()
|
|
|
|
+ this.$emit("login",this.form);
|
|
|
|
+ },
|
|
open(){
|
|
open(){
|
|
|
|
|
|
},
|
|
},
|
|
@@ -303,28 +494,47 @@
|
|
.popup2{
|
|
.popup2{
|
|
color: rgba(119, 119, 119, 1);
|
|
color: rgba(119, 119, 119, 1);
|
|
font-size: 36rpx;
|
|
font-size: 36rpx;
|
|
|
|
+ margin-bottom: 40rpx;
|
|
}
|
|
}
|
|
.popup3{
|
|
.popup3{
|
|
-
|
|
|
|
|
|
+ margin-bottom: 24rpx;
|
|
|
|
+ .input{
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ .code {
|
|
|
|
+
|
|
|
|
+ top: 7px;
|
|
|
|
+ color: rgb(63, 189, 112);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
.popup4{
|
|
.popup4{
|
|
|
|
+ margin-bottom: 40rpx;
|
|
color: rgba(102, 102, 102, 1);
|
|
color: rgba(102, 102, 102, 1);
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
.popup5{
|
|
.popup5{
|
|
|
|
+ margin-bottom: 16rpx;
|
|
color: rgba(16, 16, 16, 1);
|
|
color: rgba(16, 16, 16, 1);
|
|
font-size: 36rpx;
|
|
font-size: 36rpx;
|
|
font-weight: bold;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
.popup6{
|
|
.popup6{
|
|
-
|
|
|
|
|
|
+ margin-bottom: 40rpx;
|
|
}
|
|
}
|
|
.popup7{
|
|
.popup7{
|
|
-
|
|
|
|
|
|
+ margin-bottom: 40rpx;
|
|
}
|
|
}
|
|
.popup8{
|
|
.popup8{
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+ .ucarkeyboardView{
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: 40rpx;
|
|
|
|
+ height: 200rpx;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: flex-end;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ }
|
|
</style>
|
|
</style>
|