162 lines
4.1 KiB
Vue
162 lines
4.1 KiB
Vue
<route lang="json5" type="page">
|
|
{
|
|
style: {
|
|
navigationBarTitleText: '注册',
|
|
navigationStyle: 'custom',
|
|
},
|
|
notNeedLogin: false,
|
|
}
|
|
</route>
|
|
|
|
<script lang="ts" setup>
|
|
import NavBar from '@/components/NavBar.vue'
|
|
import { isLogged } from '@/interceptors/route'
|
|
import { registerUserAPI } from '@/service'
|
|
import { useUserStore } from '@/store/user'
|
|
import { mergeStep } from '@/utils'
|
|
|
|
const userStore = useUserStore()
|
|
const form = ref({
|
|
username: '',
|
|
// member_nickname: '',
|
|
password: '',
|
|
retpassword: '',
|
|
invitecode: '',
|
|
// tpassword: '',
|
|
// rettpassword: '',
|
|
})
|
|
|
|
let redirect = '/'
|
|
onLoad((options) => {
|
|
redirect = options.redirect ?? '/'
|
|
form.value.invitecode = options.invitecode ?? ''
|
|
})
|
|
|
|
const handleRegister = mergeStep(async () => {
|
|
if (!/^\d{11}$/.test(form.value.username)) {
|
|
uni.showToast({
|
|
title: '请输入正确手机号(11位)',
|
|
icon: 'none',
|
|
})
|
|
return
|
|
}
|
|
if (!form.value.password) {
|
|
uni.showToast({
|
|
title: '请输入登录密码',
|
|
icon: 'none',
|
|
})
|
|
return
|
|
}
|
|
if (form.value.password !== form.value.retpassword) {
|
|
uni.showToast({
|
|
title: '两次输入的密码不一致',
|
|
icon: 'none',
|
|
})
|
|
return
|
|
}
|
|
|
|
if (!form.value.invitecode) {
|
|
uni.showToast({
|
|
title: '请输入邀请码',
|
|
icon: 'none',
|
|
})
|
|
return
|
|
}
|
|
const {
|
|
data: {
|
|
userinfo: { token },
|
|
},
|
|
} = await registerUserAPI(form.value)
|
|
userStore.setToken(token)
|
|
uni.reLaunch({
|
|
url: redirect,
|
|
})
|
|
})
|
|
onLoad(async (options) => {
|
|
if (isLogged()) {
|
|
uni.reLaunch({
|
|
url: redirect,
|
|
})
|
|
}
|
|
form.value.invitecode = options.invite ?? ''
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<view class="login-container relative">
|
|
<NavBar />
|
|
<view class="pt-45">
|
|
<view class="mx-15 px-15 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10">
|
|
<view class="flex items-center py-15">
|
|
<view class="text-gradient">手机号</view>
|
|
<input
|
|
v-model="form.username"
|
|
type="text"
|
|
placeholder-class="text-#889BC6"
|
|
class="text-right flex-1 text-14"
|
|
placeholder="请输入手机号"
|
|
/>
|
|
</view>
|
|
<view class="flex items-center py-15">
|
|
<view class="text-gradient">登录密码</view>
|
|
<input
|
|
v-model="form.password"
|
|
placeholder-class="text-#889BC6"
|
|
type="password"
|
|
class="text-right flex-1 text-14"
|
|
placeholder="请输入登录密码"
|
|
/>
|
|
</view>
|
|
<view class="flex items-center py-15">
|
|
<view class="text-gradient">确认登录密码</view>
|
|
<input
|
|
v-model="form.retpassword"
|
|
placeholder-class="text-#889BC6"
|
|
type="password"
|
|
class="text-right flex-1 text-14"
|
|
placeholder="请再次输入登录密码"
|
|
/>
|
|
</view>
|
|
<!-- <view class="flex items-center py-15">
|
|
<view class="text-gradient">验证码</view>
|
|
<input
|
|
v-model="form.invitecode"
|
|
placeholder-class="text-#889BC6"
|
|
type="text"
|
|
class="text-right flex-1 text-14"
|
|
placeholder="请输入验证码"
|
|
/>
|
|
<image class="w-60 h-24 ml-15 bg-gray-400" mode="aspectFit" />
|
|
</view> -->
|
|
<view class="flex items-center py-15">
|
|
<view class="text-gradient">邀请码</view>
|
|
<input
|
|
v-model="form.invitecode"
|
|
placeholder-class="text-#889BC6"
|
|
type="text"
|
|
class="text-right flex-1 text-14"
|
|
placeholder="请输入邀请码"
|
|
/>
|
|
</view>
|
|
</view>
|
|
<view
|
|
class="mt-50 text-center py-12 rounded-full mx-15 text-15 text-white btn-gradient"
|
|
@click="handleRegister"
|
|
>
|
|
注册
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.login-container {
|
|
box-sizing: border-box;
|
|
min-height: 100vh;
|
|
padding-bottom: 200rpx;
|
|
background-image: url('@/static/images/login-bg.png');
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
}
|
|
</style>
|