diff --git a/resources/assets/vue/components/accounts/forms/RegistrationFormComponent.vue b/resources/assets/vue/components/accounts/forms/RegistrationFormComponent.vue
index 9a9d492c..48e4df78 100644
--- a/resources/assets/vue/components/accounts/forms/RegistrationFormComponent.vue
+++ b/resources/assets/vue/components/accounts/forms/RegistrationFormComponent.vue
@@ -201,7 +201,7 @@ const rules = computed(() => ({
},
password_confirmation: {
required: requiredIf(step.value === 2),
- sameAs: sameAs(parameters.password)
+ sameAs: sameAs(parameters.password, 'password')
}
}
}));
diff --git a/resources/assets/vue/components/general/elements/ValidationErrorComponent.vue b/resources/assets/vue/components/general/elements/ValidationErrorComponent.vue
index 7a6da563..6e2cef03 100644
--- a/resources/assets/vue/components/general/elements/ValidationErrorComponent.vue
+++ b/resources/assets/vue/components/general/elements/ValidationErrorComponent.vue
@@ -2,7 +2,7 @@
- {{ getErrorMessage(name) }}
+ {{ getErrorMessage({ ...rule, $validator: name as unknown as string }) }}
@@ -15,6 +15,12 @@ interface Props {
const props = defineProps();
+interface ValidationErrorItem {
+ $validator: string;
+ $invalid: boolean;
+ $params?: Record;
+}
+
const errorMessages: Record = {
required: 'this field is required',
email: 'enter a valid email address',
@@ -28,7 +34,23 @@ const errorMessages: Record = {
numeric: 'this field must be numeric'
};
-const getErrorMessage = (name: string | number) => {
- return errorMessages[name as string] || 'invalid field';
+const getErrorMessage = (error: ValidationErrorItem): string => {
+ if (!error) return 'invalid value';
+
+ const validatorName = error.$validator;
+ const params = error.$params || {};
+
+ if (validatorName === 'minLength') return `${errorMessages.minLength} ${params.min} characters`;
+ if (validatorName === 'maxLength') return `${errorMessages.maxLength} ${params.max} characters`;
+ if (validatorName === 'sameAs' || validatorName === 'sameAsPassword') {
+ let fieldName = params.otherName || params.eq || 'password';
+ if (fieldName === 'password') fieldName = 'password';
+ return `${errorMessages.sameAs} ${fieldName} field`;
+ }
+ if (validatorName === 'minValue') return `${errorMessages.minValue} ${params.min}`;
+ if (validatorName === 'maxValue') return `${errorMessages.maxValue} ${params.max}`;
+
+ return errorMessages[validatorName] || 'invalid value';
};
+
diff --git a/resources/assets/vue/components/user/form/SystemFormComponent.vue b/resources/assets/vue/components/user/form/SystemFormComponent.vue
index 476e6ff1..b5a348a2 100644
--- a/resources/assets/vue/components/user/form/SystemFormComponent.vue
+++ b/resources/assets/vue/components/user/form/SystemFormComponent.vue
@@ -111,7 +111,7 @@ const rules = computed(() => ({
password: { required, minLength: minLength(6) },
password_confirmation: {
required,
- sameAsPassword: sameAs(() => parameters.value.password)
+ sameAsPassword: sameAs(() => parameters.value.password, 'password')
},
is_internal: {}
}
diff --git a/resources/assets/vue/components/user/form/UserFormComponent.vue b/resources/assets/vue/components/user/form/UserFormComponent.vue
index 1cce9b53..cb7a6685 100644
--- a/resources/assets/vue/components/user/form/UserFormComponent.vue
+++ b/resources/assets/vue/components/user/form/UserFormComponent.vue
@@ -105,7 +105,7 @@ const rules = computed(() => ({
password: { required, minLength: minLength(6) },
password_confirmation: {
required,
- sameAsPassword: sameAs(passwordRef)
+ sameAsPassword: sameAs(passwordRef, 'password')
}
}
}));