DigitalConsumer.FixMyGlass/src/store/index.js
2022-03-11 16:12:21 -05:00

327 lines
9.9 KiB
JavaScript

import { createStore } from "vuex";
import { endpoints } from "@/constants/endpoints.js";
import { storeMutations } from "@/constants/store-mutations";
import createPersistedState from "vuex-persistedstate";
import globalMethods from "@/global-methods";
// Export State
export const state = {
order: {
vehicle: {
year: null,
make: null,
model: null,
style: null,
carId: null,
category: null,
imageUrl: null,
imageVifNumber: null,
imageColor: null,
registration: {
licensePlate: null,
address: null,
city: null,
state: null,
zipCode: null,
firstName: null,
lastName: null,
},
},
damage: {
isRepair: null,
numberOfChips: null,
glassToReplace: null,
},
lineItems:{
glassParts: {},
otherParts: {}
}
},
applicationUser: {
eventBus: [],
pageData: {}
},
}
// 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;
},
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;
},
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;
},
updateRegistrationFirstName(state, registrationFirstName){
state.order.vehicle.registration.firstName = registrationFirstName;
},
updateRegistrationLastName(state, registrationLastName){
state.order.vehicle.registration.lastName = registrationLastName;
},
updateRegistrationLicensePlate(state, registrationLicensePlate){
state.order.vehicle.registration.licensePlate = registrationLicensePlate;
},
updateServiceLocationZip(state, ServiceLocationZip){
state.order.vehicle.serviceLocation.zip = serviceLocationZip;
},
updateCustomerEmailAddress(state, CustomerEmailAddress){
state.order.vehicle.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;
},
resetDamageState(state) {
state.order.damage.isRepair = null;
state.order.damage.numberOfChips = null;
state.order.damage.glassToReplace = null;
},
resetRegistrationState(state) {
},
resetPartsState(state) {
state.order.lineItems.glassParts = null;
state.order.lineItems.otherParts = null;
}
}
// 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];
}
}
// 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"
},
});
},
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: {},
});
},
// 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);
},
// 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: {},
});
},
// Parts API Actions
getPartsOrQuestions(context, { carId, glassArray, zipCode, vin = '' }) {
return globalMethods.callHttpClient({
method: endpoints.GetPartsOrQuestions.method,
endpoint: endpoints.GetPartsOrQuestions.url,
payload: {
carId: carId,
glass: glassArray,
zip: zipCode,
vin: vin
},
});
}
}
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,
});