diff --git a/src/layouts/insurance-company/insurance-company.vue b/src/layouts/insurance-company/insurance-company.vue
index eb203ace2..e880b1534 100644
--- a/src/layouts/insurance-company/insurance-company.vue
+++ b/src/layouts/insurance-company/insurance-company.vue
@@ -41,8 +41,6 @@ import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper";
import { storeActions } from "@/constants/store-actions";
-import { errorMessages } from "@/constants/error-messages";
-import { required, regex } from "@/helpers/validation-rules";
import { Form, defineRule } from "vee-validate";
import baseMixin from "@/mixins/base-mixin.js";
import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
@@ -50,19 +48,21 @@ import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigat
import store from "@/store";
import $ from "jquery";
-// DEFINE VALIDATION RULES
-defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
-defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
-defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
-defineRule(
- "email-address-format",
- regex(
- /^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9-]+)\.([a-zA-Z]{2,})$/,
- errorMessages.EMAIL_ADDRESS_FORMAT
- )
-);
-defineRule("vin-required", required(errorMessages.VIN_REQUIRED));
-defineRule("vin-format", regex(/^[a-hA-Hj-nJ-NpPr-zR-Z0-9]{17}$/, errorMessages.VIN_FORMAT));
+// MAPPNG
+const termMapping = [
+ {
+ term: "1ST",
+ altTerm: "FIRST",
+ },
+ {
+ term: "FIRST",
+ altTerm: "1ST",
+ },
+ {
+ term: "AAA",
+ altTerm: "American",
+ },
+];
export default {
name: "insurance-company",
@@ -88,31 +88,55 @@ export default {
];
const resultMap = await settleAllPromises(promiseResultMap);
+
+ const searchableInsuranceCompanyList = resultMap.insuranceCompanyList.map(
+ (insuranceCompany) => {
+ insuranceCompany.altTerms = "";
+
+ termMapping.forEach((matchingTerm) => {
+ if (
+ insuranceCompany.accountName
+ .toUpperCase()
+ .includes(matchingTerm.term.toUpperCase())
+ ) {
+ insuranceCompany.altTerms =
+ insuranceCompany.altTerms + matchingTerm.altTerm?.toUpperCase() + " ";
+ }
+ });
+
+ return insuranceCompany;
+ }
+ );
+
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
- vm.insuranceCompanyList = resultMap.insuranceCompanyList;
+ vm.originalList = resultMap.insuranceCompanyList;
+ vm.searchableInsuranceCompanyList = searchableInsuranceCompanyList;
});
},
data() {
return {
- insuranceCompanyList: [],
- selectedParentAccount: "",
+ searchableInsuranceCompanyList: [],
+ originalList: [],
};
},
- computed: {
- insuranceCompanyListTags() {
- return this.insuranceCompanyList.map((item) => {
- return item.accountName;
- });
- },
- },
methods: {
arePagePrerequisitesValid() {
return store.getters.vehicle.carId !== null;
},
- handleAutocompleteSelect(value) {
- this.selectedQuery = value;
+ findMatches(request, response) {
+ const matches = [];
+ const term = request?.term?.toUpperCase();
+ this.originalList.forEach((company, index) => {
+ if (
+ company.accountName.indexOf(term) !== -1 ||
+ company.altTerms.indexOf(term) !== -1
+ ) {
+ matches.push(company.accountName);
+ }
+ });
+ response(matches);
},
backButtonAction() {
// Go back to Quote page
@@ -150,32 +174,30 @@ export default {
},
mounted() {
const select = this.selectParentAccountNumber;
+ setTimeout(() => {
+ $("#autocomplete").autocomplete({
+ source: this.findMatches,
+ position: {
+ my: "left top+6",
+ },
+ minLength: 0, // Necessary to display menu when clearing input
- $("#autocomplete").autocomplete({
- source: this.insuranceCompanyListTags,
- position: {
- my: "left top+6",
- },
- minLength: 0, // Necessary to display menu when clearing input
- // Bold matching letters as you type in the input
- search: function (event, ui) {
- setTimeout(() => {
- let w = $(this).autocomplete("widget").find("div"),
- re = new RegExp("(" + this.value + ")", "i");
- w.html((i, html) => html.replace(re, "$1"));
- }, 5);
- },
- select: function (event, ui) {
- select(ui.item.value);
- },
- });
- },
- watch: {
- selectedQuery(newValue, oldValue) {
- if (oldValue.length > 0 && newValue.length === 0) {
- $("#autocomplete").autocomplete("search", "");
- }
- },
+ // Bold matching letters as you type in the input
+ search: function (event, ui) {
+ setTimeout(() => {
+ let w = $(this).autocomplete("widget").find("div");
+ let regExpString = "(" + this.value + ")";
+ let re = new RegExp(regExpString, "i");
+ w.html((i, html) =>
+ html.replace(re, "$1")
+ );
+ }, 5);
+ },
+ select: function (event, ui) {
+ select(ui.item.value);
+ },
+ });
+ }, 0);
},
components: {
funnelHeader,
@@ -197,6 +219,8 @@ ul {
background: $white;
border: 1px solid $gray;
border-radius: 0.25rem;
+ height: 50%;
+ overflow: auto;
li {
&:hover,
.ui-state-active {