Skip to content

Commit

Permalink
10885 populate selected business from lookup (#406)
Browse files Browse the repository at this point in the history
  • Loading branch information
@vysakh-menon-aot
vysakh-menon-aot authored Jun 10, 2022
1 parent d58dea8 commit 7867fdb
Show file tree
Hide file tree
Showing 10 changed files with 181 additions and 97 deletions.
4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "business-create-ui",
"version": "4.0.14",
"version": "4.0.15",
"private": true,
"appName": "Create UI",
"sbcName": "SBC Common Components",
Expand Down
78 changes: 21 additions & 57 deletions src/components/Registration/BusinessLookup.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
autocomplete="chrome-off"
class="mt-5"
append-icon=""
menu-props="{ maxHeight: 380 }"
:name="Math.random()"
:rules="showErrors ? businessLookupRules: []"
:items="searchResults"
Expand All @@ -26,7 +27,7 @@
</v-list-item>
</template>
<template v-slot:item="{ item }">
<v-row class="business-lookup-result">
<v-row class="business-lookup-result pt-1">
<v-col cols="2">
<div class="result-identifier">{{item.identifier}}</div>
</v-col>
Expand All @@ -39,56 +40,34 @@
</v-autocomplete>
</div>

<div v-if="state === States.SUMMARY && haveBusiness"
class="summary-block d-flex justify-space-between align-center">
<div v-if="state === States.SUMMARY && haveBusiness" class="summary-block mt-5">
<v-row no-gutters>
<v-col cols="9">
<v-row no-gutters>
<v-col cols="12" sm="3">
<label>Name</label>
</v-col>
<v-col cols="12" sm="9">
<v-col cols="12">
<label>Name: </label>
<span>{{businessName}}</span>
</v-col>
</v-row>
<v-row no-gutters>
<v-col cols="12" sm="3">
<label>Incorporation Number</label>
</v-col>
<v-col cols="12" sm="9">
<v-row no-gutters class="mt-1">
<v-col cols="12">
<label>Incorporation Number: </label>
<span>{{identifier}}</span>
</v-col>
</v-row>
<v-row no-gutters>
<v-col cols="12" sm="3">
<label>Business Number</label>
</v-col>
<v-col cols="12" sm="9">
<v-row no-gutters class="mt-1">
<v-col cols="12">
<label>Business Number: </label>
<span>{{businessNumber}}</span>
</v-col>
</v-row>
</v-col>
<v-col cols="3">
<v-btn v-if="!hasBusinessLookupChanges" text color="primary" id="bl-change-btn" @click="onChangeClicked()">
<v-icon small>mdi-pencil</v-icon>
<span>Change</span>
</v-btn>

<div v-else id="bl-more-actions">
<div id="bl-more-actions">
<v-btn text color="primary" id="bl-undo-btn" @click="emitUndo()">
<v-icon small>mdi-undo</v-icon>
<span>Undo</span>
</v-btn>
<v-menu offset-y left nudge-bottom="4" v-model="dropdown">
<template v-slot:activator="{ on }">
<v-btn text small color="primary" id="bl-menu-btn" v-on="on">
<v-icon>{{dropdown ? 'mdi-menu-up' : 'mdi-menu-down'}}</v-icon>
</v-btn>
</template>
<v-btn text color="primary" id="bl-more-changes-btn" class="py-5"
@click="onChangeClicked(); dropdown = false">
<v-icon small color="primary">mdi-pencil</v-icon>Change</v-btn>
</v-menu>
</div>
</v-col>
</v-row>
Expand Down Expand Up @@ -129,15 +108,14 @@ export default class BusinessLookup extends Vue {
// enum for template
readonly States = States
// local variables
private state = States.INITIAL
private searchField = ''
private searchResults: Array<BusinessLookupResultIF> = []
private selectedBusiness: BusinessLookupResultIF = null
/** V-model for dropdown menu. */
private dropdown: boolean = null
/** The text field validation rules. */
readonly businessLookupRules: Array<Function> = [
v => !!v || 'Business is required'
Expand All @@ -162,6 +140,7 @@ export default class BusinessLookup extends Vue {
get isFormValid (): boolean {
return (this.haveBusiness && this.state === States.SUMMARY)
}
/** Called when searchField property has changed. */
@Watch('searchField')
@Debounce(600)
Expand All @@ -188,20 +167,10 @@ export default class BusinessLookup extends Vue {
name: result.name,
bn: result.bn
})
this.selectedBusiness = null
}
}
/** Called when user has clicked the Cancel button. */
protected onCancelClicked (): void {
// if we have stored business data then display summary
// otherwise go back to INITIAL state
this.state = this.haveBusiness ? States.SUMMARY : States.INITIAL
}
/** Called when user has clicked the Change button. */
protected onChangeClicked (): void {
// set search to current identifier
this.searchField = this.identifier
this.state = States.INITIAL
}
/** Called when haveBusiness property (which is based on this component's props) has changed. */
@Watch('haveBusiness', { immediate: true })
private onHaveBusinessChanged (val: boolean): void {
Expand Down Expand Up @@ -243,24 +212,19 @@ export default class BusinessLookup extends Vue {
cursor: pointer;
font-size: $px-16;
}
#bl-change-btn {
margin-right: -14px;
}
#bl-more-actions {
margin-right: -14px;
white-space: nowrap;
#bl-undo-btn {
min-width: unset;
border-right: 1px solid $gray1;
float: right;
}
}
#result-list {
background-color: $gray1;
max-height: 650px;
overflow-y: auto;
}
.summary-block {
margin-top: -6px; // compensate for Change button pushing this col down
label {
font-weight: bold;
color: $gray9;
}
}
// Veutify overrides
::v-deep {
Expand Down
75 changes: 50 additions & 25 deletions src/components/Registration/RegAddEditOrgPerson.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,11 +88,11 @@
<!-- Business or Corporation -->
<template v-if="isOrg">
<!-- Business or Corporation Unregistered in B.C. -->
<article v-if="isManualAdd" class="manual-add-article">
<article v-if="!orgPerson.isLookupBusiness" class="manual-add-article">
<label>
{{ isNaN(activeIndex) ? 'Add' : ' Edit' }} Business or Corporation Unregistered in B.C.
</label>
<a class="lookup-toggle float-right" @click="isManualAdd = false">
<a class="lookup-toggle float-right" @click="swapIsLookupBusiness()">
Business or Corporation Look Up
</a>

Expand Down Expand Up @@ -149,30 +149,59 @@
<!-- Business or Corporation Look up -->
<article v-else class="business-lookup-article">
<label>Business or Corporation Look up</label>
<a class="lookup-toggle float-right" @click="isManualAdd = true">
<a class="lookup-toggle float-right" @click="swapIsLookupBusiness()">
Business or Corporation is Unregistered in B.C.
</a>

<p class="mt-6 mb-0">
To add a registered B.C. business or corporation as
{{ isProprietor ? 'the Proprietor' : 'a partner' }}, enter the name or
incorporation number.
</p>

<p class="mt-6 mb-0">
If you are adding a company that is not legally required to register in B.C. such as
a bank or a railway, use the manual entry form. All other types of business cannot
be {{ isProprietor ? 'the Proprietor' : 'a partner' }}.
</p>

<HelpContactUs class="mt-6" />
<div class="mt-6" v-if="hasBusinessSelectedFromLookup">
<v-card
outlined class="message-box rounded-0"
>
<p>
<strong>Important:</strong> If the addresses shown below are out of date, you
may update them here. The updates are applicable only to this registration.
</p>
</v-card>
</div>
<div v-else>
<p class="mt-6 mb-0">
To add a registered B.C. business or corporation as
{{ isProprietor ? 'the Proprietor' : 'a partner' }}, enter the name or
incorporation number.
</p>
<p class="mt-6 mb-0">
If you are adding a company that is not legally required to register in B.C. such as
a bank or a railway, use the manual entry form. All other types of business cannot
be {{ isProprietor ? 'the Proprietor' : 'a partner' }}.
</p>
<HelpContactUs class="mt-6" />
</div>

<BusinessLookup
:showErrors="false"
:businessLookup="EmptyBusinessLookup"
:showErrors="enableRules"
:businessLookup="inProgressBusinessLookup"
:BusinessLookupServices="BusinessLookupServices"
:hasBusinessLookupChanges="true"
@setBusiness="updateBusinessDetails($event)"
@undoBusiness="resetBusinessDetails($event)"
/>
<div v-if="isProprietor && orgPerson.showOptionalBN">
<p class="mt-4 mb-0">
If an existing business number for this business or corporation is available,
enter it below. We will contact the Canada Revenue Agency and ask them to link it to
this registration.
</p>
<HelpBusinessNumber class="mt-4" />
<!-- Business Number (org proprietors only) -->
<v-text-field
filled
persistent-hint
class="item business-number mt-8 mb-n2"
label="Business Number (Optional)"
hint="First 9 digits of the CRA Business Number"
v-model="orgPerson.officer.businessNumber"
v-mask="['#########']"
:rules="enableRules ? Rules.BusinessNumberRules : []"
/>
</div>
</article>
</template>

Expand Down Expand Up @@ -331,7 +360,6 @@ import HelpBusinessNumber from '@/components/Registration/HelpBusinessNumber.vue
import HelpContactUs from '@/components/Registration/HelpContactUs.vue'
import { AddEditOrgPersonMixin } from '@/mixins'
import { Rules } from '@/rules'
import { EmptyBusinessLookup } from '@/interfaces'
import { BusinessLookupServices } from '@/services'
/** This is a sub-component of PeopleAndRoles. */
Expand All @@ -351,9 +379,6 @@ export default class RegAddEditOrgPerson extends Mixins(AddEditOrgPersonMixin) {
// NB: see mixin for common properties, methods, etc.
//
// local property
protected isManualAdd = false
/** The validation rules for the Organization Name. */
readonly OrgNameRules: Array<Function> = [
v => !!v?.trim() || 'Business or corporation name is required',
Expand All @@ -362,8 +387,8 @@ export default class RegAddEditOrgPerson extends Mixins(AddEditOrgPersonMixin) {
// Rules for template
readonly Rules = Rules
readonly BusinessLookupServices = BusinessLookupServices
readonly EmptyBusinessLookup = EmptyBusinessLookup
}
</script>

Expand Down
5 changes: 5 additions & 0 deletions src/components/Registration/RegPeopleAndRoles.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -236,6 +236,11 @@ export default class RegPeopleAndRoles extends Mixins(PeopleRolesMixin) {
this.currentOrgPerson.deliveryAddress = cloneDeep(this.currentOrgPerson.mailingAddress)
}
if (isOrganization) {
this.currentOrgPerson.isLookupBusiness = true
this.currentOrgPerson.showOptionalBN = false
}
this.activeIndex = NaN // new org/person
this.showOrgPersonForm = true
}
Expand Down
3 changes: 3 additions & 0 deletions src/interfaces/stepper-interfaces/AddPeopleAndRole/org-person-interface.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ export interface OfficerIF {
organizationName: string
email?: string
businessNumber?: string // SP proprietors and GP partners only
identifier?: string // SP proprietors and GP partners only
}

export interface OrgPersonIF {
Expand All @@ -19,6 +20,8 @@ export interface OrgPersonIF {
deliveryAddress?: AddressIF
inheritMailingAddress?: boolean // for UI use only
confirmBusiness?: boolean // SP proprietors and GP partners only // for UI use only
isLookupBusiness?: boolean // SP proprietors and GP partners only // for UI use only
showOptionalBN?: boolean // SP proprietors and GP partners only // for UI use only
}

export const EmptyOfficer: OfficerIF = {
Expand Down
Loading

0 comments on commit 7867fdb

Please sign in to comment.