🔥 注册账号:移除,使用手机验证码登录自动注册的方案
parent
6941b869c7
commit
8a40fbf299
|
@ -4,12 +4,12 @@
|
|||
<!-- 标题栏 -->
|
||||
<view class="head-box ss-m-b-60">
|
||||
<view class="ss-flex ss-m-b-20">
|
||||
<view class="head-title-active ss-m-r-40" @tap="showAuthModal('accountLogin')"
|
||||
>账号登录</view
|
||||
>
|
||||
<view class="head-title-active ss-m-r-40" @tap="showAuthModal('accountLogin')">
|
||||
账号登录
|
||||
</view>
|
||||
<view class="head-title head-title-line head-title-animation">短信登录</view>
|
||||
</view>
|
||||
<view class="head-subtitle">未注册手机号请先点击下方立即注册</view>
|
||||
<view class="head-subtitle">未注册的手机号,验证后自动注册账号</view>
|
||||
</view>
|
||||
|
||||
<!-- 表单项 -->
|
||||
|
|
|
@ -1,130 +0,0 @@
|
|||
<!-- 短信注册 - smsRegister -->
|
||||
<template>
|
||||
<view>
|
||||
<!-- 标题栏 -->
|
||||
<view class="head-box ss-m-b-60">
|
||||
<view class="head-title ss-m-b-20">注册</view>
|
||||
<view class="head-subtitle">请使用本人手机号完成注册</view>
|
||||
</view>
|
||||
|
||||
<!-- 表单项 -->
|
||||
<uni-forms
|
||||
ref="smsRegisterRef"
|
||||
v-model="state.model"
|
||||
:rules="state.rules"
|
||||
validateTrigger="bind"
|
||||
labelWidth="140"
|
||||
labelAlign="center"
|
||||
>
|
||||
<uni-forms-item name="mobile" label="手机号">
|
||||
<uni-easyinput
|
||||
placeholder="请输入手机号"
|
||||
v-model="state.model.mobile"
|
||||
type="number"
|
||||
:inputBorder="false"
|
||||
>
|
||||
<template v-slot:right>
|
||||
<button
|
||||
class="ss-reset-button code-btn code-btn-start"
|
||||
:disabled="state.isMobileEnd"
|
||||
:class="{ 'code-btn-end': state.isMobileEnd }"
|
||||
@tap="getSmsCode('smsRegister', state.model.mobile)"
|
||||
>
|
||||
{{ getSmsTimer('smsRegister') }}
|
||||
</button>
|
||||
</template>
|
||||
</uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item name="code" label="验证码">
|
||||
<uni-easyinput
|
||||
placeholder="请输入验证码"
|
||||
v-model="state.model.code"
|
||||
:inputBorder="false"
|
||||
type="number"
|
||||
maxlength="4"
|
||||
></uni-easyinput>
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item name="password" label="密码">
|
||||
<uni-easyinput
|
||||
type="password"
|
||||
placeholder="请输入密码"
|
||||
v-model="state.model.password"
|
||||
:inputBorder="false"
|
||||
>
|
||||
<template v-slot:right>
|
||||
<button class="ss-reset-button login-btn-start" @tap="smsRegisterSubmit"> 注册 </button>
|
||||
</template>
|
||||
</uni-easyinput>
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
|
||||
<button class="ss-reset-button type-btn" @tap="showAuthModal('accountLogin')">
|
||||
返回登录
|
||||
</button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, reactive, unref } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import { code, mobile, password } from '@/sheep/validate/form';
|
||||
import { showAuthModal, closeAuthModal, getSmsCode, getSmsTimer } from '@/sheep/hooks/useModal';
|
||||
|
||||
const props = defineProps({
|
||||
agreeStatus: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
|
||||
const smsRegisterRef = ref(null);
|
||||
|
||||
const isLogin = computed(() => sheep.$store('user').isLogin);
|
||||
|
||||
const emits = defineEmits(['onConfirm']);
|
||||
|
||||
// 数据
|
||||
const state = reactive({
|
||||
isMobileEnd: false, // 手机号输入完毕
|
||||
model: {
|
||||
mobile: '', // 手机号
|
||||
code: '', // 验证码
|
||||
password: '', // 密码
|
||||
},
|
||||
rules: {
|
||||
code,
|
||||
mobile,
|
||||
password,
|
||||
},
|
||||
});
|
||||
|
||||
// 3.短信注册
|
||||
async function smsRegisterSubmit() {
|
||||
const validate = await unref(smsRegisterRef)
|
||||
.validate()
|
||||
.catch((error) => {
|
||||
console.log('error: ', error);
|
||||
});
|
||||
if (!validate) return;
|
||||
|
||||
if (!props.agreeStatus) {
|
||||
emits('onConfirm',true);
|
||||
sheep.$helper.toast('请勾选同意');
|
||||
return;
|
||||
}
|
||||
|
||||
const { error } = await sheep.$api.user.smsRegister({
|
||||
...state.model,
|
||||
shareInfo: uni.getStorageSync('shareLog') || {},
|
||||
});
|
||||
if (error === 0) {
|
||||
closeAuthModal();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '../index.scss';
|
||||
</style>
|
|
@ -12,13 +12,6 @@
|
|||
<!-- 2.短信登录 smsLogin -->
|
||||
<sms-login v-if="authType === 'smsLogin'" :agreeStatus="state.protocol" @onConfirm="onConfirm" />
|
||||
|
||||
<!-- 3.短信注册 smsRegister-->
|
||||
<sms-register
|
||||
v-if="authType === 'smsRegister'"
|
||||
:agreeStatus="state.protocol"
|
||||
@onConfirm="onConfirm"
|
||||
/>
|
||||
|
||||
<!-- 4.忘记密码 resetPassword-->
|
||||
<reset-password v-if="authType === 'resetPassword'" />
|
||||
|
||||
|
@ -39,22 +32,13 @@
|
|||
<!-- 立即注册&快捷登录 TextButton -->
|
||||
<view v-if="sheep.$platform.name === 'WechatMiniProgram'" class="ss-flex register-box">
|
||||
<view class="register-title">还没有账号?</view>
|
||||
<button class="ss-reset-button register-btn" @tap="showAuthModal('smsRegister')"
|
||||
>立即注册</button
|
||||
<button class="ss-reset-button register-btn" @tap="showAuthModal('smsRegister')">立即注册</button
|
||||
>
|
||||
<view class="or-title">或</view>
|
||||
<button class="ss-reset-button login-btn" @tap="thirdLogin('wechat')">快捷登录</button>
|
||||
<view class="circle"></view>
|
||||
</view>
|
||||
|
||||
<button
|
||||
v-if="sheep.$platform.name !== 'WechatMiniProgram'"
|
||||
class="ss-reset-button type-btn"
|
||||
@tap="showAuthModal('smsRegister')"
|
||||
>
|
||||
立即注册
|
||||
</button>
|
||||
|
||||
<!-- 公众号|App微信登录 -->
|
||||
<button
|
||||
v-if="
|
||||
|
@ -123,7 +107,6 @@
|
|||
import sheep from '@/sheep';
|
||||
import accountLogin from './components/account-login.vue';
|
||||
import smsLogin from './components/sms-login.vue';
|
||||
import smsRegister from './components/sms-register.vue';
|
||||
import resetPassword from './components/reset-password.vue';
|
||||
import changeMobile from './components/change-mobile.vue';
|
||||
import changePasswrod from './components/change-password.vue';
|
||||
|
|
Loading…
Reference in New Issue