diff --git a/src/pages/CscPageCustomerPhonebookAdd.vue b/src/pages/CscPageCustomerPhonebookAdd.vue index b6c268bd..f3b4efae 100644 --- a/src/pages/CscPageCustomerPhonebookAdd.vue +++ b/src/pages/CscPageCustomerPhonebookAdd.vue @@ -43,7 +43,7 @@ :label="$t('Number')" :error="numberError" :error-message="numberErrorMessage" - @update:model-value="v$.formData.number.$touch()" + @update:model-value="numberUpdated()" /> @@ -58,6 +58,7 @@ import useValidate from '@vuelidate/core' import CscPageSticky from 'components/CscPageSticky' +import { showGlobalError } from 'src/helpers/ui' import { mapWaitingActions } from 'vue-wait' import { required } from 'vuelidate/lib/validators' export default { @@ -118,6 +120,22 @@ export default { this.$router.push('/user/pbx-configuration/customer-phonebook/') this.$emit('cancel') }, + disableSaveButton () { + return this.v$.formData.$invalid + }, + numberUpdated () { + this.v$.formData.number.$touch() + const errorsTab = this.v$.formData.number.$errors + if (errorsTab && errorsTab.length > 0 && errorsTab[0].$validator === 'required') { + this.numberErrorMessage = this.$t('{field} is required', { + field: this.$t('Number') + }) + this.numberError = true + } else { + this.numberErrorMessage = '' + this.numberError = false + } + }, async confirm () { try { await this.createPhonebookCustomer(this.formData) @@ -127,8 +145,7 @@ export default { this.numberError = true this.numberErrorMessage = this.$t('This number is already in use.') } else { - // eslint-disable-next-line no-console - console.error('An error occurred:', error) + showGlobalError(this.$t('An error occurred:', error.response.data.message)) } } } diff --git a/src/pages/CscPageSubscriberPhonebookAdd.vue b/src/pages/CscPageSubscriberPhonebookAdd.vue index 34ef6438..fb430098 100644 --- a/src/pages/CscPageSubscriberPhonebookAdd.vue +++ b/src/pages/CscPageSubscriberPhonebookAdd.vue @@ -41,9 +41,9 @@ import useValidate from '@vuelidate/core' import CscPageSticky from 'components/CscPageSticky' +import { showGlobalError } from 'src/helpers/ui' import { mapWaitingActions } from 'vue-wait' import { required } from 'vuelidate/lib/validators' export default { @@ -92,7 +94,9 @@ export default { data () { return { formData: this.getDefaultFormData(), - v$: useValidate() + v$: useValidate(), + numberErrorMessage: '', + numberError: false } }, computed: { @@ -104,15 +108,6 @@ export default { }) } return '' - }, - numberErrorMessage () { - const errorsTab = this.v$.formData.number.$errors - if (errorsTab && errorsTab.length > 0 && errorsTab[0].$validator === 'required') { - return this.$t('{field} is required', { - field: this.$t('Number') - }) - } - return '' } }, methods: { @@ -126,13 +121,38 @@ export default { shared: false } }, + disableSaveButton () { + return this.v$.formData.$invalid + }, + numberUpdated () { + this.v$.formData.number.$touch() + const errorsTab = this.v$.formData.number.$errors + if (errorsTab && errorsTab.length > 0 && errorsTab[0].$validator === 'required') { + this.numberErrorMessage = this.$t('{field} is required', { + field: this.$t('Number') + }) + this.numberError = true + } else { + this.numberErrorMessage = '' + this.numberError = false + } + }, cancel () { this.$router.push('/user/subscriber-phonebook/') this.$emit('cancel') }, async confirm () { - await this.createPhonebookSubscriber(this.formData) - await this.$router.push('/user/subscriber-phonebook/') + try { + await this.createPhonebookSubscriber(this.formData) + await this.$router.push('/user/subscriber-phonebook/') + } catch (error) { + if (error.response && error.response.status === 422) { + this.numberError = true + this.numberErrorMessage = this.$t('This number is already in use.') + } else { + showGlobalError(this.$t('An error occurred:', error.response.data.message)) + } + } } } }