jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

WIP

Browse source
This commit is contained in:
Leah Schumann 2023-05-04 06:35:48 -04:00
parent c5d317e4b7
commit c94bff0b55
4 changed files with 309 additions and 138 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/layouts/service-location/service-location.vue
View file

@ -147,7 +147,7 @@ export default {
isRecalibrationServiceableInshop: null,
isGlassServiceableMobile: null,
isRecalibrationServiceableMobile: null,
selectedAppointmentType: null,
selectedAppointmentType: "Dropoff",
providerNumber: null,
mobileFeePart: null,
zipContainsMilitaryBase: false,
@ -164,7 +164,7 @@ export default {
const mobileFeePartPromise = getPricedMobileFeePart(serviceZipCode);
const shopQuestionInitialDataPromise = shopQuestion.methods.loadInitialData();
const shopQuestionInitialDataPromise = shopQuestion.methods.loadInitialData(serviceZipCode);
// Settle promises and get results
const promiseResultMap = [
@ -304,7 +304,7 @@ export default {
store.getters.payment.isInsurance !== null
);
},
setData(zipCodeData, serviceabilityDetails, mobileFeePart, shopQuestionData) {
setData(zipCodeData, serviceabilityDetails, mobileFeePart) {
if (zipCodeData) {
this.zipContainsMilitaryBase = zipCodeData.containsMilitaryBase;
}

391
src/layouts/service-location/shop-question/shop-question.spec.js
View file

@ -16,7 +16,7 @@ jest.mock("@/mixins/base-mixin", () => ({
},
}));
const mockGetProvidersStoreAction = storeActions.GET_PROVIDER_LOCATIONS;
const mockGetProvidersStoreAction = storeActions.GET_PROVIDERS;
const mockNewShopList = {
data: [
{
@ -53,90 +53,242 @@ const mockCmsContent = {
QuestionText: "Select a shop:",
};
const cmsWidgetName = "AppointmentTypeQuestionWidget";
const shopQuestionInitialData = [
{
city: "Worthington",
country: "United States",
distance: 1.5,
providerNumber: "123",
state: "OH",
streetAddress: "760 Dearborn Park Ln",
zipCode: "43085",
},
{
city: "Columbus",
country: "United States",
distance: 4.5,
providerNumber: "124",
state: "OH",
streetAddress: "5486 N Hamilton Rd",
zipCode: "43230",
},
{
city: "Powell",
country: "United States",
distance: 7,
providerNumber: "125",
state: "OH",
streetAddress: "1670 Harmon Ave C",
zipCode: "43223",
},
{
city: "Chillicothe",
country: "United States",
distance: 41.5,
providerNumber: "126",
state: "OH",
streetAddress: "555 First Capital Ln",
zipCode: "45601",
},
{
city: "Grove City",
country: "United States",
distance: 4.5,
providerNumber: "127",
state: "OH",
streetAddress: "5486 N Grove Rd",
zipCode: "43215",
},
{
city: "Dayton",
country: "United States",
distance: 80.5,
providerNumber: "128",
state: "OH",
streetAddress: "1670 Bongo Ave D",
zipCode: "43223",
},
{
city: "Far",
country: "United States",
distance: 100,
providerNumber: "129",
state: "OH",
streetAddress: "555 First Capital Ln",
zipCode: "45601",
},
{
city: "Farther",
country: "United States",
distance: 200,
providerNumber: "130",
state: "OH",
streetAddress: "5486 N Grove Rd",
zipCode: "43215",
},
{
city: "Farthest (Ever)",
country: "United States",
distance: 380.5,
providerNumber: "131",
state: "OH",
streetAddress: "1670 Bongo Ave D",
zipCode: "43223",
},
];
const cmsWidgetName = "ShopQuestionWidget";
const shopQuestionInitialData = {
shopProviders: [
{
address: {
city: "WESTERVILLE",
country: "US",
state: "OH",
streetAddress: "4403 EXECUTIVE PKWY",
zipCode: "43081",
},
distance: 5.16769294095201,
providerNumber: "003335",
},
{
address: {
city: "WORTHINGTON",
country: "US",
state: "OH",
streetAddress: "760 DEARBORN PARK LN",
zipCode: "43085",
},
distance: 10.5865432478478,
providerNumber: "001820",
},
{
address: {
city: "COLUMBUS",
country: "US",
state: "OH",
streetAddress: "5015 N HIGH ST",
zipCode: "43214",
},
distance: 11.738869544543,
providerNumber: "003343",
},
{
address: {
city: "COLUMBUS",
country: "US",
state: "OH",
streetAddress: "1670 HARMON AVE",
zipCode: "43223",
},
distance: 15.9727889297435,
providerNumber: "006747",
},
{
address: {
city: "POWELL",
country: "US",
state: "OH",
streetAddress: "3938 POWELL RD",
zipCode: "43065",
},
distance: 16.2690495685233,
providerNumber: "003341",
},
{
address: {
city: "Columbus",
country: "US",
state: "OH",
streetAddress: "4580 W Broad St",
zipCode: "43228",
},
distance: 19.4618116611001,
providerNumber: "003342",
},
{
address: {
city: "ZANESVILLE",
country: "US",
state: "OH",
streetAddress: "3350 MAPLE AVE.",
zipCode: "43701",
},
distance: 41.9091549795417,
providerNumber: "005819",
},
{
address: {
city: "ZANESVILLE",
country: "US",
state: "OH",
streetAddress: "903 LINDEN AVE",
zipCode: "43701",
},
distance: 42.8868847428493,
providerNumber: "004139",
},
{
address: {
city: "MANSFIELD",
country: "US",
state: "OH",
streetAddress: "1139 PARK AVE W",
zipCode: "44906",
},
distance: 48.0907606730017,
providerNumber: "006043",
},
{
address: {
city: "CHILLICOTHE",
country: "US",
state: "OH",
streetAddress: "1415 N BRIDGE ST",
zipCode: "45601",
},
distance: 50.7481559930212,
providerNumber: "005803",
},
{
address: {
city: "KENTON",
country: "US",
state: "OH",
streetAddress: "999 MEADOW LN",
zipCode: "43326",
},
distance: 58.381091106879,
providerNumber: "006041",
},
{
address: {
city: "WOOSTER",
country: "US",
state: "OH",
streetAddress: "MOBILE ONLY",
zipCode: "44691",
},
distance: 64.8003821425259,
providerNumber: "006054",
},
{
address: {
city: "NEW PHILADELPHIA",
country: "US",
state: "OH",
streetAddress: "1309-A MONROE STREET NW",
zipCode: "44663",
},
distance: 76.4982256572348,
providerNumber: "005711",
},
{
address: {
city: "FINDLAY",
country: "US",
state: "OH",
streetAddress: "1970 TIFFIN AVE",
zipCode: "45840",
},
distance: 79.1332342134231,
providerNumber: "006141",
},
{
address: {
city: "DAYTON",
country: "US",
state: "OH",
streetAddress: "8333 YANKEE ST",
zipCode: "45458",
},
distance: 80.8164618523962,
providerNumber: "004104",
},
{
address: {
city: "PARKERSBURG",
country: "US",
state: "WV",
streetAddress: "900 7TH ST",
zipCode: "26101",
},
distance: 87.5874281799115,
providerNumber: "004134",
},
{
address: {
city: "CANTON",
country: "US",
state: "OH",
streetAddress: "825 WERTZ AVE NW",
zipCode: "44708",
},
distance: 88.4989369805638,
providerNumber: "005378",
},
{
address: {
city: "HURON",
country: "US",
state: "OH",
streetAddress: "2401 SAWMILL PKWY",
zipCode: "44839",
},
distance: 91.5072461453446,
providerNumber: "004461",
},
{
address: {
city: "AKRON",
country: "US",
state: "OH",
streetAddress: "2567 S ARLINGTON RD",
zipCode: "44319",
},
distance: 93.3296267574581,
providerNumber: "006242",
},
{
address: {
city: "BRUNSWICK",
country: "US",
state: "OH",
streetAddress: "1402 PEARL RD",
zipCode: "44212",
},
distance: 93.9890496539688,
providerNumber: "004083",
},
{
address: {
city: "EATON",
country: "US",
state: "OH",
streetAddress: "MOBILE ONLY",
zipCode: "45320",
},
distance: 99.1345313364146,
providerNumber: "005727",
},
],
};
const mockMixin = {
methods: {
@ -151,7 +303,7 @@ const mockMixin = {
};
describe("shop-question.vue", () => {
it("Should display first three shops when an appointment type has already been selected", async () => {
it.only("Should display first three shops when an appointment type has already been selected", async () => {
// Arrange/Act
const container = document.createElement("div");
container.scrollTo = jest.fn();
@ -164,7 +316,7 @@ describe("shop-question.vue", () => {
props: {
modelValue: null,
serviceZipCode: "43081",
selectedAppointmentType: "Dropoff",
selectedAppointmentType: null,
cmsWidgetName: cmsWidgetName,
},
mountOptions: {
@ -175,29 +327,34 @@ describe("shop-question.vue", () => {
wrapper.vm.$refs.buttonQuestion.resetField = jest.fn();
wrapper.vm.initializeComponent(shopQuestionInitialData);
wrapper.setProps({
selectedAppointmentType: "Inshop",
});
await wrapper.vm.$nextTick();
// Assert
expect(wrapper.vm.answers).toEqual([
{
Name: "123",
buttonLabel: "Worthington",
buttonLabelSubCopy: "1.5 mi",
buttonBodyCopy: "760 Dearborn Park Ln, Worthington, OH 43085",
},
{
Name: "124",
buttonLabel: "Columbus",
buttonLabelSubCopy: "4.5 mi",
buttonBodyCopy: "5486 N Hamilton Rd, Columbus, OH 43230",
},
{
Name: "125",
buttonLabel: "Powell",
buttonLabelSubCopy: "7 mi",
buttonBodyCopy: "1670 Harmon Ave C, Powell, OH 43223",
},
]);
expect(wrapper.vm.answers.length).toEqual(3);
// expect(wrapper.vm.answers).toEqual([
// {
// value: "123",
// buttonLabel: "Worthington",
// buttonLabelSubCopy: "1.5 mi",
// buttonBodyCopy: "760 Dearborn Park Ln, Worthington, OH 43085",
// },
// {
// value: "124",
// buttonLabel: "Columbus",
// buttonLabelSubCopy: "4.5 mi",
// buttonBodyCopy: "5486 N Hamilton Rd, Columbus, OH 43230",
// },
// {
// value: "125",
// buttonLabel: "Powell",
// buttonLabelSubCopy: "7 mi",
// buttonBodyCopy: "1670 Harmon Ave C, Powell, OH 43223",
// },
// ]);
});
it("Should display the 'Show more locations' link when there are more than three locations to chose from", async () => {
@ -307,19 +464,19 @@ describe("shop-question.vue", () => {
const displayedAnswers = [
{
Name: "123",
value: "123",
buttonLabel: "Worthington",
buttonLabelSubCopy: "1.5 mi",
buttonBodyCopy: "760 Dearborn Park Ln, Worthington, OH 43085",
},
{
Name: "124",
value: "124",
buttonLabel: "Columbus",
buttonLabelSubCopy: "4.5 mi",
buttonBodyCopy: "5486 N Hamilton Rd, Columbus, OH 43230",
},
{
Name: "125",
value: "125",
buttonLabel: "Powell",
buttonLabelSubCopy: "7 mi",
buttonBodyCopy: "1670 Harmon Ave C, Powell, OH 43223",
@ -360,37 +517,37 @@ describe("shop-question.vue", () => {
expect(wrapper.vm.answers.length).toBe(6);
expect(wrapper.vm.answers).toEqual([
{
Name: "123",
value: "123",
buttonLabel: "Worthington",
buttonLabelSubCopy: "1.5 mi",
buttonBodyCopy: "760 Dearborn Park Ln, Worthington, OH 43085",
},
{
Name: "124",
value: "124",
buttonLabel: "Columbus",
buttonLabelSubCopy: "4.5 mi",
buttonBodyCopy: "5486 N Hamilton Rd, Columbus, OH 43230",
},
{
Name: "125",
value: "125",
buttonLabel: "Powell",
buttonLabelSubCopy: "7 mi",
buttonBodyCopy: "1670 Harmon Ave C, Powell, OH 43223",
},
{
Name: "126",
value: "126",
buttonLabel: "Chillicothe",
buttonLabelSubCopy: "41.5 mi",
buttonBodyCopy: "555 First Capital Ln, Chillicothe, OH 45601",
},
{
Name: "127",
value: "127",
buttonLabel: "Grove City",
buttonLabelSubCopy: "4.5 mi",
buttonBodyCopy: "5486 N Grove Rd, Grove City, OH 43215",
},
{
Name: "128",
value: "128",
buttonLabel: "Dayton",
buttonLabelSubCopy: "80.5 mi",
buttonBodyCopy: "1670 Bongo Ave D, Dayton, OH 43223",
@ -492,7 +649,7 @@ describe("shop-question.vue", () => {
wrapper.vm.$options.methods.loadInitialData = jest.fn().mockImplementation(() => {
return new Promise((resolve) => {
resolve(newShopList);
resolve(mockNewShopList);
});
});
await wrapper.vm.$options.watch.serviceZipCode.handler.call(wrapper.vm, "43054");

46
src/layouts/service-location/shop-question/shop-question.vue
View file

@ -91,13 +91,15 @@ export default {
},
},
methods: {
loadInitialData() {
loadInitialData(serviceZipCode) {
return baseMixin.methods.dispatchStoreAction(storeActions.GET_PROVIDERS, {
serviceZipCode: this.serviceZipCode,
serviceZipCode: serviceZipCode,
radius: 100,
});
},
initializeComponent(shopQuestionInitialData) {
this.shops = shopQuestionInitialData;
this.shopProviders = shopQuestionInitialData.shopProviders;
this.getNextShopsFromList();
},
async getNextShopsFromList(numberToGet = 3) {
const shopIterator = (array, n) => {
@ -105,20 +107,32 @@ export default {
return () => {
const end = this.shopIndex + n;
const part = array.slice(this.shopIndex, end);
this.shopIndex = end < l ? end : this.shops.length;
this.shopIndex = end < l ? end : this.shopProviders.length;
return part;
};
};
const nextShop = shopIterator(this.shops, numberToGet);
const toTitleCase = (str) => {
return str.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
};
const nextShop = shopIterator(this.shopProviders, numberToGet);
// Map API result data
const mappedData = nextShop().map((shop) => {
return {
buttonLabel: shop.city,
buttonLabelSubCopy: `${shop.distance} mi`,
buttonBodyCopy: `${shop.streetAddress}, ${shop.city}, ${shop.state} ${shop.zipCode}`,
value: shop.providerNumber,
const mappedData = nextShop().map((shopProvider) => {
const streetAddress = toTitleCase(shopProvider.address.streetAddress);
const city = toTitleCase(shopProvider.address.city);
const state = shopProvider.address.state;
const zipCode = shopProvider.address.zipCode;
const distance = Math.round(shopProvider.distance * 2) / 2;
return {
buttonLabel: streetAddress,
buttonLabelSubCopy: `${distance} mi`,
buttonBodyCopy: `${streetAddress}, ${city}, ${state} ${zipCode}`,
value: shopProvider.providerNumber,
};
});
@ -132,7 +146,7 @@ export default {
await this.$nextTick();
if (this.shopIndex == this.shops.length) {
if (this.shopIndex == this.shopProviders.length) {
this.displaySeeMoreLocationsLink = false;
} else {
this.displaySeeMoreLocationsLink = true;
@ -173,17 +187,17 @@ export default {
this.scrollToPageBottom();
},
},
shops: {
handler(newValue) {
shopProviders: {
async handler(newValue) {
this.$refs.buttonQuestion.resetField();
const selectedShopIndex = newValue.findIndex(
(provider) => provider.providerNumber == this.modelValue
);
if (selectedShopIndex >= 3) {
this.getNextShopsFromList(selectedShopIndex + 1);
await this.getNextShopsFromList(selectedShopIndex + 1);
} else {
this.getNextShopsFromList();
await this.getNextShopsFromList();
}
},
},

4
src/store/index.js
View file

@ -983,9 +983,9 @@ export const actions = {
getProviders(context, { serviceZipCode, radius }) {
const damageType = context.getters.damage.isRepair ? "Repair" : "Replace";
return globalMethods.callMockHttpClient({
return globalMethods.callHttpClient({
method: endpoints.GetProviders.method,
endpoint: "https://run.mocky.io/v3/abf2fa63-8287-4e46-b169-f5bec65c8dff",
endpoint: `${endpoints.GetProviders.url}/${serviceZipCode}/${damageType}/${radius}`,
});
},