lfk/selfservice
3
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

feat: improve phone number registration

Browse Source
This commit is contained in:
Philipp Dormann 2025-03-28 17:38:13 +01:00
parent e1a87eda4a
commit e14a6d6329
Signed by: philipp
GPG Key ID: 3BB9ADD52DCA4314
3 changed files with 36 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/locales/de.json
View File

@ -19,6 +19,7 @@
"e_mail_des_sponsors": "E-Mail des Sponsors",
"error_requesting_the_login_link": "Fehler beim Anfordern des Login-Links...",
"first_lap": "👏 erste Runde",
"hinweis": "Hinweis:",
"i_accept": "Ich habe die ",
"i_accept_end": "gelesen und akzeptiert.",
"if_you_are_the_system_administrator_please_refer_to_the_official_product_documentation_readme_for_configuration_guidance": "Wenn Sie der Systemadministrator sind, finden Sie Konfigurationsanweisungen in der offiziellen Produktdokumentation / README.",
@ -38,7 +39,7 @@
"not_registered_yet": "Noch nicht registriert?",
"organization": "Organisation",
"ort": "Ort",
"phone_number": "Telefonnummer (international formatiert)",
"phone_number": "Telefonnummer",
"please_provide_a_valid_zipcode": "Bitte geben Sie eine gültige Postleitzahl an...",
"please_provide_valid_mail": "Bitte geben Sie eine gültige E-Mail Adresse an",
"plz": "PLZ",
@ -53,6 +54,7 @@
},
"register_now": "Jetzt registrieren!",
"register_now_small": "Jetzt registrieren",
"registration_local_phone_nr": "Wenn Sie eine Telefonnummer ohne Vorwahl angeben, wird Sie als deutsche Telefonnummer gewertet",
"registration_running": "Registrierung läuft...",
"registrationcode": "Registrierungscode",
"registrieren": "Registrieren",

4
src/locales/en.json
View File

@ -19,6 +19,7 @@
"e_mail_des_sponsors": "E-Mail of the Sponsor",
"error_requesting_the_login_link": "Error requesting the login link...",
"first_lap": "👏 first lap",
"hinweis": "Note:",
"i_accept": "I have read and accepted the ",
"i_accept_end": "",
"if_you_are_the_system_administrator_please_refer_to_the_official_product_documentation_readme_for_configuration_guidance": "If you are the system administrator, please refer to the official product documentation/ README for configuration guidance.",
@ -38,7 +39,7 @@
"not_registered_yet": "Not registered yet?",
"organization": "Organization",
"ort": "City",
"phone_number": "Phone Number (international format)",
"phone_number": "Phone Number",
"please_provide_a_valid_zipcode": "Please provide a valid zipcode...",
"please_provide_valid_mail": "Please provide a valid mail address.",
"plz": "zipcode",
@ -53,6 +54,7 @@
},
"register_now": "Register now!",
"register_now_small": "Register now",
"registration_local_phone_nr": "If you enter a phone number without an country code, it will be treated as a German phone number",
"registration_running": "registration is running...",
"registrationcode": "Registration Code",
"registrieren": "Register Now",

46
src/views/Register.vue
View File

@ -51,7 +51,7 @@
{{ $t('buergerlauf') }}
</p>
<div class="mt-4">
<label for="first_name" class="block font-medium">
<label for="first_name" class="block font-medium mt-2">
{{ $t("vorname") }}
<span class="font-bold">*</span>
</label>
@ -73,7 +73,7 @@
p-2
" />
<!-- -->
<label for="last_name" class="block font-medium">
<label for="last_name" class="block font-medium mt-2">
{{ $t("nachname") }}
<span class="font-bold">*</span>
</label>
@ -95,7 +95,7 @@
p-2
" />
<!-- -->
<label for="email_address" class="block font-medium">
<label for="email_address" class="block font-medium mt-2">
{{ $t("e_mail_adress") }}
<span class="font-bold">*</span>
</label>
@ -120,9 +120,10 @@
{{ $t("please_provide_valid_mail") }}
</p>
<!-- -->
<label for="phone" class="select-none block font-medium">{{
<label for="phone" class="block font-medium mt-2">{{
$t("phone_number")
}}</label>
<span class="leading-0"><b>{{ $t('hinweis') }}</b>{{ " " }}{{ $t('registration_local_phone_nr') }}</span>
<input v-model="userdetails.phone" name="phone" id="phone" autocomplete="off"
:placeholder="[[$t('phone_number')]]" type="text" :class="{
'border-red-500':
@ -160,7 +161,7 @@
</div>
<div v-if="provide_address === true" class="col-span-6">
<div class="col-span-6">
<label for="street" class="block font-medium">
<label for="street" class="block font-medium mt-2">
{{ $t("strasse") }}
<span class="font-bold">*</span>
</label>
@ -183,7 +184,7 @@
" />
</div>
<div class="col-span-6">
<label for="address2" class="block font-medium">{{
<label for="address2" class="block font-medium mt-2">{{
$t("apartment_suite_etc")
}}</label>
<input v-model="userdetails.address.address2" type="text" name="address2"
@ -202,7 +203,7 @@
" />
</div>
<div class="col-span-6 sm:col-span-6 lg:col-span-2">
<label for="city" class="block font-medium">
<label for="city" class="block font-medium mt-2">
{{ $t("ort") }}
<span class="font-bold">*</span>
</label>
@ -225,7 +226,7 @@
" />
</div>
<div class="col-span-6 sm:col-span-3 lg:col-span-2">
<label for="postal_code" class="block font-medium">
<label for="postal_code" class="block font-medium mt-2">
{{ $t("plz") }}
<span class="font-bold">*</span>
</label>
@ -348,17 +349,30 @@ let userdetails = ref({
phone: "",
address: { street: "", address2: "", city: "", zipcode: "" },
});
function formatPhoneNumber(phoneNumber, countryCode = "+49") {
// Remove all non-digit characters
const cleanedNumber = phoneNumber.replace(/\D/g, "");
// Check if the number starts with the country code
if (cleanedNumber.startsWith(countryCode.replace("+", ""))) {
return "+" + cleanedNumber; // already international
}
// Check if the number starts with 0
if (cleanedNumber.startsWith("0")) {
return countryCode + cleanedNumber.slice(1);
}
// If it doesn't start with 0 or the country code, assume it's a local number.
// In this case, prepend the country code.
return countryCode + cleanedNumber;
}
function isPhoneOkay() {
if (userdetails.value.phone === "") {
return true
}
if (userdetails.value.phone.includes(" ")) {
return false
}
if (!userdetails.value.phone.includes("+")) {
return false
}
if (isMobilePhone(userdetails.value.phone)) {
const formattedNumber = formatPhoneNumber(userdetails.value.phone)
if (isMobilePhone(formattedNumber)) {
return true
}
return false
@ -400,7 +414,7 @@ function login() {
address: {},
};
if (userdetails.value.phone !== "") {
postdata.phone = userdetails.value.phone
postdata.phone = formatPhoneNumber(userdetails.value.phone)
}
if (provide_address.value === true) {
postdata.address = {