import { createStore } from "vuex"; import { endpoints } from "@/constants/endpoints.js"; import { storeMutations } from "@/constants/store-mutations"; import { getDateForSavedSessionTimeout } from "@/helpers/heritage-integration/session-helper"; import createPersistedState from "vuex-persistedstate"; import globalMethods from "@/global-methods"; // Export State const getDefaultState = () => { return { order: { vehicle: { year: null, make: null, model: null, style: null, carId: null, category: null, vin: null, imageUrl: null, imageVifNumber: null, imageColor: null, registration: { licensePlate: null, address: null, city: null, state: null, zipCode: null, firstName: null, lastName: null, }, }, serviceLocation: { address: null, city: null, state: null, zipCode: null, }, customer: { emailAddress: null, }, damage: { isRepair: null, numberOfChips: null, glassToReplace: null, }, lineItems: { glassParts: null, otherParts: null }, payment:{ isInsurance: null, insuranceCoverage: { isVerified: null } }, referralNumber: null, referralDate: null, referralCorrelationId: null, accountNumber: 0, }, applicationUser: { eventBus: [], pageData: {}, savedSessionTimeout: getDateForSavedSessionTimeout() }, } }; export const state = getDefaultState(); // Export Mutations export const mutations = { // VEHICLE MUTATIONS updateYear(state, year) { state.order.vehicle.year = year; }, updateMake(state, make) { state.order.vehicle.make = make; }, updateModel(state, model) { state.order.vehicle.model = model; }, updateStyle(state, style) { state.order.vehicle.style = style; }, updateCarId(state, carId) { state.order.vehicle.carId = carId; }, updateVehicleCategory(state, category) { state.order.vehicle.category = category; }, updateVehicleImageUrl(state, imageUrl) { state.order.vehicle.imageUrl = imageUrl; }, updateVehicleImageVifNumber(state, imageVifNumber) { state.order.vehicle.imageVifNumber = imageVifNumber; }, updateVehicleImageColor(state, imageColor) { state.order.vehicle.imageColor = imageColor; }, updateVehicleVin(state, vin) { state.order.vehicle.vin = vin; }, updateIsRepair(state, isRepair) { state.order.damage.isRepair = isRepair; }, updateNumberOfChips(state, numberOfChips) { state.order.damage.numberOfChips = numberOfChips; }, updateGlassToReplace(state, glassToReplace) { state.order.damage.glassToReplace = glassToReplace; }, updateParts(state, partsData) { state.order.lineItems.glassParts = partsData; }, updatePageData(state, pageData) { state.applicationUser.pageData[pageData.page] = pageData.data; }, updateReferralCorrelationId(state, referralCorrelationId) { state.order.referralCorrelationId = referralCorrelationId; }, updateReferralNumber(state, referralNumber) { state.order.referralNumber = referralNumber; }, updateReferralDate(state, referralDate) { state.order.referralDate = referralDate; }, updateParentAcctNumber(state, parentAcctNumber) { state.order.accountNumber = parentAcctNumber; }, updateIsInsurance(state, isInsurance) { state.order.payment.isInsurance = isInsurance; }, updateInsuranceVerifiedStatus(state, isVerified) { state.order.payment.insuranceCoverage.isVerified = isVerified; }, updateRegistrationLicensePlate(state, licensePlate){ state.order.vehicle.registration.licensePlate = licensePlate; }, updateRegistrationAddress(state, registrationAddress){ state.order.vehicle.registration.address = registrationAddress; }, updateRegistrationCity(state, registrationCity){ state.order.vehicle.registration.city = registrationCity; }, updateRegistrationState(state, registrationState){ state.order.vehicle.registration.state = registrationState; }, updateRegistrationZipCode(state, registrationZipCode){ state.order.vehicle.registration.zipCode = registrationZipCode; }, updateServiceLocationZipCode(state, serviceLocationZip){ state.order.serviceLocation.zipCode = serviceLocationZip; }, updateServiceLocationState(state, serviceLocationState){ state.order.serviceLocation.state = serviceLocationState; }, updateRegistrationFirstName(state, firstName){ state.order.vehicle.registration.firstName = firstName; }, updateRegistrationLastName(state, lastName){ state.order.vehicle.registration.lastName = lastName; }, updateCustomerEmailAddress(state, customerEmailAddress){ state.order.customer.emailAddress = customerEmailAddress; }, // EVENT BUS MUTATIONS addEventToBus(state, event) { state.applicationUser.eventBus.push(event); }, removeEventFromBus(state, eventData) { const matchedEvent = state.applicationUser.eventBus.find( ({ category, subCategory }) => category === eventData.category && subCategory === eventData.subCategory ); const itemIndex = state.applicationUser.eventBus.indexOf(matchedEvent); // If the item exists, remove it. if (itemIndex > -1) { state.applicationUser.eventBus.splice(itemIndex, 1); } }, // DEPENDENCY MUTATIONS resetVehicleState(state) { state.order.vehicle.year = null; state.order.vehicle.make = null; state.order.vehicle.model = null; state.order.vehicle.style = null; state.order.vehicle.carId = null; state.order.vehicle.category = null; state.order.vehicle.vin = null; state.order.vehicle.imageUrl = null; state.order.vehicle.imageVifNumber = null; state.order.vehicle.imageColor = null; }, resetDamageState(state) { state.order.damage.isRepair = null; state.order.damage.numberOfChips = null; state.order.damage.glassToReplace = null; }, resetRegistrationState(state) { state.order.vehicle.registration.licensePlate = null; state.order.vehicle.registration.address = null; state.order.vehicle.registration.city = null; state.order.vehicle.registration.state = null; state.order.vehicle.registration.zipCode = null; state.order.vehicle.registration.firstName = null; state.order.vehicle.registration.lastName = null; }, resetPartsState(state) { state.order.lineItems.glassParts = null; state.order.lineItems.otherParts = null; }, resetState(state) { Object.assign(state, getDefaultState()); }, // Misc Mutations updateStateWithOrderInformation(state, orderInformation) { state.order.referralNumber = orderInformation.referralNumber; state.order.referralDate = orderInformation.referralDate; state.order.referralCorrelationId = orderInformation.referralCorrelationId; state.order.vehicle = Object.assign(state.order.vehicle, { year: orderInformation.vehicle?.year, make: orderInformation.vehicle?.make, model: orderInformation.vehicle?.model, style: orderInformation.vehicle?.style, vin: orderInformation.vehicle?.vin, carId: orderInformation.vehicle?.carId, category: orderInformation.vehicle?.category, imageUrl: orderInformation.vehicle?.imageUrl, imageVifNumber: orderInformation.vehicle?.imageVifNumber, imageColor: orderInformation.vehicle?.imageVifColor, registration: { firstName: orderInformation.vehicle.registration.firstName, lastName: orderInformation.vehicle.registration.lastName, address: orderInformation.vehicle.registration.streetAddress, city: orderInformation.vehicle.registration.city, state: orderInformation.vehicle.registration.state, zipCode: orderInformation.vehicle.registration.zipCode, licensePlate: orderInformation.vehicle.registration.licensePlateNumber, } }); state.order.damage.glassToReplace = orderInformation.damage.glassToReplace; state.order.damage.isRepair = orderInformation.damage.isRepair; state.order.damage.numberOfChips = orderInformation.damage.numberOfChips; state.order.lineItems.glassParts = orderInformation.parts; state.order.accountNumber = orderInformation.accountNumber; state.order.serviceLocation.address = orderInformation.serviceLocation.streetAddress, state.order.serviceLocation.city = orderInformation.serviceLocation.city, state.order.serviceLocation.state = orderInformation.serviceLocation.state, state.order.serviceLocation.zipCode = orderInformation.serviceLocation.zipCode; state.order.payment.isInsurance = orderInformation.IsInsuranceOrder; state.order.payment.insuranceCoverage.isVerified = orderInformation?.insuranceInfo.coverageVerified; state.order.customer.emailAddress = orderInformation.customer.emailAddress; }, updateServiceLocationWithVehicleRegistration(state) { state.order.serviceLocation.address = state.order.vehicle.registration.address; state.order.serviceLocation.city = state.order.vehicle.registration.city; state.order.serviceLocation.state = state.order.vehicle.registration.state; state.order.serviceLocation.zipCode = state.order.vehicle.registration.zipCode; } } // Export Getters export const getters = { vehicle: (state) => state.order.vehicle, eventBusItem: (state) => (eventCategory, eventSubCategory) => { const matchedEvent = state.applicationUser.eventBus.find( ({ category, subCategory }) => category === eventCategory && subCategory === eventSubCategory ); return matchedEvent !== undefined ? matchedEvent.eventValue : undefined; }, eventBus: (state) => state.applicationUser.eventBus, damage: (state) => state.order.damage, lineItems: (state) => state.order.lineItems, pageData: (state) => (page) => { return state.applicationUser.pageData[page]; }, applicationUser: (state) => state.applicationUser, order: (state) => state.order, payment: (state) => state.order.payment, } // Export Actions export const actions = { // Vehicle API Actions getVehicleYears(context) { return globalMethods.callHttpClient({ method: endpoints.GetVehicleYears.method, endpoint: endpoints.GetVehicleYears.url, payload: {}, }); }, lookupVehicleByYmms(context, { year, make, model, style }) { return globalMethods.callHttpClient({ method: endpoints.LookupVehicleByYmms.method, endpoint: `${endpoints.LookupVehicleByYmms.url}/${year}/${make}/${model}/${style}`, payload: {}, }); }, lookupVehicleByVin(context, { vin }) { return globalMethods.callHttpClient({ method: endpoints.LookupVehicleByVin.method, endpoint: endpoints.LookupVehicleByVin.url, payload: { vin: vin, // EX "1J4GW58S4XC541166" }, }); }, lookupVinByPlate(context, { licensePlate, licenseState }) { return globalMethods.callHttpClient({ method: endpoints.LookupVinByPlate.method, endpoint: endpoints.LookupVinByPlate.url, payload: { licensePlate: licensePlate, licenseState: licenseState }, }); }, lookupVinByAddress(context, { licenseLastName, licenseStreetAddress, licenseZip, licenseState }) { return globalMethods.callHttpClient({ method: endpoints.LookupVinByAddress.method, endpoint: endpoints.LookupVinByAddress.url, payload: { licenseLastName: licenseLastName, licenseStreetAddress: licenseStreetAddress, licenseZip: licenseZip, licenseState: licenseState }, }); }, getVehicleMakes(context, { year }) { return globalMethods.callHttpClient({ method: endpoints.GetVehicleMakes.method, endpoint: `${endpoints.GetVehicleMakes.url}/${year}`, payload: {}, }); }, getVehicleModels(context, { year, make }) { return globalMethods.callHttpClient({ method: endpoints.GetVehicleModels.method, endpoint: `${endpoints.GetVehicleModels.url}/${year}/${make}`, payload: {}, }); }, getVehicleStyles(context, { year, make, model }) { return globalMethods.callHttpClient({ method: endpoints.GetVehicleStyles.method, endpoint: `${endpoints.GetVehicleStyles.url}/${year}/${make}/${model}`, payload: {}, }); }, setVehicle(context, { year, make, model, style }) { return globalMethods .callHttpClient({ methods: endpoints.GetVehicle.method, endpoint: `${endpoints.GetVehicle.url}/${year}/${make}/${model}/${style}`, payload: {}, }) .then((response) => { context.commit(storeMutations.UPDATE_CAR_ID, response.data.carId); context.commit(storeMutations.UPDATE_VEHICLE_CATEGORY, response.data.category); context.commit(storeMutations.UPDATE_VEHICLE_IMAGE_URL, response.data.imageUrl); context.commit(storeMutations.UPDATE_VEHICLE_IMAGE_VIF_NUMBER, response.data.imageVifNumber); context.commit(storeMutations.UPDATE_VEHICLE_IMAGE_COLOR, response.data.imageVifColor); return response; }); }, getDamageOptions(context, { carId }) { return globalMethods.callHttpClient({ methods: endpoints.GetDamageOptions.method, endpoint: `${endpoints.GetDamageOptions.url}/${carId}`, payload: {}, }); }, validateZip(context, { zip }) { return globalMethods.callHttpClient({ methods: endpoints.ValidateZip.method, endpoint: `${endpoints.ValidateZip.url}/${zip}` }) }, // DEPENDENCY ACTIONS resetVehicleAndDependencies(context) { context.commit(storeMutations.RESET_VEHICLE_STATE); context.commit(storeMutations.RESET_DAMAGE_STATE); context.commit(storeMutations.RESET_REGISTRATION_STATE); }, resetDamageAndDependencies(context) { context.commit(storeMutations.RESET_DAMAGE_STATE); context.commit(storeMutations.RESET_PARTS_STATE); }, resetRegistrationAndDependencies(context) { context.commit(storeMutations.RESET_REGISTRATION_STATE); context.commit(storeMutations.RESET_PARTS_STATE) }, resetPartsAndDependencies(context) { context.commit(storeMutations.RESET_PARTS_STATE); }, resetState(context) { context.commit(storeMutations.RESET_STATE); }, // Content API Actions getRouteInfo(context, { pageName }) { return globalMethods.callHttpClient({ method: endpoints.GetRouteInfo.method, endpoint: endpoints.GetRouteInfo.url, payload: { pageName: pageName, }, }); }, getHomepageName(context) { return globalMethods.callHttpClient({ method: endpoints.GetHomepageInfo.method, endpoint: endpoints.GetHomepageInfo.url, }); }, getPageData(context, { pageName }) { return globalMethods.callHttpClient({ method: endpoints.GetPageData.method, endpoint: `${endpoints.GetPageData.url}/${pageName}`, payload: {}, }); }, getEvoxImage(context, { relativeUrl }) { return globalMethods.callHttpClient({ method: endpoints.GetPageData.method, endpoint: relativeUrl, payload: {}, }); }, // Misc Actions setReferralInformation(context, { referralNumber, referralDate, referralCorrelationId }) { context.commit(storeMutations.UPDATE_REFERRAL_NUMBER, referralNumber); context.commit(storeMutations.UPDATE_REFERRAL_DATE, referralDate); context.commit(storeMutations.UPDATE_REFERRAL_CORRELATION_ID, referralCorrelationId); }, updateServiceLocationWithVehicleRegistration(context) { context.commit(storeMutations.UPDATE_SERVICE_LOCATION_WITH_VEHICLE_REGISTRATION); }, logExperimentExposure(context, { userId, sessionKey, pageName, universeName }) { return globalMethods.callHttpClient({ method: endpoints.LogExperimentExposureIfAssigned.method, endpoint: endpoints.LogExperimentExposureIfAssigned.url, payload: { userId: userId, sessionKey: sessionKey, pageName: pageName, universeName: universeName } }); }, logPageView(context, { userId, sessionKey, pageName, sessionId, action, event, shouldUseSessionId }) { var payload = { userId: userId, sessionKey: sessionKey, sessionId: sessionId, pageName: pageName, applicationName: 'SafeliteDotCom', action: action, event: event, shouldUseSessionId: shouldUseSessionId }; return globalMethods.callHttpClient({ method: endpoints.LogPageView.method, endpoint: endpoints.LogPageView.url, payload: payload, logApiCall: false }); }, logCustomEvent(context, { userId, sessionKey, pageName, sessionId, category, action, label, value, shouldUseSessionId }) { var payload = { userId: userId, sessionKey: sessionKey, sessionId: sessionId, pageName: pageName, applicationName: 'SafeliteDotCom', category: category, action: action, label: label, value: value, shouldUseSessionId: shouldUseSessionId }; return globalMethods.callHttpClient({ method: endpoints.LogCustomEvent.method, endpoint: endpoints.LogCustomEvent.url, payload: payload, logApiCall: false }); }, initializeSession(context, { userId, sessionId, userAgent, referrer }) { var payload = { applicationName: 'SafeliteDotCom', userId: userId, deviceId: userId, sessionId: sessionId, userAgent: userAgent, operatorId: "WEB", userName: "SafeliteConceptFunnel", referrer: referrer }; return globalMethods.callHttpClient({ method: endpoints.InitializeSession.method, endpoint: endpoints.InitializeSession.url, payload: payload, logApiCall: false }); }, GetExperimentsByUser(context, { userId }){ return globalMethods.callHttpClient({ method: endpoints.GetExperimentsByUser.method, endpoint: `${endpoints.GetExperimentsByUser.url}/${userId}`, payload: {} }); }, // Parts API Actions getPartsOrQuestions(context) { const vehicle = context.getters.vehicle; const damage = context.getters.damage; const order = context.state.order; const carId = vehicle.carId; const glassArray = damage.glassToReplace; const zipCode = order.serviceLocation.zipCode; const vin = vehicle.vin; return globalMethods.callHttpClient({ method: endpoints.GetPartsOrQuestions.method, endpoint: endpoints.GetPartsOrQuestions.url, payload: { carId: carId, glass: glassArray, zip: zipCode, vin: vin }, }); }, // Order API Actions saveOrder(context) { const vehicle = context.getters.vehicle; const damage = context.getters.damage; const order = context.state.order; return globalMethods.callHttpClient({ method: endpoints.SaveOrder.method, endpoint: endpoints.SaveOrder.url, payload: { vehicle: { carId: vehicle.carId, year: vehicle.year, make: vehicle.make, model: vehicle.model, style: vehicle.style, vin: vehicle.vin, registration: { firstName: vehicle.registration.firstName, lastName: vehicle.registration.lastName, streetAddress: vehicle.registration.address, city: vehicle.registration.city, state: vehicle.registration.state, zipCode: vehicle.registration.zipCode, licensePlateNumber: vehicle.registration.licensePlate, }, }, damage: { numberOfChips: damage.numberOfChips, glassToReplace: damage.glassToReplace, isRepair: damage.isRepair }, customer: { emailAddress: order.customer.emailAddress, }, serviceLocation: { streetAddress: order.serviceLocation.address, city: order.serviceLocation.city, state: order.serviceLocation.state, zipCode: order.serviceLocation.zipCode }, referralNumber: order.referralNumber?.toString(), // TODO It'd be nice to save these as strings in the first place referralDate: order.referralDate, accountNumber: order.accountNumber?.toString() }, }); }, loadOrder(context, { referralNumber, referralDate, referralCorrelationId, accountNumber}) { return globalMethods.callHttpClient({ method: endpoints.LoadOrder.method, endpoint: endpoints.LoadOrder.url, payload: { referralNumber: referralNumber?.toString(), referralDate: referralDate, referralCorrelationId: referralCorrelationId, accountNumber: accountNumber?.toString() }, }).then((response) => { context.commit(storeMutations.RESET_STATE); context.commit(storeMutations.UPDATE_STATE_WITH_ORDER_INFORMATION, response.data); return response; }); } } export default createStore({ plugins: [createPersistedState()], // IMPORTANT: Be VERY careful when modifying these fields for at least a few reasons: // * The CMS can reference the fields by name // * Return users may have a previous "version" of the model, and we don't want // them to have a breaking experience, because the model might have changed. state, mutations, getters, actions, }); // Private Functions