chenkainan
1 year ago
11 changed files with 366 additions and 87 deletions
@ -0,0 +1,164 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<view class="input-box"> |
||||
|
<span>手机号:</span> |
||||
|
<input type="number" v-model="mobile" placeholder="请输入新手机号" maxlength="11" /> |
||||
|
</view> |
||||
|
<view class="input-box"> |
||||
|
<span>验证码:</span> |
||||
|
<input type="number" v-model="code" placeholder="请输入短信验证码" maxlength="6" /> |
||||
|
<view class="btn" @click="getCode">{{text}}</view> |
||||
|
</view> |
||||
|
<view class="btn bottom-btn" @click="save">保存</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "BindTel", |
||||
|
data: function() { |
||||
|
return { |
||||
|
mobile: '', |
||||
|
code: '', |
||||
|
sendFlag: true, |
||||
|
timer: null, |
||||
|
text: "获取验证码" |
||||
|
} |
||||
|
}, |
||||
|
mounted: function() { |
||||
|
// this.wxShare(); |
||||
|
}, |
||||
|
methods: { |
||||
|
save: function() { |
||||
|
if (!this.mobile || !this.IsTel(this.mobile)) { |
||||
|
uni.showToast({ |
||||
|
title: "请输入正确的手机号码", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
if (!this.code) { |
||||
|
uni.showToast({ |
||||
|
title: "请输入验证码", |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
this.Post({ |
||||
|
code: this.code, |
||||
|
mobile: this.mobile |
||||
|
}, '/api/user/bindMobileCode').then(res => { |
||||
|
if (res.code == 1) { |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: '保存成功！', |
||||
|
success: res => { |
||||
|
if (res.confirm) { |
||||
|
this.goBack() |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
}).catch(err => { |
||||
|
console.log('err:', err) |
||||
|
}) |
||||
|
}, |
||||
|
getCode: function() { |
||||
|
if (!this.sendFlag) return; |
||||
|
if (!this.mobile || !this.IsTel(this.mobile)) { |
||||
|
uni.showToast({ |
||||
|
title: '请输入正确的手机号码', |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
this.sendFlag = false; |
||||
|
this.Post({ |
||||
|
mobile: this.mobile |
||||
|
}, '/api/user/bindMobileSendMsm').then(res => { |
||||
|
if (res.code == 1) { |
||||
|
// 发送成功 |
||||
|
this.text = "发送成功"; |
||||
|
let time = 60; |
||||
|
// 需要倒计时 |
||||
|
this.timer = setInterval(() => { |
||||
|
time--; |
||||
|
this.text = time + "s后重新获取"; |
||||
|
if (time == 0) { |
||||
|
clearInterval(this.timer); |
||||
|
this.timer = null; |
||||
|
this.text = "重新发送"; |
||||
|
this.sendFlag = true; |
||||
|
} |
||||
|
}, 1000); |
||||
|
} else { |
||||
|
this.text = "重新发送"; |
||||
|
this.sendFlag = true; |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.bg { |
||||
|
min-height: 100vh; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.input-box { |
||||
|
font-size: 32rpx; |
||||
|
margin: 0 30rpx; |
||||
|
height: 124rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
border-bottom: 1rpx solid #CECECE; |
||||
|
} |
||||
|
|
||||
|
.input-box span { |
||||
|
margin-right: 20rpx; |
||||
|
flex-shrink: 0; |
||||
|
white-space: normal; |
||||
|
} |
||||
|
|
||||
|
.input-box input { |
||||
|
flex: 1; |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
font-size: 32rpx; |
||||
|
margin-right: 10rpx; |
||||
|
min-width: 100rpx; |
||||
|
text-align: left; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
color: black; |
||||
|
width: 200rpx; |
||||
|
height: 53rpx; |
||||
|
line-height: 53rpx; |
||||
|
background: rgba(127, 212, 145, 1); |
||||
|
border-radius: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.input-box .btn { |
||||
|
padding: 0 10rpx; |
||||
|
font-size: 26rpx; |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
|
||||
|
.bottom-btn { |
||||
|
color: black; |
||||
|
margin: 50rpx auto; |
||||
|
line-height: 80rpx; |
||||
|
position: relative; |
||||
|
font-size: 34rpx; |
||||
|
text-align: center; |
||||
|
width: 333rpx; |
||||
|
height: 80rpx; |
||||
|
background: linear-gradient(90deg, #9EE4FE, #7FD491); |
||||
|
border-radius: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,87 @@ |
|||||
|
<template> |
||||
|
<view class="bg"> |
||||
|
<view class="nickname-box"> |
||||
|
<span>姓名：</span> |
||||
|
<input v-model="nickname" type="text" placeholder="请输入您的姓名" /> |
||||
|
</view> |
||||
|
<view class="btn" @click="save">保存修改</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "changeNickname", |
||||
|
data: function() { |
||||
|
return { |
||||
|
nickname: "" |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
save: function() { |
||||
|
if (!this.nickname) { |
||||
|
uni.showToast({ |
||||
|
title: '请输入昵称', |
||||
|
icon: 'none' |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
this.Post({ |
||||
|
nickname: this.nickname |
||||
|
}, '/api/user/profile').then(res => { |
||||
|
console.log(res) |
||||
|
if (res.code == 1) { |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: '保存成功！', |
||||
|
success: res => { |
||||
|
if (res.confirm) { |
||||
|
this.goBack() |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.bg { |
||||
|
min-height: 100vh; |
||||
|
} |
||||
|
|
||||
|
.nickname-box { |
||||
|
display: flex; |
||||
|
padding: 10rpx 30rpx; |
||||
|
align-items: center; |
||||
|
background: white; |
||||
|
margin-bottom: 100rpx; |
||||
|
font-size: 30rpx; |
||||
|
height: 70rpx; |
||||
|
} |
||||
|
|
||||
|
.nickname-box span { |
||||
|
flex-shrink: 0; |
||||
|
} |
||||
|
|
||||
|
.nickname-box input { |
||||
|
flex: 1; |
||||
|
font-size: 30rpx; |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
.btn { |
||||
|
color: black; |
||||
|
margin: 0 auto; |
||||
|
line-height: 80rpx; |
||||
|
position: relative; |
||||
|
font-size: 34rpx; |
||||
|
text-align: center; |
||||
|
width: 333rpx; |
||||
|
height: 80rpx; |
||||
|
background: linear-gradient(90deg, #9EE4FE, #7FD491); |
||||
|
border-radius: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue