diff options
| author | Surya Venkatesan <suryav@ami.com> | 2024-08-01 10:10:20 +0300 |
|---|---|---|
| committer | Surya Venkatesan <suryav@ami.com> | 2024-08-29 16:55:35 +0300 |
| commit | 421273fc9c7136c7f9794bcd7152b6419358ea3d (patch) | |
| tree | 3dfc7dcee48f8f43dd738414324a7ab1182ef795 | |
| parent | 7bf1b408b1601b1d8d98f701182a65c98b67411b (diff) | |
| download | webui-vue-421273fc9c7136c7f9794bcd7152b6419358ea3d.tar.xz | |
Add user validation in user management page
helpers and sameAs validations are not working in vue3 so the helpers
and sameAS are imported from vuelidate/lib/validators. Invalid
validation field like required are not show so the if condition for
invalid feedback alert field changed. Add user and delete user are
working in the user management page.
Change-Id: I0133e02357048ffbc6206382b2a0a5c162e2384d
Signed-off-by: Surya Venkatesan <suryav@ami.com>
| -rw-r--r-- | src/views/SecurityAndAccess/UserManagement/ModalUser.vue | 24 |
1 files changed, 14 insertions, 10 deletions
diff --git a/src/views/SecurityAndAccess/UserManagement/ModalUser.vue b/src/views/SecurityAndAccess/UserManagement/ModalUser.vue index 44ab516d..3b334871 100644 --- a/src/views/SecurityAndAccess/UserManagement/ModalUser.vue +++ b/src/views/SecurityAndAccess/UserManagement/ModalUser.vue @@ -85,15 +85,15 @@ @input="v$.form.username.$touch()" /> <b-form-invalid-feedback role="alert"> - <template v-if="!v$.form.username.required"> + <template v-if="v$.form.username.required.$invalid"> {{ $t('global.form.fieldRequired') }} </template> - <template v-else-if="!v$.form.username.maxLength"> + <template v-else-if="v$.form.username.maxLength.$invalid"> {{ $t('global.form.lengthMustBeBetween', { min: 1, max: 16 }) }} </template> - <template v-else-if="!v$.form.username.pattern"> + <template v-else-if="v$.form.username.pattern.$invalid"> {{ $t('global.form.invalidFormat') }} </template> </b-form-invalid-feedback> @@ -118,7 +118,7 @@ </template> </b-form-select> <b-form-invalid-feedback role="alert"> - <template v-if="!v$.form.privilege.required"> + <template v-if="v$.form.privilege.required.$invalid"> {{ $t('global.form.fieldRequired') }} </template> </b-form-invalid-feedback> @@ -149,12 +149,13 @@ @input="v$.form.password.$touch()" /> <b-form-invalid-feedback role="alert"> - <template v-if="!v$.form.password.required"> + <template v-if="v$.form.password.required.$invalid"> {{ $t('global.form.fieldRequired') }} </template> <template v-if=" - !v$.form.password.minLength || !v$.form.password.maxLength + v$.form.password.minLength.$invalid || + v$.form.password.maxLength.$invalid " > {{ @@ -182,11 +183,15 @@ @input="v$.form.passwordConfirmation.$touch()" /> <b-form-invalid-feedback role="alert"> - <template v-if="!v$.form.passwordConfirmation.required"> + <template + v-if="v$.form.passwordConfirmation.required.$invalid" + > {{ $t('global.form.fieldRequired') }} </template> <template - v-else-if="!v$.form.passwordConfirmation.sameAsPassword" + v-else-if=" + v$.form.passwordConfirmation.sameAsPassword.$invalid + " > {{ $t('pageUserManagement.modal.passwordsDoNotMatch') }} </template> @@ -228,10 +233,9 @@ import { required, maxLength, minLength, - sameAs, - helpers, requiredIf, } from '@vuelidate/validators'; +import { helpers, sameAs } from 'vuelidate/lib/validators'; import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; import { useVuelidate } from '@vuelidate/core'; |