feat(player): 玩家端短信找回密码

支持手机号验证码重置密码,重置成功后跳转登录页;SMS 增加 reset_password 场景与 purpose 隔离。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-06-12 13:12:00 +08:00
parent e140861a2b
commit ff89c31b51
16 changed files with 597 additions and 13 deletions

View File

@@ -1,12 +1,14 @@
import { Controller, Get, Post, Delete, Body, UseGuards, Query, Param } from '@nestjs/common';
import { Controller, Get, Post, Delete, Body, UseGuards, Query, Param, Req } from '@nestjs/common';
import type { Request } from 'express';
import { ApiTags, ApiBearerAuth } from '@nestjs/swagger';
import { AuthService } from './auth.service';
import { InvitesService } from './invites.service';
import { SystemConfigService } from '../../shared/config/system-config.service';
import { LoginDto, ChangePasswordDto, RegisterDto, GenerateInviteDto } from './auth.dto';
import { LoginDto, ChangePasswordDto, RegisterDto, GenerateInviteDto, ForgotPasswordDto } from './auth.dto';
import { Public, CurrentUser } from '../../shared/common/decorators';
import { JwtAuthGuard } from './guards';
import { jsonResponse } from '../../shared/common/filters';
import { getClientIp } from '../../shared/common/client-ip.util';
@ApiTags('Auth')
@Controller()
@@ -45,6 +47,20 @@ export class AuthController {
return jsonResponse(result);
}
@Public()
@Post('player/auth/forgot-password')
async playerForgotPassword(@Body() dto: ForgotPasswordDto, @Req() req: Request) {
const result = await this.auth.resetPasswordByPhone({
phone: dto.phone,
countryCode: dto.countryCode,
smsCode: dto.smsCode,
sessionId: dto.sessionId,
newPassword: dto.newPassword,
ipAddress: getClientIp(req),
});
return jsonResponse(result);
}
@UseGuards(JwtAuthGuard)
@ApiBearerAuth()
@Get('manage/invite')

View File

@@ -66,6 +66,29 @@ export class ChangePasswordDto {
newPassword!: string;
}
export class ForgotPasswordDto {
@ApiProperty({ description: '本地手机号,不含国家区号' })
@IsString()
phone!: string;
@ApiProperty({ description: '国家区号,不含 +,如 86' })
@IsString()
countryCode!: string;
@ApiProperty({ description: '短信验证码' })
@IsString()
smsCode!: string;
@ApiProperty({ description: '发送验证码返回的 sessionId' })
@IsString()
sessionId!: string;
@ApiProperty()
@IsString()
@MinLength(8)
newPassword!: string;
}
export class GenerateInviteDto {
@ApiProperty({ required: false, description: 'Decimal cashback rate, e.g. 0.01 = 1%. Admin only.' })
@IsOptional()

View File

@@ -9,6 +9,7 @@ import { PrismaService } from '../../shared/prisma/prisma.service';
import { SystemConfigService } from '../../shared/config/system-config.service';
import { InvitesService } from './invites.service';
import { SmsService } from './sms/sms.service';
import { AuditService } from '../operations/audit/audit.service';
import { normalizePhone, resolvePlayerLoginCandidates, stripLocalPhoneDigits } from './sms/phone.util';
const MAX_LOGIN_FAILS = 5;
@@ -30,6 +31,7 @@ export class AuthService {
private systemConfig: SystemConfigService,
private invites: InvitesService,
private sms: SmsService,
private audit: AuditService,
) {}
/** 平台管理员 / 代理统一登录(按 userType 签发对应 JWT */
@@ -227,6 +229,7 @@ export class AuthService {
countryCode: data.countryCode,
code: data.smsCode.trim(),
sessionId: data.sessionId.trim(),
expectedPurpose: 'register',
});
const { parentId, sponsorId, inviteId } = await this.resolveInviteSponsor(data.inviteCode);
@@ -362,6 +365,83 @@ export class AuthService {
return { success: true };
}
async resetPasswordByPhone(data: {
phone: string;
countryCode: string;
smsCode: string;
sessionId: string;
newPassword: string;
ipAddress?: string;
}) {
const settings = await this.systemConfig.getPlayerAccountSettings();
if (!settings.allowPasswordChange) {
throw appForbidden('PASSWORD_CHANGE_DISABLED');
}
if (!data.newPassword || data.newPassword.length < 8) {
throw appBadRequest('PASSWORD_MIN_LENGTH');
}
if (!data.smsCode?.trim() || !data.sessionId?.trim()) {
throw appBadRequest('SMS_CODE_REQUIRED');
}
await this.sms.verifyCode({
phone: data.phone,
countryCode: data.countryCode,
code: data.smsCode.trim(),
sessionId: data.sessionId.trim(),
expectedPurpose: 'reset_password',
});
const player = await this.findPlayerByPhone(data.countryCode, data.phone);
if (!player) {
throw appBadRequest('PHONE_NOT_REGISTERED');
}
if (player.status === 'DISABLED') {
throw appForbidden('ACCOUNT_DISABLED');
}
const hash = await this.hashPassword(data.newPassword);
await this.prisma.userAuth.update({
where: { userId: player.id },
data: {
passwordHash: hash,
loginFailCount: 0,
lockedUntil: null,
},
});
await this.prisma.userPreference.updateMany({
where: { userId: player.id },
data: { managedPassword: null },
});
await this.audit.log({
operatorId: player.id,
operatorType: 'PLAYER',
action: 'FORGOT_PASSWORD_RESET',
module: 'identity',
targetType: 'user',
targetId: player.id.toString(),
ipAddress: data.ipAddress,
});
return { success: true };
}
private async findPlayerByPhone(countryCode: string, phone: string) {
const dial = countryCode.replace(/\D/g, '');
const phoneLocal = stripLocalPhoneDigits(phone);
const pref = await this.prisma.userPreference.findFirst({
where: {
phoneCountryDial: dial,
phoneLocal,
user: { deletedAt: null, userType: 'PLAYER' },
},
select: { user: { select: { id: true, status: true } } },
});
return pref?.user ?? null;
}
async hashPassword(password: string): Promise<string> {
return bcrypt.hash(password, 10);
}

View File

@@ -20,6 +20,7 @@ export class SmsController {
countryCode: dto.countryCode.trim(),
locale: dto.locale,
clientIp: getClientIp(req),
purpose: dto.purpose,
});
return jsonResponse(result);
}

View File

@@ -1,5 +1,6 @@
import { IsString, IsOptional } from 'class-validator';
import { IsString, IsOptional, IsIn } from 'class-validator';
import { ApiProperty } from '@nestjs/swagger';
import type { SmsPurpose } from './sms.types';
export class SendSmsCodeDto {
@ApiProperty({ example: '13800138000', description: '本地手机号,不含国家区号' })
@@ -14,6 +15,11 @@ export class SendSmsCodeDto {
@IsOptional()
@IsString()
locale?: string;
@ApiProperty({ required: false, enum: ['register', 'reset_password'] })
@IsOptional()
@IsIn(['register', 'reset_password'])
purpose?: SmsPurpose;
}
export class VerifySmsCodeDto {

View File

@@ -3,13 +3,15 @@ import { ConfigService } from '@nestjs/config';
import { randomUUID } from 'node:crypto';
import { normalizeLocale } from '@thebet365/shared';
import { RedisService } from '../../../shared/redis/redis.service';
import { appBadRequest, appTooManyRequests } from '../../../shared/common/app-error';
import { PrismaService } from '../../../shared/prisma/prisma.service';
import { SystemConfigService } from '../../../shared/config/system-config.service';
import { appBadRequest, appForbidden, appTooManyRequests } from '../../../shared/common/app-error';
import { ChuanglanClient } from './chuanglan/client';
import { loadSmsBusinessConfig } from './chuanglan/config';
import { generateSixDigitCode } from './code';
import { normalizePhone } from './phone.util';
import { renderVerifySms } from './templates';
import type { SmsLang } from './sms.types';
import { normalizePhone, stripLocalPhoneDigits } from './phone.util';
import { renderResetPasswordSms, renderVerifySms } from './templates';
import type { SmsLang, SmsPurpose } from './sms.types';
const codeKey = (sessionId: string) => `sms:code:${sessionId}`;
const phoneRateKey = (phone: string) => `sms:rate:phone:${phone}`;
@@ -29,6 +31,8 @@ export class SmsService {
constructor(
private redis: RedisService,
private chuanglan: ChuanglanClient,
private prisma: PrismaService,
private systemConfig: SystemConfigService,
config: ConfigService,
) {
this.smsCfg = loadSmsBusinessConfig(config);
@@ -39,9 +43,15 @@ export class SmsService {
countryCode: string;
locale?: string;
clientIp: string;
purpose?: SmsPurpose;
}): Promise<{ sessionId: string }> {
const purpose: SmsPurpose = params.purpose ?? 'register';
const phone = normalizePhone(params.countryCode, params.phone);
if (purpose === 'reset_password') {
await this.assertPlayerCanResetPassword(params.countryCode, params.phone);
}
const [phoneLimited, ipLimited] = await Promise.all([
this.redis.exists(phoneRateKey(phone)),
this.redis.exists(ipRateKey(params.clientIp)),
@@ -53,7 +63,10 @@ export class SmsService {
const code = generateSixDigitCode();
const sessionId = randomUUID();
const lang = mapLocaleToSmsLang(params.locale);
const msg = renderVerifySms(lang, code);
const msg =
purpose === 'reset_password'
? renderResetPasswordSms(lang, code)
: renderVerifySms(lang, code);
const result = await this.chuanglan.sendSms(phone, msg, sessionId);
if (!result.success) {
@@ -63,7 +76,7 @@ export class SmsService {
await Promise.all([
this.redis.set(
codeKey(sessionId),
JSON.stringify({ phone, code }),
JSON.stringify({ phone, code, purpose }),
this.smsCfg.codeTtlSeconds,
),
this.redis.set(phoneRateKey(phone), '1', this.smsCfg.rateLimitSeconds),
@@ -78,6 +91,7 @@ export class SmsService {
countryCode: string;
code: string;
sessionId: string;
expectedPurpose?: SmsPurpose;
}): Promise<void> {
const phone = normalizePhone(params.countryCode, params.phone);
const raw = await this.redis.get(codeKey(params.sessionId));
@@ -85,11 +99,43 @@ export class SmsService {
throw appBadRequest('SMS_CODE_EXPIRED');
}
const cached = JSON.parse(raw) as { phone: string; code: string };
const cached = JSON.parse(raw) as { phone: string; code: string; purpose?: SmsPurpose };
const cachedPurpose: SmsPurpose = cached.purpose ?? 'register';
const expectedPurpose = params.expectedPurpose ?? 'register';
if (cachedPurpose !== expectedPurpose) {
throw appBadRequest('SMS_CODE_INVALID');
}
if (cached.phone !== phone || cached.code !== params.code.trim()) {
throw appBadRequest('SMS_CODE_INVALID');
}
await this.redis.del(codeKey(params.sessionId));
}
private async assertPlayerCanResetPassword(countryCode: string, phone: string): Promise<void> {
const dial = countryCode.replace(/\D/g, '');
const phoneLocal = stripLocalPhoneDigits(phone);
const pref = await this.prisma.userPreference.findFirst({
where: {
phoneCountryDial: dial,
phoneLocal,
user: { deletedAt: null, userType: 'PLAYER' },
},
include: { user: { select: { status: true } } },
});
if (!pref) {
throw appBadRequest('PHONE_NOT_REGISTERED');
}
if (pref.user.status === 'DISABLED') {
throw appForbidden('ACCOUNT_DISABLED');
}
const settings = await this.systemConfig.getPlayerAccountSettings();
if (!settings.allowPasswordChange) {
throw appForbidden('PASSWORD_CHANGE_DISABLED');
}
}
}

View File

@@ -1,5 +1,7 @@
export type SmsLang = 'zh' | 'en' | 'vi' | 'ms' | 'kh';
export type SmsPurpose = 'register' | 'reset_password';
export interface ChuanglanSendResponse {
code: string;
message: string;

View File

@@ -14,3 +14,18 @@ export function renderVerifySms(lang: SmsLang | undefined, code: string): string
const tpl = TEMPLATES[key] ?? TEMPLATES.default ?? TEMPLATES.zh;
return tpl.replace('{code}', code);
}
const RESET_TEMPLATES: Record<string, string> = {
default: '您正在重置密码,验证码:{code}。5分钟内有效请勿泄露。',
zh: '您正在重置密码,验证码:{code}。5分钟内有效请勿泄露。',
en: 'Password reset code: {code}. Valid for 5 minutes. Do not share.',
vi: 'Mã đặt lại mật khẩu: {code}. Có hiệu lực trong 5 phút.',
ms: 'Kod tetapan semula kata laluan: {code}. Sah selama 5 minit.',
kh: 'កូដកំណត់ពាក្យសម្ងាត់ឡើងវិញ៖ {code} ។ មានសុពលភាព ៥ នាទី។',
};
export function renderResetPasswordSms(lang: SmsLang | undefined, code: string): string {
const key = lang?.trim() || 'zh';
const tpl = RESET_TEMPLATES[key] ?? RESET_TEMPLATES.default ?? RESET_TEMPLATES.zh;
return tpl.replace('{code}', code);
}

View File

@@ -30,7 +30,11 @@ export function useSmsCode() {
}, 1000);
}
async function send(phone: string, countryCode: string) {
async function send(
phone: string,
countryCode: string,
purpose: 'register' | 'reset_password' = 'register',
) {
if (countdown.value > 0 || sending.value) return;
const trimmed = phone.trim();
const dial = countryCode.replace(/\D/g, '');
@@ -46,6 +50,7 @@ export function useSmsCode() {
phone: trimmed,
countryCode: dial,
locale,
purpose,
});
sessionId.value = data.data.sessionId;
startCountdown();

View File

@@ -91,6 +91,7 @@ export default {
login_username_placeholder: 'Phone number or username',
confirm_password: 'Confirm password',
password_mismatch: 'Passwords do not match',
password_min_length: 'Password must be at least 8 characters',
password_placeholder: 'Enter password',
login_btn: 'Log In',
login_failed: 'Login failed, please try again',
@@ -108,6 +109,13 @@ export default {
resend_sms: 'Retry in {sec}s',
country_search: 'Search country or code',
country_not_found: 'No matching country',
forgot_password: 'Forgot password?',
forgot_password_title: 'Reset password',
reset_password_btn: 'Reset password',
reset_success: 'Password reset. Please sign in with your new password. Contact your agent if you cannot log in.',
reset_failed: 'Reset failed. Please try again.',
phone_not_registered: 'This phone number is not registered',
back_to_login: 'Back to login',
},
support: {
short: 'Support',

View File

@@ -97,6 +97,7 @@ export default {
login_username_placeholder: 'Nombor telefon atau akaun',
confirm_password: 'Sahkan kata laluan',
password_mismatch: 'Kata laluan tidak sepadan',
password_min_length: 'Kata laluan mestilah sekurang-kurangnya 8 aksara',
password_placeholder: 'Masukkan kata laluan',
login_btn: 'Log Masuk',
login_failed: 'Log masuk gagal, sila cuba lagi',
@@ -114,6 +115,13 @@ export default {
resend_sms: 'Cuba lagi dalam {sec}s',
country_search: 'Cari negara atau kod',
country_not_found: 'Tiada negara sepadan',
forgot_password: 'Lupa kata laluan?',
forgot_password_title: 'Tetapkan semula kata laluan',
reset_password_btn: 'Tetapkan semula',
reset_success: 'Kata laluan ditetapkan semula. Sila log masuk dengan kata laluan baharu. Hubungi ejen anda jika tidak dapat log masuk.',
reset_failed: 'Gagal menetapkan semula. Sila cuba lagi.',
phone_not_registered: 'Nombor telefon ini belum didaftarkan',
back_to_login: 'Kembali ke log masuk',
},
support: {
short: 'Sokongan',

View File

@@ -91,6 +91,7 @@ export default {
login_username_placeholder: '手机号或账号',
confirm_password: '确认密码',
password_mismatch: '两次密码不一致',
password_min_length: '密码至少 8 位',
password_placeholder: '请输入密码',
login_btn: '登录',
login_failed: '登录失败,请重试',
@@ -108,6 +109,13 @@ export default {
resend_sms: '{sec}s 后重试',
country_search: '搜索国家或区号',
country_not_found: '未找到匹配国家',
forgot_password: '忘记密码?',
forgot_password_title: '重置密码',
reset_password_btn: '重置密码',
reset_success: '密码已重置,请使用新密码登录。若无法登录请联系代理。',
reset_failed: '重置失败,请重试',
phone_not_registered: '该手机号未注册',
back_to_login: '返回登录',
},
support: {
short: '客服',

View File

@@ -6,6 +6,7 @@ const router = createRouter({
routes: [
{ path: '/login', component: () => import('../views/LoginView.vue') },
{ path: '/register', component: () => import('../views/RegisterView.vue') },
{ path: '/forgot-password', component: () => import('../views/ForgotPasswordView.vue') },
{
path: '/',
component: () => import('../layouts/MainLayout.vue'),
@@ -34,7 +35,7 @@ const router = createRouter({
router.beforeEach((to) => {
const auth = useAuthStore();
if ((to.path === '/login' || to.path === '/register') && auth.token) return '/';
if ((to.path === '/login' || to.path === '/register' || to.path === '/forgot-password') && auth.token) return '/';
// 需要登录的页面 — 未登录时弹出登录提示,留在当前页
if (to.meta.requiresAuth && !auth.token) {
auth.showLoginPrompt(to.fullPath);

View File

@@ -0,0 +1,322 @@
<script setup lang="ts">
import { ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { defaultPhoneIsoForLocale, getPhoneDialFromIso } from '@thebet365/shared';
import { useSmsCode } from '../composables/useSmsCode';
import api from '../api';
import LocaleSwitcher from '../components/LocaleSwitcher.vue';
import PhoneCountrySelect from '../components/PhoneCountrySelect.vue';
import loginBg from '../assets/images/h5bg.webp';
const { t, locale } = useI18n();
const router = useRouter();
const route = useRoute();
const phone = ref('');
const countryIso = ref(defaultPhoneIsoForLocale(locale.value));
const smsCode = ref('');
const password = ref('');
const confirmPassword = ref('');
const error = ref('');
const loading = ref(false);
const { sessionId, countdown, sending, error: smsError, send } = useSmsCode();
async function sendCode() {
await send(phone.value, getPhoneDialFromIso(countryIso.value), 'reset_password');
}
function mapApiError(code: string | undefined): string {
if (!code) return t('auth.reset_failed');
if (code === 'PHONE_NOT_REGISTERED') return t('auth.phone_not_registered');
if (code === 'PASSWORD_CHANGE_DISABLED') return t('profile.password_unavailable_hint');
if (code === 'ACCOUNT_DISABLED') return t('auth.login_failed');
if (code === 'PASSWORD_MIN_LENGTH') return t('auth.password_min_length');
if (code === 'SMS_CODE_REQUIRED' || code === 'SMS_CODE_INVALID' || code === 'SMS_CODE_EXPIRED') {
return t('auth.sms_code_required');
}
if (code === 'SMS_RATE_LIMIT') return t('auth.send_sms');
return code;
}
function fieldError(): string {
if (error.value) return error.value;
if (smsError.value === 'phone_required') return t('auth.phone_required');
if (smsError.value === 'PHONE_NOT_REGISTERED') return t('auth.phone_not_registered');
if (smsError.value) return mapApiError(smsError.value);
return '';
}
async function submit() {
if (!sessionId.value) {
error.value = t('auth.sms_required');
return;
}
if (!smsCode.value.trim()) {
error.value = t('auth.sms_code_required');
return;
}
if (!password.value || password.value.length < 8) {
error.value = t('auth.password_min_length');
return;
}
if (password.value !== confirmPassword.value) {
error.value = t('auth.password_mismatch');
return;
}
loading.value = true;
error.value = '';
try {
await api.post('/player/auth/forgot-password', {
phone: phone.value.trim(),
countryCode: getPhoneDialFromIso(countryIso.value),
smsCode: smsCode.value.trim(),
sessionId: sessionId.value,
newPassword: password.value,
});
const query: Record<string, string> = { reset: 'success' };
if (typeof route.query.redirect === 'string' && route.query.redirect) {
query.redirect = route.query.redirect;
}
router.push({ path: '/login', query });
} catch (e: unknown) {
const code = (e as { response?: { data?: { error?: string } } })?.response?.data?.error;
error.value = mapApiError(code);
} finally {
loading.value = false;
}
}
function goLogin() {
router.push({
path: '/login',
query: route.query.redirect ? { redirect: route.query.redirect as string } : {},
});
}
</script>
<template>
<div class="login-page" :style="{ backgroundImage: `url(${loginBg})` }">
<div class="login-lang">
<LocaleSwitcher compact />
</div>
<form @submit.prevent="submit" class="login-form ps-gold-frame">
<h2 class="form-title">{{ t('auth.forgot_password_title') }}</h2>
<div class="field">
<label>{{ t('auth.phone') }}</label>
<div class="inline-row">
<PhoneCountrySelect v-model="countryIso" />
<input
v-model="phone"
class="field-input"
type="tel"
required
autocomplete="tel-national"
:placeholder="t('auth.phone_local_placeholder')"
/>
</div>
</div>
<div class="field">
<label>{{ t('auth.sms_code') }}</label>
<div class="inline-row">
<input
v-model="smsCode"
class="field-input"
inputmode="numeric"
maxlength="6"
autocomplete="one-time-code"
:placeholder="t('auth.sms_code_placeholder')"
/>
<button
type="button"
class="btn-secondary"
:disabled="sending || countdown > 0 || !phone.trim()"
@click="sendCode"
>
{{ countdown > 0 ? `${countdown}s` : t('auth.send_sms') }}
</button>
</div>
</div>
<div class="field">
<label>{{ t('auth.password') }}</label>
<input
v-model="password"
class="field-input"
type="password"
required
autocomplete="new-password"
minlength="8"
:placeholder="t('auth.password_placeholder')"
/>
</div>
<div class="field">
<label>{{ t('auth.confirm_password') }}</label>
<input
v-model="confirmPassword"
class="field-input"
type="password"
required
autocomplete="new-password"
minlength="8"
/>
</div>
<p v-if="fieldError()" class="error">{{ fieldError() }}</p>
<button type="submit" class="btn-login btn-gold-outline" :disabled="loading">
{{ t('auth.reset_password_btn') }}
</button>
<button type="button" class="btn-skip" @click="goLogin">
{{ t('auth.back_to_login') }}
</button>
</form>
</div>
</template>
<style scoped>
.login-lang {
position: absolute;
top: max(12px, env(safe-area-inset-top));
right: 16px;
z-index: 2;
}
.login-page {
position: relative;
height: 100%;
min-height: 100dvh;
overflow-y: auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
padding: 30vh 16px calc(10vh + max(20px, env(safe-area-inset-bottom)));
background-color: var(--tertiary);
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
}
.login-form {
width: 100%;
max-width: 320px;
display: flex;
flex-direction: column;
gap: 8px;
padding: 12px;
}
.form-title {
margin: 0 0 2px;
font-size: 16px;
font-weight: 800;
color: #fff;
text-align: center;
}
.field {
display: flex;
flex-direction: column;
gap: 4px;
}
label {
font-size: 10px;
color: var(--text-muted);
font-weight: 600;
letter-spacing: 0.03em;
}
.field-input {
width: 100%;
height: 36px;
padding: 0 10px;
border: 1px solid var(--border);
border-radius: 6px;
background: #0d0d0d;
color: var(--text);
font-size: 14px;
font-family: inherit;
}
.field-input::placeholder {
color: rgba(255, 255, 255, 0.32);
}
.field-input:focus {
outline: none;
border-color: #555;
}
.inline-row {
display: flex;
gap: 6px;
align-items: center;
}
.inline-row .field-input {
flex: 1;
min-width: 0;
}
.btn-secondary {
flex-shrink: 0;
height: 36px;
padding: 0 10px;
border: 1px solid var(--border);
border-radius: 6px;
background: #141414;
color: var(--text);
font-size: 11px;
font-weight: 600;
white-space: nowrap;
cursor: pointer;
}
.btn-secondary:disabled {
opacity: 0.45;
cursor: not-allowed;
}
.btn-login {
margin-top: 2px;
padding: 9px 12px;
border-radius: 6px;
font-size: 14px;
font-weight: 800;
}
.btn-login:disabled {
opacity: 0.45;
cursor: not-allowed;
}
.btn-skip {
margin-top: 2px;
padding: 8px 14px;
border: none;
background: transparent;
color: rgba(255, 255, 255, 0.55);
font-size: 13px;
font-weight: 600;
cursor: pointer;
}
.btn-skip:active {
color: rgba(255, 255, 255, 0.75);
}
.error {
margin: 0;
color: var(--danger);
font-size: 12px;
font-weight: 600;
line-height: 1.3;
}
</style>

View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref } from 'vue';
import { ref, computed } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { defaultPhoneIsoForLocale, getPhoneDialFromIso } from '@thebet365/shared';
@@ -26,6 +26,15 @@ const password = ref('');
const error = ref('');
const loading = ref(false);
const resetSuccess = computed(() => route.query.reset === 'success');
function goForgotPassword() {
router.push({
path: '/forgot-password',
query: route.query.redirect ? { redirect: route.query.redirect as string } : {},
});
}
function switchLoginMode(mode: LoginMode) {
if (loginMode.value === mode) return;
loginMode.value = mode;
@@ -113,11 +122,16 @@ function goRegister() {
<input v-model="password" class="field-input" type="password" required autocomplete="current-password" />
</div>
<button type="button" class="btn-forgot" @click="goForgotPassword">
{{ t('auth.forgot_password') }}
</button>
<button type="button" class="btn-mode-switch" @click="switchLoginMode(loginMode === 'account' ? 'phone' : 'account')">
{{ loginMode === 'account' ? t('auth.login_by_phone') : t('auth.login_by_account') }}
</button>
<RobotVerify ref="captchaRef" />
<p v-if="resetSuccess" class="success">{{ t('auth.reset_success') }}</p>
<p v-if="error" class="error">{{ error }}</p>
<button type="submit" class="btn-login btn-gold-outline" :disabled="loading">
{{ t('auth.login') }}
@@ -218,6 +232,22 @@ label {
cursor: pointer;
}
.btn-forgot {
align-self: flex-end;
margin: -4px 0 0;
padding: 0;
border: none;
background: transparent;
color: rgba(255, 255, 255, 0.5);
font-size: 12px;
font-weight: 600;
cursor: pointer;
}
.btn-forgot:active {
color: rgba(255, 255, 255, 0.75);
}
.btn-mode-switch:active {
color: rgba(240, 216, 117, 0.95);
}
@@ -275,4 +305,12 @@ label {
font-size: 13px;
font-weight: 600;
}
.success {
margin: 0;
color: #6ee7a0;
font-size: 12px;
font-weight: 600;
line-height: 1.4;
}
</style>

View File

@@ -834,6 +834,11 @@ export const API_ERROR_MESSAGES = {
'en-US': 'This phone number is already registered',
'ms-MY': 'Nombor telefon ini sudah didaftarkan',
},
PHONE_NOT_REGISTERED: {
'zh-CN': '该手机号未注册',
'en-US': 'This phone number is not registered',
'ms-MY': 'Nombor telefon ini belum didaftarkan',
},
SMS_CODE_REQUIRED: {
'zh-CN': '请填写短信验证码',
'en-US': 'SMS verification code is required',