zhangjing/ysdH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[本时生活h5端]

Browse Source
This commit is contained in:
张慢慢
2023-06-21 17:19:58 +08:00
commit ebb9575bd0
284 changed files with 39689 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

195
pages/draw/register.vue Normal file
View File

@@ -0,0 +1,195 @@
<template>
<view class="content">
<image class="drawTitle" src="@/static/img/draw-title.png" mode="widthFix"></image>
<view class="campus-cont">
<form @submit="submitRegister">
<view class="campus-inputs">
<image class="campus-form-icon" src="/static/img/draw_login_02.png" mode="aspectFill"></image>
<input class="campus-form-input" maxlength="11" type="number" placeholder="请输入手机号" @input="getNameValue" name="mobile" placeholder-style="color:#c9c9c9;"></input>
</view>
<view class="inputs-code">
<view class="campus-inputs">
<image class="campus-form-icon" src="/static/img/draw_login_04.png" mode="aspectFill"></image>
<input class="campus-form-input" type="number" placeholder="请输入验证码" @input="getCodeValue" maxlength="4" placeholder-style="color:#c9c9c9;"></input>
</view>
<button class="campus-form-code" @tap="getCode" :disabled="disabled" hover-class="none">{{ codename }}</button>
</view>
<view class="campus-inputs">
<image class="campus-form-icon" src="/static/img/draw_login_03.png" mode="aspectFill"></image>
<input class="campus-form-input" maxlength="6" type="password" placeholder="请设置登录密码" name="password" placeholder-style="color:#c9c9c9;"></input>
</view>
<view class="campus-inputs">
<image class="campus-form-icon" src="/static/img/draw_login_03.png" mode="aspectFill"></image>
<input class="campus-form-input" maxlength="6" type="password" placeholder="请确认登录密码" name="password_confirmation" placeholder-style="color:#c9c9c9;"></input>
</view>
<button class="campus-form-btn" form-type="submit">立即注册</button>
</form>
<view class="login-box">
<navigator class="login-box-flex" hover-class="none" url="signin">已有账号，立即登录</navigator>
</view>
</view>
</view>
</template>
<script>
import { register, send, auth } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
code : '', // 验证码
disabled : false,
}
},
// 生命周期函数--监听页面显示
onShow() {
// 存储环境-用户抽奖活动
getApp().globalData.envType = 'drawEnv'
},
methods: {
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{
uni.showToast({
title : err.message,
icon :'none',
duration: 2000
})
})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即注册
submitRegister(e){
let formValue = e.detail.value,
code = this.code || ''
register({
mobile : formValue.mobile,
password : formValue.password,
password_confirmation : formValue.password_confirmation,
code : code
}).then(res => {
this.$store.commit('setToken', res.token)
uni.reLaunch({
url: '/pages/draw/index'
})
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
}
}
}
</script>
<style lang="scss">
page {
background-color: #f67b5a;
}
.drawTitle {
width: 100%;
}
.campus-cont {
padding: 10rpx 50rpx 20rpx;
box-sizing: border-box;
.campus-inputs {
background-color: #FFFFFF;
border-radius: 10rpx;
margin-bottom: 30rpx;
height: 100rpx;
line-height: 100rpx;
display: flex;
padding: 0 30rpx;
box-sizing: border-box;
.campus-form-icon {
width: 50rpx;
height: 50rpx;
margin: 25rpx 20rpx 0 0;
}
.campus-form-input {
width: calc(100% - 70rpx);
height: 100%;
line-height: 100rpx;
font-size: 32rpx;
}
}
.campus-form-btn {
background-color: #ffe455;
border-radius: 10rpx;
line-height: 100rpx;
font-size: 36rpx;
color: #6a4902;
margin-top: 40rpx;
box-shadow: 4rpx 4rpx 6rpx #c62024;
}
.login-box {
line-height: 90rpx;
padding: 0 10rpx;
box-sizing: border-box;
color: #FFFFFF;
font-size: 32rpx;
text-align: center;
}
}
.inputs-code {
display: flex;
.campus-inputs {
flex: 1;
}
.campus-form-code {
background-color: #ffe455;
color: #735b1f;
font-size: 32rpx;
height: 100rpx;
line-height: 100rpx;
margin-left: 20rpx;
}
}
</style>