From 5caceb4ae26b28ff84b6a0e12cd4540572535a0f Mon Sep 17 00:00:00 2001 From: Yaodong Yu <2814461814@qq.com> Date: Mon, 27 Feb 2023 20:10:59 +0800 Subject: [PATCH] feat: fix bug that signup country code is undefined (#1590) * feat: fix signup country code is undefined * refactor: valid phone number in CN --- util/validation.go | 2 +- web/src/OrganizationListPage.js | 2 +- web/src/Setting.js | 8 +++++--- web/src/UserEditPage.js | 4 ++-- web/src/auth/SignupPage.js | 23 +++++++++-------------- web/src/backend/UserBackend.js | 3 ++- web/src/common/PhoneNumberInput.js | 9 ++++----- web/src/common/SendCodeInput.js | 6 +++--- 8 files changed, 27 insertions(+), 30 deletions(-) diff --git a/util/validation.go b/util/validation.go index 00aebf60..bcc97ab6 100644 --- a/util/validation.go +++ b/util/validation.go @@ -41,7 +41,7 @@ func IsPhoneValid(phone string, countryCode string) bool { } func IsPhoneAllowInRegin(countryCode string, allowRegions []string) bool { - return !ContainsString(allowRegions, countryCode) + return ContainsString(allowRegions, countryCode) } func GetE164Number(phone string, countryCode string) (string, bool) { diff --git a/web/src/OrganizationListPage.js b/web/src/OrganizationListPage.js index acfba5d4..837c31a8 100644 --- a/web/src/OrganizationListPage.js +++ b/web/src/OrganizationListPage.js @@ -37,7 +37,7 @@ class OrganizationListPage extends BaseListPage { defaultAvatar: `${Setting.StaticBaseUrl}/img/casbin.svg`, defaultApplication: "", tags: [], - languages: ["en", "zh", "es", "fr", "de", "ja", "ko", "ru", "vi"], + languages: Setting.Countries.map(item => item.key), masterPassword: "", enableSoftDeletion: false, isProfilePublic: true, diff --git a/web/src/Setting.js b/web/src/Setting.js index 864546ac..9b46b895 100644 --- a/web/src/Setting.js +++ b/web/src/Setting.js @@ -349,13 +349,15 @@ export function isValidEmail(email) { } export function isValidPhone(phone, countryCode = "") { - if (countryCode !== "") { + if (countryCode !== "" && countryCode !== "CN") { return phoneNumber.isValidPhoneNumber(phone, countryCode); } - // // https://learnku.com/articles/31543, `^s*$` filter empty email individually. + // https://learnku.com/articles/31543, `^s*$` filter empty email individually. + const phoneCnRegex = /^1(3\d|4[5-9]|5[0-35-9]|6[2567]|7[0-8]|8\d|9[0-35-9])\d{8}$/; const phoneRegex = /[0-9]{4,15}$/; - return phoneRegex.test(phone); + + return countryCode === "CN" ? phoneCnRegex.test(phone) : phoneRegex.test(phone); } export function isValidInvoiceTitle(invoiceTitle) { diff --git a/web/src/UserEditPage.js b/web/src/UserEditPage.js index fb2fd3f4..3352397f 100644 --- a/web/src/UserEditPage.js +++ b/web/src/UserEditPage.js @@ -29,7 +29,7 @@ import SelectRegionBox from "./SelectRegionBox"; import WebAuthnCredentialTable from "./WebauthnCredentialTable"; import ManagedAccountTable from "./ManagedAccountTable"; import PropertyTable from "./propertyTable"; -import PhoneNumberInput from "./common/PhoneNumberInput"; +import {PhoneNumberInput} from "./common/PhoneNumberInput"; const {Option} = Select; @@ -311,7 +311,7 @@ class UserEditPage extends React.Component { { this.updateUserField("countryCode", value); }} diff --git a/web/src/auth/SignupPage.js b/web/src/auth/SignupPage.js index 40ff4847..f77be39e 100644 --- a/web/src/auth/SignupPage.js +++ b/web/src/auth/SignupPage.js @@ -26,7 +26,7 @@ import SelectRegionBox from "../SelectRegionBox"; import CustomGithubCorner from "../CustomGithubCorner"; import SelectLanguageBox from "../SelectLanguageBox"; import {withRouter} from "react-router-dom"; -import PhoneNumberInput from "../common/PhoneNumberInput"; +import {PhoneNumberInput} from "../common/PhoneNumberInput"; const formItemLayout = { labelCol: { @@ -82,7 +82,7 @@ class SignupPage extends React.Component { this.form = React.createRef(); } - UNSAFE_componentWillMount() { + componentDidMount() { let applicationName = this.state.applicationName; const oAuthParams = Util.getOAuthGetParameters(); if (oAuthParams !== null) { @@ -98,6 +98,10 @@ class SignupPage extends React.Component { } else { Setting.showMessage("error", `Unknown application name: ${applicationName}`); } + } else { + this.setState({ + countryCode: this.getApplicationObj().organizationObj.countryCodes?.[0], + }); } } @@ -111,6 +115,7 @@ class SignupPage extends React.Component { this.onUpdateApplication(application); this.setState({ application: application, + countryCode: application?.organizationObj.countryCodes?.[0], }); if (application !== null && application !== undefined) { @@ -390,23 +395,12 @@ class SignupPage extends React.Component { required: required, message: i18next.t("signup:Please select your country code!"), }, - { - validator: (_, value) => { - if (this.state.phone !== "" && !Setting.isValidPhone(this.state.phone, this.state.countryCode)) { - this.setState({validPhone: false}); - return Promise.reject(i18next.t("signup:The input is not valid Phone!")); - } - - this.setState({validPhone: true}); - return Promise.resolve(); - }, - }, ]} > {this.setState({countryCode: value});}} countryCodes={this.getApplicationObj().organizationObj.countryCodes} /> @@ -456,6 +450,7 @@ class SignupPage extends React.Component { method={"signup"} onButtonClickArgs={[this.state.phone, "phone", Setting.getApplicationName(application)]} application={application} + countryCode={this.state.countryCode} /> diff --git a/web/src/backend/UserBackend.js b/web/src/backend/UserBackend.js index 1806ea9c..f123f4d4 100644 --- a/web/src/backend/UserBackend.js +++ b/web/src/backend/UserBackend.js @@ -109,12 +109,13 @@ export function setPassword(userOwner, userName, oldPassword, newPassword) { }).then(res => res.json()); } -export function sendCode(checkType, checkId, checkKey, method, dest, type, applicationId, checkUser = "") { +export function sendCode(checkType, checkId, checkKey, method, countryCode, dest, type, applicationId, checkUser = "") { const formData = new FormData(); formData.append("checkType", checkType); formData.append("checkId", checkId); formData.append("checkKey", checkKey); formData.append("method", method); + formData.append("countryCode", countryCode); formData.append("dest", dest); formData.append("type", type); formData.append("applicationId", applicationId); diff --git a/web/src/common/PhoneNumberInput.js b/web/src/common/PhoneNumberInput.js index 8b545f9a..d28e1d85 100644 --- a/web/src/common/PhoneNumberInput.js +++ b/web/src/common/PhoneNumberInput.js @@ -16,9 +16,8 @@ import {Select} from "antd"; import * as Setting from "../Setting"; import React from "react"; -export default function PhoneNumberInput(props) { - const {onChange, style, disabled} = props; - const value = props.value ?? "CN"; +export const PhoneNumberInput = (props) => { + const {onChange, style, disabled, countryCode} = props; const countryCodes = props.countryCodes ?? []; const handleOnChange = (e) => { @@ -31,7 +30,7 @@ export default function PhoneNumberInput(props) { showSearch style={style} disabled={disabled} - value={value} + value={countryCode} dropdownMatchSelectWidth={false} optionLabelProp={"label"} onChange={handleOnChange} @@ -42,4 +41,4 @@ export default function PhoneNumberInput(props) { } ); -} +}; diff --git a/web/src/common/SendCodeInput.js b/web/src/common/SendCodeInput.js index d95bac37..88f2f6f3 100644 --- a/web/src/common/SendCodeInput.js +++ b/web/src/common/SendCodeInput.js @@ -22,7 +22,7 @@ import {CaptchaWidget} from "./CaptchaWidget"; const {Search} = Input; export const SendCodeInput = (props) => { - const {disabled, textBefore, onChange, onButtonClickArgs, application, method} = props; + const {disabled, textBefore, onChange, onButtonClickArgs, application, method, countryCode} = props; const [visible, setVisible] = React.useState(false); const [key, setKey] = React.useState(""); const [captchaImg, setCaptchaImg] = React.useState(""); @@ -53,7 +53,7 @@ export const SendCodeInput = (props) => { const handleOk = () => { setVisible(false); setButtonLoading(true); - UserBackend.sendCode(checkType, checkId, key, method, ...onButtonClickArgs).then(res => { + UserBackend.sendCode(checkType, checkId, key, method, countryCode, ...onButtonClickArgs).then(res => { setKey(""); setButtonLoading(false); if (res) { @@ -70,7 +70,7 @@ export const SendCodeInput = (props) => { const loadCaptcha = () => { UserBackend.getCaptcha(application.owner, application.name, false).then(res => { if (res.type === "none") { - UserBackend.sendCode("none", "", "", method, ...onButtonClickArgs).then(res => { + UserBackend.sendCode("none", "", "", method, countryCode, ...onButtonClickArgs).then(res => { if (res) { handleCountDown(60); }