@@ -1,127 +1,134 @@ | |||
<!-- 注册第2步 --> | |||
<template> | |||
<u-form ref="myForm"> | |||
<view class="from"> | |||
<u-form-item prop="phone"> | |||
<view class="from_item" style="background-color: #f7f7f7"> | |||
<text><text style="color: red"></text>手机号:</text> | |||
<u-input v-model="phone" :disabled="true" class="input" /> | |||
</view> | |||
</u-form-item> | |||
<u-form-item prop="code"> | |||
<view class="from_item"> | |||
<text><text style="color: red"></text>验证码:</text> | |||
<u-input v-model="code" placeholder="请输入验证码" class="input" /> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
<u-form ref="myForm"> | |||
<view class="from"> | |||
<u-form-item prop="phone"> | |||
<view class="from_item" style="background-color: #f7f7f7"> | |||
<text><text style="color: red"></text>手机号:</text> | |||
<u-input v-model="phone" :disabled="true" class="input" /> | |||
</view> | |||
</u-form-item> | |||
<u-form-item prop="code"> | |||
<view class="from_item"> | |||
<text><text style="color: red"></text>验证码:</text> | |||
<u-input v-model="code" placeholder="请输入验证码" class="input" /> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
codeDuration === 0 ? "发送验证码" : "秒后可重发" | |||
}}</view> | |||
</view> | |||
</view> | |||
</u-form-item> | |||
</view> | |||
</u-form> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
</view> | |||
</view> | |||
</u-form-item> | |||
</view> | |||
</u-form> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
navTo(`/login/forget-pwd-step3?phone=${phone.value}&code=${code.value}`); | |||
}; | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
navTo(`/login/forget-pwd-step3?phone=${phone.value}&code=${code.value}`); | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> |
@@ -1,177 +1,163 @@ | |||
<!-- 注册第3步 --> | |||
<template> | |||
<view class="register-main"> | |||
<view class="title">重置密码</view> | |||
<view class="hint">重置之前的密码,设置新密码</view> | |||
<view class="hint1">请输入密码</view> | |||
<view class="form-input"> | |||
<input | |||
class="input" | |||
v-model="state.password" | |||
placeholder="请输入密码" | |||
placeholder-class="form-placeholder" | |||
:password="state.isPwdType ? true : false" | |||
type="text" | |||
/> | |||
<image | |||
:src="`${$imgUrl}login/${ | |||
<view class="register-main"> | |||
<view class="title">重置密码</view> | |||
<view class="hint">重置之前的密码,设置新密码</view> | |||
<view class="hint1">请输入密码</view> | |||
<view class="form-input"> | |||
<input class="input" v-model="state.password" placeholder="请输入密码" placeholder-class="form-placeholder" | |||
:password="state.isPwdType ? true : false" type="text" /> | |||
<image :src="`${$imgUrl}login/${ | |||
state.isPwdType ? 'icon_eye_close' : 'icon_eye_open' | |||
}.png`" | |||
class="eye" | |||
@click="state.isPwdType = !state.isPwdType" | |||
mode="aspectFill" | |||
></image> | |||
</view> | |||
<view class="hint2">请再次输入密码</view> | |||
<view class="form-input"> | |||
<input | |||
class="input" | |||
v-model="state.affirmPassword" | |||
placeholder="请再次输入密码" | |||
placeholder-class="form-placeholder" | |||
:password="state.isAffirmPwdType ? true : false" | |||
type="text" | |||
/> | |||
<image | |||
:src="`${$imgUrl}login/${ | |||
}.png`" class="eye" @click="state.isPwdType = !state.isPwdType" mode="aspectFill"></image> | |||
</view> | |||
<view class="hint2">请再次输入密码</view> | |||
<view class="form-input"> | |||
<input class="input" v-model="state.affirmPassword" placeholder="请再次输入密码" | |||
placeholder-class="form-placeholder" :password="state.isAffirmPwdType ? true : false" type="text" /> | |||
<image :src="`${$imgUrl}login/${ | |||
state.isAffirmPwdType ? 'icon_eye_close' : 'icon_eye_open' | |||
}.png`" | |||
class="eye" | |||
@click="state.isAffirmPwdType = !state.isAffirmPwdType" | |||
mode="aspectFill" | |||
></image> | |||
}.png`" class="eye" @click="state.isAffirmPwdType = !state.isAffirmPwdType" mode="aspectFill"></image> | |||
</view> | |||
<view class="hint4">{{ state.pwdHint }}</view> | |||
</view> | |||
<view class="hint4">{{ state.pwdHint }}</view> | |||
</view> | |||
<view class="btn"> | |||
<submit-button title="确认更改" @submit="doResetPwd"></submit-button> | |||
</view> | |||
<view class="btn"> | |||
<submit-button title="确认更改" @submit="doResetPwd"></submit-button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { msg, confirm, checkStr } from "@/utils/utils"; | |||
import { reactive } from "vue"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { request } from "@/utils/network/request"; | |||
import { resetPwd } from "@/utils/network/api"; | |||
const state = reactive({ | |||
isPwdType: true, | |||
isAffirmPwdType: true, | |||
password: "", //密码 | |||
affirmPassword:"",//再次输入密码 | |||
phone: "", //手机号 | |||
code: "", //验证码 | |||
pwdHint: "密码不少于8位,必须同时包含数字、大小写字母和特殊符号", | |||
}); | |||
onLoad((options) => { | |||
state.phone = options.phone; | |||
state.code = options.code; | |||
}); | |||
/* 忘记密码 */ | |||
const doResetPwd = () => { | |||
if (!state.password) { | |||
msg("请输入密码"); | |||
return; | |||
} | |||
if (!state.affirmPassword) { | |||
msg("请再次输入密码"); | |||
return; | |||
} | |||
if(state.password !== state.affirmPassword){ | |||
msg("两次密码输入不一致,请重新输入!"); | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { | |||
newPassword: state.password, | |||
affirmNewPassword:state.affirmPassword, | |||
mobile: state.phone, | |||
code: state.code, | |||
}, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(resetPwd, options).then((res) => { | |||
confirm( | |||
"密码重置成功,请登录!", | |||
() => { | |||
uni.$emit("login", { phone: state.phone }); | |||
uni.navigateBack({ delta: 3 }); | |||
}, | |||
"提示", | |||
false | |||
); | |||
}); | |||
}; | |||
import { msg, confirm, checkStr } from "@/utils/utils"; | |||
import { reactive } from "vue"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { request } from "@/utils/network/request"; | |||
import { resetPwd } from "@/utils/network/api"; | |||
const state = reactive({ | |||
isPwdType: true, | |||
isAffirmPwdType: true, | |||
password: "", //密码 | |||
affirmPassword: "",//再次输入密码 | |||
phone: "", //手机号 | |||
code: "", //验证码 | |||
pwdHint: "密码不少于10位,必须同时包含数字、大小写字母和特殊符号", | |||
}); | |||
onLoad((options) => { | |||
state.phone = options.phone; | |||
state.code = options.code; | |||
}); | |||
/* 忘记密码 */ | |||
const doResetPwd = () => { | |||
if (!state.password) { | |||
msg("请输入密码"); | |||
return; | |||
} | |||
if (!state.affirmPassword) { | |||
msg("请再次输入密码"); | |||
return; | |||
} | |||
if (state.password !== state.affirmPassword) { | |||
msg("两次密码输入不一致,请重新输入!"); | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { | |||
newPassword: state.password, | |||
affirmNewPassword: state.affirmPassword, | |||
mobile: state.phone, | |||
code: state.code, | |||
}, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(resetPwd, options).then((res) => { | |||
confirm( | |||
"密码重置成功,请登录!", | |||
() => { | |||
uni.$emit("login", { phone: state.phone }); | |||
uni.navigateBack({ delta: 3 }); | |||
}, | |||
"提示", | |||
false | |||
); | |||
}); | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
.hint1 { | |||
color: #333333; | |||
font-size: 28rpx; | |||
margin-top: 100rpx; | |||
font-weight: 600; | |||
} | |||
.hint2{ | |||
color: #333333; | |||
font-size: 28rpx; | |||
margin-top: 50rpx; | |||
font-weight: 600; | |||
} | |||
.hint4 { | |||
margin-top: 30rpx; | |||
font-size: 26rpx; | |||
color: #00b38b; | |||
} | |||
} | |||
.form-input { | |||
display: flex; | |||
flex-direction: row; | |||
align-items: center; | |||
height: 90rpx; | |||
margin-top: 30rpx; | |||
border-bottom: 1rpx solid #dcdcdc; | |||
color: #333333; | |||
.input { | |||
flex: 1; | |||
padding-right: 48rpx; | |||
font-size: 26rpx; | |||
background: transparent; | |||
} | |||
.eye { | |||
width: 48rpx; | |||
height: 48rpx; | |||
} | |||
} | |||
.form-placeholder { | |||
color: #999999; | |||
} | |||
.btn { | |||
margin: 150rpx 40rpx 0px; | |||
} | |||
</style> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
.hint1 { | |||
color: #333333; | |||
font-size: 28rpx; | |||
margin-top: 100rpx; | |||
font-weight: 600; | |||
} | |||
.hint2 { | |||
color: #333333; | |||
font-size: 28rpx; | |||
margin-top: 50rpx; | |||
font-weight: 600; | |||
} | |||
.hint4 { | |||
margin-top: 30rpx; | |||
font-size: 26rpx; | |||
color: #00b38b; | |||
} | |||
} | |||
.form-input { | |||
display: flex; | |||
flex-direction: row; | |||
align-items: center; | |||
height: 90rpx; | |||
margin-top: 30rpx; | |||
border-bottom: 1rpx solid #dcdcdc; | |||
color: #333333; | |||
.input { | |||
flex: 1; | |||
padding-right: 48rpx; | |||
font-size: 26rpx; | |||
background: transparent; | |||
} | |||
.eye { | |||
width: 48rpx; | |||
height: 48rpx; | |||
} | |||
} | |||
.form-placeholder { | |||
color: #999999; | |||
} | |||
.btn { | |||
margin: 150rpx 40rpx 0px; | |||
} | |||
</style> |
@@ -1,137 +1,142 @@ | |||
<!-- 注册第2步 --> | |||
<template> | |||
<u-form ref="myForm"> | |||
<view class="from"> | |||
<u-form-item prop="phone"> | |||
<view class="from_item" style="background-color: #f7f7f7"> | |||
<text><text style="color: red"></text>手机号:</text> | |||
<u-input v-model="phone" :disabled="true" class="input" /> | |||
</view> | |||
</u-form-item> | |||
<u-form-item prop="code"> | |||
<view class="from_item"> | |||
<text><text style="color: red"></text>验证码:</text> | |||
<u-input v-model="code" placeholder="请输入验证码" class="input" /> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
<u-form ref="myForm"> | |||
<view class="from"> | |||
<u-form-item prop="phone"> | |||
<view class="from_item" style="background-color: #f7f7f7"> | |||
<text><text style="color: red"></text>手机号:</text> | |||
<u-input v-model="phone" :disabled="true" class="input" /> | |||
</view> | |||
</u-form-item> | |||
<u-form-item prop="code"> | |||
<view class="from_item"> | |||
<text><text style="color: red"></text>验证码:</text> | |||
<u-input v-model="code" placeholder="请输入验证码" class="input" /> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
codeDuration === 0 ? "发送验证码" : "秒后可重发" | |||
}}</view> | |||
</view> | |||
</view> | |||
</u-form-item> | |||
</view> | |||
</u-form> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
</view> | |||
</view> | |||
</u-form-item> | |||
</view> | |||
</u-form> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
//TODO 目前后端规定验证码只能是123456,所以目前写死 | |||
navTo(`/login/register-step3?phone=${phone.value}&code=${code.value}`); | |||
// navTo(`/login/register-step3?phone=${phone.value}&code=123456`); | |||
}; | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
navTo(`/login/register-step3?phone=${phone.value}&code=${code.value}`); | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
background: transparent !important; | |||
} | |||
::v-deep .flex-box .hide-input{ | |||
background: transparent !important; | |||
} | |||
::v-deep .code-box{ | |||
background: transparent !important; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
background: transparent !important; | |||
} | |||
::v-deep .flex-box .hide-input { | |||
background: transparent !important; | |||
} | |||
::v-deep .code-box { | |||
background: transparent !important; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> |
@@ -1,128 +1,133 @@ | |||
<!-- 注册第2步 --> | |||
<template> | |||
<view class="register-main"> | |||
<view class="title">请输入验证码</view> | |||
<view class="hint">验证码已发送至:{{ phone }}</view> | |||
<view class="input-code"> | |||
<verification-code-input v-model="code" ></verification-code-input> | |||
</view> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
<view class="register-main"> | |||
<view class="title">请输入验证码</view> | |||
<view class="hint">验证码已发送至:{{ phone }}</view> | |||
<view class="input-code"> | |||
<verification-code-input v-model="code"></verification-code-input> | |||
</view> | |||
<view class="hint2"> | |||
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view> | |||
<view class="grey" @click="sendRegisterCode">{{ | |||
codeDuration === 0 ? "重新发送验证码" : "秒后可重新发送验证码" | |||
}}</view> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
<view class="btn"> | |||
<submit-button title="下一步" @submit="nextStep"></submit-button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
//TODO 目前后端规定验证码只能是123456,所以目前写死 | |||
navTo(`/login/register-step3?phone=${phone.value}&code=${code.value}`); | |||
// navTo(`/login/register-step3?phone=${phone.value}&code=123456`); | |||
}; | |||
import { msg, navTo } from "@/utils/utils"; | |||
import { onLoad } from "@dcloudio/uni-app"; | |||
import { ref } from "vue"; | |||
import { request } from "@/utils/network/request"; | |||
import { sendCode } from "@/utils/network/api.js"; | |||
//上个界面传递的电话号码 | |||
const phone = ref(""); | |||
const code = ref(null); | |||
//倒计时时常 | |||
const codeDuration = ref(0); | |||
let interval = null; | |||
onLoad((options) => { | |||
phone.value = options.phone; | |||
codeInterval(); | |||
}); | |||
/* 验证码倒计时 */ | |||
const codeInterval = () => { | |||
codeDuration.value = 60; | |||
interval = setInterval(() => { | |||
codeDuration.value--; | |||
if (codeDuration.value === 0) { | |||
if (interval) { | |||
clearInterval(interval); | |||
interval = null; | |||
} | |||
} | |||
}, 1000); | |||
}; | |||
/* 发送验证码 */ | |||
const sendRegisterCode = () => { | |||
if (codeDuration.value !== 0) { | |||
return; | |||
} | |||
const options = { | |||
type: 2, | |||
data: { mobile: phone.value }, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options).then((res) => { | |||
msg("验证码发送成功!"); | |||
codeInterval(); | |||
}); | |||
}; | |||
/* 下一步 */ | |||
const nextStep = () => { | |||
if (!code.value) { | |||
msg("请先输入验证码!"); | |||
return; | |||
} | |||
navTo(`/login/register-step3?phone=${phone.value}&code=${code.value}`); | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
background: transparent !important; | |||
} | |||
::v-deep .flex-box .hide-input{ | |||
background: transparent !important; | |||
} | |||
::v-deep .code-box{ | |||
background: transparent !important; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> | |||
.register-main { | |||
border-top: 1rpx solid #dcdcdc; | |||
padding: 78rpx 30rpx 50rpx; | |||
.title { | |||
font-size: 32rpx; | |||
color: #333333; | |||
font-weight: 600; | |||
} | |||
.hint { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-top: 20rpx; | |||
} | |||
} | |||
.input-code { | |||
margin: 100rpx -10rpx 0px; | |||
background: transparent !important; | |||
} | |||
::v-deep .flex-box .hide-input { | |||
background: transparent !important; | |||
} | |||
::v-deep .code-box { | |||
background: transparent !important; | |||
} | |||
.hint2 { | |||
margin-top: 40rpx; | |||
display: flex; | |||
.green { | |||
font-size: 28rpx; | |||
color: #00b38b; | |||
} | |||
.grey { | |||
font-size: 24rpx; | |||
color: #999999; | |||
margin-left: 16rpx; | |||
} | |||
} | |||
.btn { | |||
margin: 200rpx 40rpx 0px; | |||
} | |||
</style> |
@@ -114,6 +114,7 @@ | |||
const tools = require("../../../static/etcUtil/tools.js"); | |||
const bluetoothUtil = require("../../../static/etcUtil/index.js"); | |||
const state = reactive({ | |||
id: "", | |||
showPopup: false, | |||
flag: false | |||
}) | |||
@@ -136,10 +137,12 @@ | |||
onLoad((option) => { | |||
//请求订单详情 | |||
queryOrderDetail(option.id); | |||
state.id = option.id | |||
queryOrderDetail(state.id); | |||
}); | |||
onShow((option) => { | |||
uni.$on('bluetoothLink', res => { | |||
console.log(res); | |||
if (res.status) { | |||
@@ -292,6 +295,7 @@ | |||
const cancel = () => { | |||
state.flag = true; | |||
state.showPopup = false; | |||
queryOrderDetail(state.id); | |||
} | |||
</script> | |||
@@ -53,7 +53,7 @@ | |||
<script setup lang="ts"> | |||
import { onLoad, onPageScroll } from "@dcloudio/uni-app"; | |||
import { reactive, ref } from "vue"; | |||
import { etcQueryProduct, productReCode } from "@/utils/network/api.js"; | |||
import { etcQueryProduct } from "@/utils/network/api.js"; | |||
import { request } from "@/utils/network/request.js"; | |||
import { stringToJson } from "@/utils/network/encryption"; | |||
import { fileURL } from "@/datas/fileURL.js"; | |||
@@ -164,27 +164,6 @@ | |||
scrollTop.value = e.scrollTop; | |||
}); | |||
const productReCodeAction = (id) => { | |||
var data = { | |||
productId: id, | |||
orderId: state.orderId, | |||
}; | |||
const options = { | |||
type: 2, | |||
data: data, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(productReCode, options); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
}; | |||
const state = reactive({ | |||
applyId: "", | |||
isValueCard: 1, //卡的类型 |
@@ -52,7 +52,7 @@ | |||
<script setup lang="ts"> | |||
import { onLoad, onPageScroll, onShow } from "@dcloudio/uni-app"; | |||
import { reactive, ref } from "vue"; | |||
import { etcQueryProduct, productReCode } from "@/utils/network/api.js"; | |||
import { etcQueryProduct } from "@/utils/network/api.js"; | |||
import { request } from "@/utils/network/request.js"; | |||
import { stringToJson } from "@/utils/network/encryption"; | |||
import { fileURL } from "@/datas/fileURL.js"; | |||
@@ -182,27 +182,6 @@ | |||
scrollTop.value = e.scrollTop; | |||
}); | |||
const productReCodeAction = (id) => { | |||
var data = { | |||
productId: id, | |||
orderId: state.orderId, | |||
}; | |||
const options = { | |||
type: 2, | |||
data: data, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(productReCode, options); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
}; | |||
const state = reactive({ | |||
isValueCard: 1, //卡的类型 | |||
radiolist1: [], //选择卡的数据列表 |
@@ -480,7 +480,8 @@ | |||
var data = { | |||
promoteId: state.data.promoteId, | |||
orderId: orderId, | |||
isValueCard: state.isValueCard | |||
isValueCard: state.isValueCard, | |||
loginSource: getItem("loginSource") | |||
}; | |||
const options = { | |||
type: 2, |
@@ -386,26 +386,7 @@ | |||
scrollTop.value = e.scrollTop; | |||
}); | |||
const productReCodeAction = (id) => { | |||
var data = { | |||
productId: id, | |||
orderId: state.orderId, | |||
}; | |||
const options = { | |||
type: 2, | |||
data: data, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(productReCode, options); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
}; | |||
const gotoEditUserOrUnitInfo = () => { | |||
if (state.isValueCard == 1) { | |||
uni.switchTab({ |