diff --git a/src/constants/application-config.js b/src/constants/application-config.js index 6c4ecd387..25d24d5c8 100644 --- a/src/constants/application-config.js +++ b/src/constants/application-config.js @@ -28,7 +28,7 @@ const applicationConfig = { YAHOO_CALENDAR: "https://calendar.yahoo.com/?v=60", OUTLOOK_CALENDAR: "https://outlook.office.com/calendar/deeplink/compose?path=/calendar/action/compose&rru=addevent", - FRONTEND_LOGGER_URL: process.env.VUE_APP_CONSUMER_CF_DISTRO + "/analytics/api/v1/logging", + FRONTEND_LOGGER_PATH: "/analytics/api/v1/logging", }; export { applicationConfig }; diff --git a/src/helpers/logger.js b/src/helpers/logger.js index 7e2a3d7c1..53c2cb808 100644 --- a/src/helpers/logger.js +++ b/src/helpers/logger.js @@ -42,12 +42,29 @@ export class Logger { // If running locally or in the Dev environment show the log entries in the console. if ( applicationConfig.CURRENT_ENVIRONMENT === "Localhost" || - applicationConfig.CURRENT_ENVIRONMENT === "Dev" + applicationConfig.CURRENT_ENVIRONMENT === "Dev" || + applicationConfig.CURRENT_ENVIRONMENT === "SysTest" ) { - console.log(logEntry); + switch (endpoint) { + case loggingEndpointMethods.LOG_INFORMATION: + console.info(logEntry); + break; + case loggingEndpointMethods.LOG_WARNING: + console.warn(logEntry); + break; + case loggingEndpointMethods.LOG_ERROR: + console.error(logEntry); + break; + case loggingEndpointMethods.LOG_CRITICAL: + console.error(logEntry); + break; + default: + console.log(logEntry); + } } - const url = applicationConfig.FRONTEND_LOGGER_URL; + const url = + applicationConfig.CONSUMER_CF_DISTRO + applicationConfig.FRONTEND_LOGGER_PATH; const headers = { [headerKeys.EXPERIMENT]: JSON.stringify(store.getters.experimentSettings), }; diff --git a/src/layouts/insurance-company/insurance-company.vue b/src/layouts/insurance-company/insurance-company.vue index 9d4682622..e880b1534 100644 --- a/src/layouts/insurance-company/insurance-company.vue +++ b/src/layouts/insurance-company/insurance-company.vue @@ -41,33 +41,31 @@ 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"; import store from "@/store"; -import vinPagesMixin from "@/mixins/vin-pages-mixin"; 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", - mixins: [vinPagesMixin], async beforeRouteEnter(to, from, next) { // Call APIs const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage); @@ -90,69 +88,117 @@ 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: [], + 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 this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route); }, forwardButtonAction() { + this.dispatchStoreAction( + this.storeActions.SAVE_PARENT_ACCOUNT_NUMBER, + this.selectedParentAccount, + false + ); + navigateToHeritageFunnel({ shouldSaveSession: true, pageNameToLog: "insurance-company", loadingModal: this.$refs.loadingModal, }); }, - }, - mounted() { - const select = this.handleAutocompleteSelect; + selectParentAccountNumber(parentAccountName) { + if (!this.insuranceCompanyList) { + console.error("No insurance companies found"); + return; + } - $("#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); - }, - }); - }, - watch: { - selectedQuery(newValue, oldValue) { - if (oldValue.length > 0 && newValue.length === 0) { - $("#autocomplete").autocomplete("search", ""); + var selectedItem = this.insuranceCompanyList.filter((item) => { + return item.accountName === parentAccountName; + }); + + if (selectedItem) { + this.selectedParentAccount = selectedItem[0].parentAccountNumber; + } else { + console.error("Error locating " + parentAccountName); } }, }, + 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 + + // 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, navbar, @@ -173,6 +219,8 @@ ul { background: $white; border: 1px solid $gray; border-radius: 0.25rem; + height: 50%; + overflow: auto; li { &:hover, .ui-state-active {