Browse Source

增添手机号验证规则

wangyi/feature-20251022162725-启动页登录注册
Ethereal 4 weeks ago
parent
commit
75fc4aaa60
  1. 151
      pages/start/login/login.vue
  2. 61
      pages/start/login/verification.js

151
pages/start/login/login.vue

@ -63,7 +63,7 @@
class="input-field"
type="text"
placeholder="请输入DeepChart ID"
v-model="email"
v-model="deepChartID"
/>
</view>
<view class="input-with-icon">
@ -240,13 +240,16 @@ import countryList from "./list.js";
import footerBar from "../../../components/footerBar-cn";
import uniPopupDialogVue from "../../../uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue";
import uniPopup from "../../../uni_modules/uni-popup/components/uni-popup/uni-popup.vue";
import {verification} from "../login/verification"
const deepChartID = ref("");
const type = ref("member");
const email = ref("");
const password = ref("");
const country = ref("+86");
const phone = ref("");
const agreed = ref(false);
const switchType = ref("Email"); //
const switchType = ref("User"); //
const { safeAreaInsets } = uni.getSystemInfoSync();
const codeBtnText = ref("获取验证码");
const isCodeBtnDisabled = ref(false); //
@ -265,8 +268,7 @@ const countries = ref(
//
const selectedCountry = ref(
countries.value.find((country) => country.short === "CN") ||
countries.value[0]
countries.value.find((country) => country.short === "CN") || countries.value[0]
);
//
@ -277,6 +279,7 @@ function showCountryPicker() {
),
success: function (res) {
selectedCountry.value = countries.value[res.tapIndex];
country.value = selectedCountry.value.code
},
});
}
@ -291,35 +294,43 @@ function goToIndex() {
function switchUser() {
//
switchType.value = "User";
password.value = "";
}
function switchEmail() {
//
switchType.value = "Email";
password.value = "";
}
function switchPhone() {
//
switchType.value = "Phone";
password.value = "";
}
function register() {
if (switchType.value === "User") {
}
if (switchType.value === "Email") {
//
if (!email.value) {
if (!deepChartID.value) {
uni.showToast({
title: "请输入邮箱地址",
title: "请输入用户名",
icon: "none",
});
return;
}
//
console.log("登录:", email.value);
if (!password.value) {
uni.showToast({
title: "请输入密码",
icon: "none",
});
return;
}
}
if (switchType.value === "Phone") {
//
if (!phone.value) {
@ -330,8 +341,49 @@ function register() {
return;
}
if (!password.value) {
uni.showToast({
title: "请输入验证码",
icon: "none",
});
return;
}
const phoneAll = `${country.value}${phone.value}`
console.log("完整手机号"+phoneAll);
if(validatePhoneNumber(country.value,phone.value)){
console.log("登录成功:", phoneAll);
}
//
// console.log(":", phone.value);
}
if (switchType.value === "Email") {
//
if (!email.value) {
uni.showToast({
title: "请输入邮箱地址",
icon: "none",
});
return;
}
if (!password.value) {
uni.showToast({
title: "请输入验证码",
icon: "none",
});
return;
}
//
console.log("登录:", phone.value);
console.log("登录:", email.value);
}
if (!agreed.value) {
@ -341,10 +393,10 @@ function register() {
}
//
uni.showToast({
title: "登录成功",
icon: "success",
});
// uni.showToast({
// title: "",
// icon: "success",
// });
}
//
@ -423,6 +475,28 @@ function onPhoneInput(e) {
}
function sendCode() {
if(switchType.value === "Phone"){
if(!phone.value){
uni.showToast({
title: "请输入手机号",
icon: "none",
});
return;
}
}
if(switchType.value === "Email"){
if(!email.value){
uni.showToast({
title: "请输入邮箱地址",
icon: "none",
});
return;
}
}
//
if (isCodeBtnDisabled.value) return;
@ -471,6 +545,50 @@ function changeCheckbox() {
? "../../../static/icons/Check-one-true.png"
: "../../../static/icons/Check-one-false.png";
}
//
function validatePhoneNumber(countryCode, phoneNumber) {
//
if (!phoneNumber || phoneNumber.trim() === '') {
uni.showToast({
title: "手机号不能为空",
icon: "none",
});
return false;
}
const bool = verification(countryCode,phoneNumber)
console.log("验证是否成功", bool);
//
if (!bool) {
uni.showToast({
title: "手机号格式不正确",
icon: "none",
});
return false;
}
// +715
const cleanNumber = phoneNumber.replace(/^\+/, '');
if (cleanNumber.length < 7 || cleanNumber.length > 15) {
uni.showToast({
title: "手机号长度不正确",
icon: "none",
});
return false;
}
return true;
}
//
</script>
<style scoped>
@ -863,5 +981,4 @@ function changeCheckbox() {
justify-content: center;
line-height: 1; /* 确保文字垂直居中 */
}
</style>

61
pages/start/login/verification.js

@ -0,0 +1,61 @@
function verification(countryCode,phoneNumber) {
switch (countryCode) {
case '+86':
return verificationChina(phoneNumber);
case '+1':
return verificationAmerica(phoneNumber);
case '+65':
return verificationSingapore(phoneNumber);
case '+60':
return verificationMalaysia(phoneNumber);
case '+66':
return verificationThailand(phoneNumber);
case '+852':
return verificationHongKong(phoneNumber);
case '+84':
return verificationVietnam(phoneNumber);
default:
return true;
}
}
function verificationChina(phoneNumber){
const phoneRegex = /^1[3-9]\d{9}$/;
return phoneRegex.test(phoneNumber);
}
function verificationAmerica(phoneNumber){
const phoneRegex = /^[2-9]\d{2}[- ]?\d{4}$/;
return phoneRegex.test(phoneNumber);
}
function verificationSingapore(phoneNumber){
const phoneRegex = /^[89]\d{7}$/;
return phoneRegex.test(phoneNumber);
}
function verificationMalaysia(phoneNumber){
const phoneRegex = /^01\d{8}$/;
return phoneRegex.test(phoneNumber);
}
function verificationHongKong(phoneNumber){
const phoneRegex = /^0[896]\d{8}$/;
return phoneRegex.test(phoneNumber);
}
function verificationThailand(phoneNumber){
const phoneRegex = /^[5-9]\d{7}$/;
return phoneRegex.test(phoneNumber);
}
function verificationVietnam(phoneNumber){
const phoneRegex = /^(0)?[3-9]\d{8}$/;
return phoneRegex.test(phoneNumber);
}
export {verification}
Loading…
Cancel
Save