diff --git a/app/package.json b/app/package.json index f6ca427f5..9b1f9076d 100644 --- a/app/package.json +++ b/app/package.json @@ -1,6 +1,6 @@ { "name": "name-request", - "version": "5.8.5", + "version": "5.8.6", "private": true, "appName": "Name Request UI", "sbcName": "SBC Common Components", diff --git a/app/src/components/dialogs/mras-search-info.vue b/app/src/components/dialogs/mras-search-info.vue index 602bd3b5d..86288960a 100644 --- a/app/src/components/dialogs/mras-search-info.vue +++ b/app/src/components/dialogs/mras-search-info.vue @@ -35,6 +35,7 @@
{{ name ? 'Search' : 'Close' }} @@ -50,6 +51,7 @@ import { Component, Vue } from 'vue-property-decorator' import { Action, Getter } from 'pinia-class' import { useStore } from '@/store' import { ActionBindingIF } from '@/interfaces/store-interfaces' +import { MRAS_MIN_LENGTH, MRAS_MAX_LENGTH } from '@/components/new-request/constants' import NameInput from '@/components/new-request/name-input.vue' import { BAD_REQUEST, NOT_FOUND, SERVICE_UNAVAILABLE } from 'http-status-codes' @@ -64,6 +66,7 @@ export default class MrasSearchInfoDialog extends Vue { @Getter(useStore) getMrasSearchResultCode!: number @Getter(useStore) getName!: string @Getter(useStore) getMrasSearchInfoModalVisible!: boolean + @Getter(useStore) isXproFlow!: boolean @Action(useStore) setMrasSearchInfoModalVisible!: ActionBindingIF @Action(useStore) setName!: ActionBindingIF @@ -125,6 +128,11 @@ export default class MrasSearchInfoDialog extends Vue { return this.getErrors } + get isDisabled (): boolean { + return !!this.name && this.isXproFlow && + (!this.name || this.name.length < MRAS_MIN_LENGTH || this.name.length > MRAS_MAX_LENGTH) + } + async handleSubmit (): Promise { this.showModal = false if (this.name) await this.startAnalyzeName(null) diff --git a/app/src/components/new-request/name-input.vue b/app/src/components/new-request/name-input.vue index b661abe99..aa9760b3f 100644 --- a/app/src/components/new-request/name-input.vue +++ b/app/src/components/new-request/name-input.vue @@ -6,7 +6,7 @@ :error-messages="message" autocomplete="chrome-off" :filled="!isReadOnly" - :rules="(searchValue && isMrasSearch) ? mrasRules : defaultRules" + :rules="getRules" :label="label" :class="{ 'read-only-mode': isReadOnly }" :disabled="isReadOnly" @@ -66,6 +66,18 @@ export default class NameInput extends Vue { this.nameInputComponent = this.$refs['nameInputRef'] } + get getRules (): any[] { + if (this.searchValue) { + if (this.isMrasSearch) { + return this.mrasRules + } + if (this.isXproFlow) { + return this.xproRules + } + } + return this.defaultRules + } + /** The array of validation rules for the MRAS corp num. */ get mrasRules (): any[] { return [ @@ -75,6 +87,13 @@ export default class NameInput extends Vue { ] } + get xproRules (): any[] { + return [ + v => (!v || v.length >= MRAS_MIN_LENGTH) || `Must be at least ${MRAS_MIN_LENGTH} characters`, + v => (!v || v.length <= MRAS_MAX_LENGTH) || `Cannot exceed ${MRAS_MAX_LENGTH} characters` + ] + } + /** Local validator when input is a MRAS corp num. */ get isCorpNumValid (): boolean { if (this.isMrasSearch) return this.nameInputComponent?.valid || false @@ -114,7 +133,12 @@ export default class NameInput extends Vue { } if (this.getErrors.includes('max_length')) { - return ['Please enter a shorter name'] + let maxCharacters = DFLT_MAX_LENGTH + if (this.isXproFlow) { + maxCharacters = MRAS_MAX_LENGTH + } + + return [`Cannot exceed ${maxCharacters} characters`] } const invalidDesignationMsg = checkInvalidDesignation(this.getEntityTypeCd, this.searchValue) diff --git a/app/src/components/new-request/search.vue b/app/src/components/new-request/search.vue index ed7e8930f..6d8dffb48 100644 --- a/app/src/components/new-request/search.vue +++ b/app/src/components/new-request/search.vue @@ -365,7 +365,7 @@ id="search-name-btn" class="px-9" :class="{ 'mobile-btn' : isMobile }" - :disabled="!corpNumValid" + :disabled="isSearchBtnDisabled" @click="handleSubmit(true)" > = MRAS_MIN_LENGTH && name.length <= MRAS_MAX_LENGTH + } + + get isSearchBtnDisabled (): boolean { + return (this.getHasNoCorpNum && !this.isValidXproName) || (!this.getHasNoCorpNum && !this.corpNumValid) + } + /** * If user is authenticated, create draft business and redirect to Dashboard. * If restoration/reinstatement selected, go to business dashboard.