103 lines
2.8 KiB
Vue
103 lines
2.8 KiB
Vue
<script setup>
|
|
import {reactive} from "vue";
|
|
import XNav from "../../components/XNav.vue";
|
|
import BulletChat from "../login/BulletChat.vue";
|
|
import XInput from "../../components/XInput.vue";
|
|
import SendMsg from "../../components/SendMsg.vue";
|
|
import Api from "../../api/index.js";
|
|
import {showToast, toPage, verifyForm} from "../../utils/uils.js";
|
|
import {onLoad} from "@dcloudio/uni-app";
|
|
|
|
const form = reactive({
|
|
wechat: null,
|
|
mobile: null,
|
|
captcha: null,
|
|
password: null,
|
|
invite: null,
|
|
});
|
|
|
|
const rules = {
|
|
wechat: {
|
|
reg: /^[a-zA-Z0-9_-]{1,19}$/,
|
|
msg: '微信号错误',
|
|
title: '微信号',
|
|
required: true,
|
|
},
|
|
mobile: {
|
|
reg: /^1[3-9]\d{9}$/,
|
|
title: '手机号',
|
|
msg: '手机号错误',
|
|
required: true,
|
|
},
|
|
captcha: {
|
|
reg: /^\d{6}$/,
|
|
title: '验证码',
|
|
msg: '验证码错误',
|
|
required: true,
|
|
},
|
|
password: {
|
|
title: '密码',
|
|
msg: '密码错误',
|
|
required: true,
|
|
}
|
|
};
|
|
|
|
const success = async () => {
|
|
verifyForm(form, rules);
|
|
const {msg} = await Api.system.register(form);
|
|
showToast(msg);
|
|
await toPage(`/pages/login/index?showWX=1`);
|
|
}
|
|
|
|
onLoad((options) => {
|
|
const {invite} = options;
|
|
form.invite = invite;
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<!--注册-->
|
|
<XNav></XNav>
|
|
|
|
<view class="h-[390rpx] relative overflow-hidden">
|
|
<image class="!absolute left-1/2 top-1/2 -translate-1/2 !w-[1198rpx] !h-[806rpx] !pb-[40rpx]"
|
|
src="/static/icons/bg.png"></image>
|
|
|
|
<view class="!flex gap-[16rpx] items-center !mt-[56rpx] !ml-[16rpx] relative z-10">
|
|
<image class="!w-[68rpx] !h-[68rpx]" src="/static/icons/hi.png"></image>
|
|
<view class="title">欢迎注册</view>
|
|
</view>
|
|
|
|
<BulletChat></BulletChat>
|
|
</view>
|
|
|
|
<view class="h-full bg-white !-mt-[20rpx] rounded-t-[20rpx] !pt-[44rpx] relative z-10">
|
|
<view class="!px-[34rpx] !flex flex-col gap-[40rpx]">
|
|
<x-input v-model:model-value="form.wechat" placeholder="请输入微信号"></x-input>
|
|
<x-input v-model:model-value="form.mobile" placeholder="请输入手机号"></x-input>
|
|
<send-msg v-model:model-value="form.captcha" :mobile="form.mobile"></send-msg>
|
|
<x-input v-model:model-value="form.password" placeholder="请输入登录密码"></x-input>
|
|
<x-input v-model:model-value="form.invite" placeholder="请输入邀请码(可选)"></x-input>
|
|
|
|
<tui-button class="!mt-[52rpx]" @click="success">确认注册</tui-button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #fff;
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
.title {
|
|
color: rgb(29, 33, 41);
|
|
font-size: 26px;
|
|
font-weight: 700;
|
|
line-height: 28px;
|
|
letter-spacing: 0;
|
|
text-align: left;
|
|
}
|
|
</style>
|