|
@@ -8,9 +8,8 @@
|
|
|
</route>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-// 必须导入需要用到的页面生命周期(即使在当前页面上没有直接使用到)
|
|
|
-// eslint-disable-next-line unused-imports/no-unused-imports
|
|
|
-import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
|
|
+import { register } from '@/api/login'
|
|
|
+import { toast } from '@/utils/toast'
|
|
|
|
|
|
defineOptions({
|
|
|
name: 'Register', // 注册
|
|
@@ -22,47 +21,29 @@ const safeAreaInsets = systemInfo.safeAreaInsets
|
|
|
|
|
|
// 表单数据
|
|
|
const formData = ref({
|
|
|
- username: '',
|
|
|
- mobile: '',
|
|
|
+ name: '',
|
|
|
+ phone: '',
|
|
|
verificationCode: '',
|
|
|
- password: '',
|
|
|
- referrerCode: '',
|
|
|
+ pwd: '',
|
|
|
+ code: '',
|
|
|
})
|
|
|
|
|
|
// 验证码倒计时
|
|
|
const countdown = ref(0)
|
|
|
-const countdownTimer = ref<NodeJS.Timeout | null>(null)
|
|
|
-
|
|
|
-// 表单验证规则
|
|
|
-const rules = {
|
|
|
- username: [
|
|
|
- { required: true, message: 'Please enter username' },
|
|
|
- ],
|
|
|
- mobile: [
|
|
|
- { required: true, message: 'Please enter mobile number' },
|
|
|
- { pattern: /^1[3-9]\d{9}$/, message: 'Please enter valid mobile number' },
|
|
|
- ],
|
|
|
- verificationCode: [
|
|
|
- { required: true, message: 'Please enter verification code' },
|
|
|
- ],
|
|
|
- password: [
|
|
|
- { required: true, message: 'Please enter password' },
|
|
|
- { min: 6, max: 20, message: 'Password should be 6-20 characters' },
|
|
|
- ],
|
|
|
-}
|
|
|
+const countdownTimer = ref<any>(null)
|
|
|
|
|
|
// 获取验证码
|
|
|
function getVerificationCode() {
|
|
|
- if (!formData.value.mobile) {
|
|
|
+ if (!formData.value.phone) {
|
|
|
uni.showToast({
|
|
|
- title: 'Please enter mobile number first',
|
|
|
+ title: 'Please enter phone number first',
|
|
|
icon: 'none',
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// TODO: 实现获取验证码逻辑
|
|
|
- console.log('Get verification code for:', formData.value.mobile)
|
|
|
+ console.log('Get verification code for:', formData.value.phone)
|
|
|
|
|
|
// 开始倒计时
|
|
|
countdown.value = 60
|
|
@@ -76,9 +57,87 @@ function getVerificationCode() {
|
|
|
}
|
|
|
|
|
|
// 注册处理
|
|
|
-function handleRegister() {
|
|
|
- // TODO: 实现注册逻辑
|
|
|
- console.log('Register:', formData.value)
|
|
|
+async function handleRegister() {
|
|
|
+ try {
|
|
|
+ // 表单验证
|
|
|
+ const isValid = await validateForm()
|
|
|
+ if (!isValid)
|
|
|
+ return
|
|
|
+
|
|
|
+ // 显示加载状态
|
|
|
+ uni.showLoading({
|
|
|
+ title: 'Registering...',
|
|
|
+ mask: true,
|
|
|
+ })
|
|
|
+
|
|
|
+ // 调用注册接口
|
|
|
+ const registerData = {
|
|
|
+ name: formData.value.name,
|
|
|
+ phone: formData.value.phone,
|
|
|
+ verificationCode: formData.value.verificationCode,
|
|
|
+ pwd: formData.value.pwd,
|
|
|
+ code: formData.value.code,
|
|
|
+ }
|
|
|
+
|
|
|
+ await register(registerData)
|
|
|
+
|
|
|
+ uni.hideLoading()
|
|
|
+ // 注册成功
|
|
|
+ toast.info('Registration successful!')
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.navigateTo({ url: '/pages/login/login' })
|
|
|
+ }, 1500)
|
|
|
+ }
|
|
|
+ catch (error) {
|
|
|
+ uni.hideLoading()
|
|
|
+ toast.error(error.message || 'Registration failed')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 表单验证
|
|
|
+function validateForm() {
|
|
|
+ return new Promise((resolve) => {
|
|
|
+ // 验证必填字段
|
|
|
+ if (!formData.value.name.trim()) {
|
|
|
+ toast.info('Please enter name')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!formData.value.phone.trim()) {
|
|
|
+ toast.info('Please enter phone number')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ // 验证手机号格式
|
|
|
+ if (!formData.value.phone.trim()) {
|
|
|
+ toast.info('Please enter valid phone number')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!formData.value.verificationCode.trim()) {
|
|
|
+ toast.info('Please enter verification code')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!formData.value.pwd.trim()) {
|
|
|
+ toast.info('Please enter password')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ // 验证密码长度
|
|
|
+ if (formData.value.pwd.length < 6 || formData.value.pwd.length > 20) {
|
|
|
+ toast.info('Password should be 6-20 characters')
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ resolve(true)
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
// 跳转登录页
|
|
@@ -125,18 +184,18 @@ onUnmounted(() => {
|
|
|
<view class="mb-40rpx" />
|
|
|
|
|
|
<!-- 注册表单 -->
|
|
|
- <wd-form ref="form" :model="formData" :rules="rules">
|
|
|
+ <wd-form ref="form" :model="formData">
|
|
|
<view class="mb-40rpx space-y-32rpx">
|
|
|
<wd-input
|
|
|
- v-model="formData.username"
|
|
|
- prop="username"
|
|
|
+ v-model="formData.name"
|
|
|
+ prop="name"
|
|
|
placeholder="Username"
|
|
|
no-border
|
|
|
custom-class="bandhu-auth-input-field"
|
|
|
/>
|
|
|
<wd-input
|
|
|
- v-model="formData.mobile"
|
|
|
- prop="mobile"
|
|
|
+ v-model="formData.phone"
|
|
|
+ prop="phone"
|
|
|
placeholder="+88 Mobile number"
|
|
|
no-border
|
|
|
custom-class="bandhu-auth-input-field"
|
|
@@ -160,15 +219,15 @@ onUnmounted(() => {
|
|
|
</wd-button>
|
|
|
</view>
|
|
|
<wd-input
|
|
|
- v-model="formData.password"
|
|
|
- prop="password"
|
|
|
-
|
|
|
+ v-model="formData.pwd"
|
|
|
+ prop="pwd"
|
|
|
placeholder="Password 6-20 characters"
|
|
|
- no-border show-password
|
|
|
+ no-border
|
|
|
+ show-password
|
|
|
custom-class="bandhu-auth-input-field"
|
|
|
/>
|
|
|
<wd-input
|
|
|
- v-model="formData.referrerCode"
|
|
|
+ v-model="formData.code"
|
|
|
placeholder="Referrer Code"
|
|
|
no-border
|
|
|
custom-class="bandhu-auth-input-field"
|