front:add: InputField component

This commit is contained in:
$(pass /github/name)
2024-09-20 08:30:20 +02:00
parent 00facf8758
commit 3ec32756c8

View File

@@ -17,6 +17,12 @@
/** @type {string} */
export let label = "";
/** @type {string} */
export let otherPasswordValue = "";
/** @type {boolean} */
export let toUpperCase = false;
const dispatch = createEventDispatcher();
/**
@@ -26,7 +32,11 @@
const target = event.target;
if (target instanceof HTMLInputElement) {
const inputValue = target.value;
let inputValue = target.value;
if (toUpperCase) {
inputValue = inputValue.toUpperCase();
target.value = inputValue; // Update the input field value
}
value = inputValue;
// dispatch("input", { name, value: inputValue });
}
@@ -42,16 +52,40 @@
switch (name) {
case "first_name":
case "last_name":
case "address":
case "city":
case "account_holder_name":
case "bank":
return value.trim() ? null : $t("required");
case "birth_date":
case "membership_start_date":
return value.trim() ? null : $t("required_date");
case "email":
return /^\S+@\S+\.\S+$/.test(value) ? null : $t("invalid_email");
case "password":
return !value.trim() || value.length >= 8
case "password2":
if (!value.trim()) {
return null;
}
if (value.length < 8) {
return $t("required_password");
}
if (otherPasswordValue && value !== otherPasswordValue) {
return $t("required_password_match");
}
return null;
case "phone":
return /^\+?[0-9\s()-]{7,}$/.test(value) ? null : $t("invalid_phone");
case "zip_code":
return /^\d{5}$/.test(value) ? null : $t("invalid_zip_code");
case "iban":
return /^[A-Z]{2}\d{2}[A-Z0-9]{1,30}$/.test(value)
? null
: $t("required_password");
// case "password2":
// // Note: This case might need special handling as it depends on another field
// return $t("required_password_match");
: $t("invalid_iban");
case "bic":
return /^[A-Z]{6}[A-Z2-9][A-NP-Z0-9]([A-Z0-9]{3})?$/.test(value)
? null
: $t("invalid_bic");
default:
return null;
}