revisions based on PR feedback
This commit is contained in:
parent
96462fd087
commit
f21a75f5d7
3 changed files with 68 additions and 59 deletions
|
|
@ -30,12 +30,22 @@ describe('policyEndorsements.vue', () => {
|
||||||
// Assert
|
// Assert
|
||||||
expect(siteSubHeader.exists()).toBe(true);
|
expect(siteSubHeader.exists()).toBe(true);
|
||||||
});
|
});
|
||||||
test('Should render buttonQuestion component', () => {
|
test('Should render schoolProperty buttonQuestion component', () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
const wrapper = shallowMount(policyEndorsements, getMountOptions());
|
const wrapper = shallowMount(policyEndorsements, getMountOptions());
|
||||||
|
|
||||||
// Act
|
// Act
|
||||||
const buttonQuestion = wrapper.findComponent({ ref: 'endorsementQuestion' });
|
const buttonQuestion = wrapper.findComponent({ ref: 'schoolPropertyQuestion' });
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(buttonQuestion.exists()).toBe(true);
|
||||||
|
});
|
||||||
|
test('Should render parkingLot buttonQuestion component', () => {
|
||||||
|
// Arrange
|
||||||
|
const wrapper = shallowMount(policyEndorsements, getMountOptions());
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const buttonQuestion = wrapper.findComponent({ ref: 'parkingLotQuestion' });
|
||||||
|
|
||||||
// Assert
|
// Assert
|
||||||
expect(buttonQuestion.exists()).toBe(true);
|
expect(buttonQuestion.exists()).toBe(true);
|
||||||
|
|
@ -85,7 +95,6 @@ describe('policyEndorsements.vue', () => {
|
||||||
expect(wrapper.vm.$router.navigate)
|
expect(wrapper.vm.$router.navigate)
|
||||||
.toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
|
.toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
|
||||||
});
|
});
|
||||||
// *TO DO: once service is ready, revise this test to ensure data is saved to the store
|
|
||||||
test('Forward button clicked saves endorsement question answers', () => {
|
test('Forward button clicked saves endorsement question answers', () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
const mountOptions = getMountOptions({
|
const mountOptions = getMountOptions({
|
||||||
|
|
@ -96,13 +105,14 @@ describe('policyEndorsements.vue', () => {
|
||||||
plugins: [createTestingPinia()]
|
plugins: [createTestingPinia()]
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const wrapper = shallowMount(policyEndorsements, mountOptions);
|
const wrapper = shallowMount(policyEndorsements, mountOptions);
|
||||||
|
|
||||||
// Act
|
// Act
|
||||||
wrapper.vm.forwardButtonAction();
|
wrapper.vm.forwardButtonAction();
|
||||||
|
|
||||||
// Assert
|
// Assert
|
||||||
expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalled();
|
expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalledWith(wrapper.vm.questionAnswersArray);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -4,48 +4,50 @@
|
||||||
v-slot="{ meta }"
|
v-slot="{ meta }"
|
||||||
@submit="onSubmit"
|
@submit="onSubmit"
|
||||||
@invalidSubmit="onInvalidSubmit">
|
@invalidSubmit="onInvalidSubmit">
|
||||||
<div class="page-container-grouped-styles">
|
<div
|
||||||
|
class="page-container-grouped-styles">
|
||||||
<div class="fade-on-route-transition position-relative">
|
<div class="fade-on-route-transition position-relative">
|
||||||
<siteHeader
|
<siteHeader
|
||||||
ref="siteHeader"
|
ref="siteHeader"
|
||||||
cmsWidgetName="SiteHeaderWidget" />
|
cmsWidgetName="SiteHeaderWidget" />
|
||||||
<div class="container-fluid mt-0 px-5">
|
<div class="container-fluid mt-0 px-5">
|
||||||
<siteSubHeader
|
<siteSubHeader
|
||||||
ref="siteSubHeader"
|
ref="siteSubHeader"
|
||||||
cmsWidgetName="SiteSubHeaderWidget"
|
cmsWidgetName="SiteSubHeaderWidget"
|
||||||
class="mt-5" />
|
class="mt-5" />
|
||||||
<buttonQuestion
|
<buttonQuestion
|
||||||
ref="endorsementQuestion"
|
ref="schoolPropertyQuestion"
|
||||||
v-model="schoolPropertyAnswer"
|
v-model="schoolPropertyAnswer"
|
||||||
class="radioQuestion windshield-chip-count-question mb-4"
|
class="radioQuestion windshield-chip-count-question mb-4"
|
||||||
cmsWidgetName="SchoolPropertyQuestion"
|
cmsWidgetName="SchoolPropertyQuestion"
|
||||||
:questionText="schoolPropertyQuestionText"
|
:questionText="schoolPropertyQuestionText"
|
||||||
:answers="schoolPropertyAnswersFromCms"
|
:answers="schoolPropertyAnswersFromCms"
|
||||||
groupName="schoolProperty"
|
groupName="schoolProperty"
|
||||||
buttonID="schoolPropertyQuestion"
|
buttonID="schoolPropertyQuestion"
|
||||||
buttonTypeString="listButtonHorizontal"
|
buttonTypeString="listButtonHorizontal"
|
||||||
isRequired
|
isRequired
|
||||||
:validationRules="rules.selectionRequired">
|
:validationRules="rules.selectionRequired">
|
||||||
</buttonQuestion>
|
</buttonQuestion>
|
||||||
<buttonQuestion
|
<buttonQuestion
|
||||||
v-model="parkingLotAnswer"
|
ref="parkingLotQuestion"
|
||||||
class="radioQuestion windshield-chip-count-question"
|
v-model="parkingLotAnswer"
|
||||||
cmsWidgetName="ParkingLotQuestion"
|
class="radioQuestion windshield-chip-count-question"
|
||||||
:questionText="parkingLotQuestionText"
|
cmsWidgetName="ParkingLotQuestion"
|
||||||
:answers="parkingLotAnswersFromCms"
|
:questionText="parkingLotQuestionText"
|
||||||
groupName="parkingLot"
|
:answers="parkingLotAnswersFromCms"
|
||||||
buttonID="parkingLotQuestion"
|
groupName="parkingLot"
|
||||||
buttonTypeString="listButtonHorizontal"
|
buttonID="parkingLotQuestion"
|
||||||
isRequired
|
buttonTypeString="listButtonHorizontal"
|
||||||
:validationRules="rules.selectionRequired">
|
isRequired
|
||||||
</buttonQuestion>
|
:validationRules="rules.selectionRequired">
|
||||||
<siteFooter
|
</buttonQuestion>
|
||||||
ref="siteFooter"
|
<siteFooter
|
||||||
class="pt-5"
|
ref="siteFooter"
|
||||||
cmsWidgetName="SiteFooterWidget"
|
class="pt-5"
|
||||||
:isForwardActionDisabled="!meta.valid"
|
cmsWidgetName="SiteFooterWidget"
|
||||||
@forwardClicked="forwardButtonAction"
|
:isForwardActionDisabled="!meta.valid"
|
||||||
@backClicked="backButtonAction" />
|
@forwardClicked="forwardButtonAction"
|
||||||
|
@backClicked="backButtonAction" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -95,6 +97,7 @@ export default {
|
||||||
emits: ['update:modelValue'],
|
emits: ['update:modelValue'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
questionAnswersArray: [],
|
||||||
schoolPropertyAnswer: '',
|
schoolPropertyAnswer: '',
|
||||||
parkingLotAnswer: '',
|
parkingLotAnswer: '',
|
||||||
rules: {
|
rules: {
|
||||||
|
|
@ -122,10 +125,8 @@ export default {
|
||||||
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
|
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
|
||||||
},
|
},
|
||||||
async forwardButtonAction() {
|
async forwardButtonAction() {
|
||||||
// manually creating the array for now, will revise once service returns questions
|
// TO DO: remove hard coding and update data format once service returns endorsement questions
|
||||||
const questionAnswersArray = [];
|
this.questionAnswersArray.push(
|
||||||
|
|
||||||
questionAnswersArray.push(
|
|
||||||
{
|
{
|
||||||
questionNum: 1,
|
questionNum: 1,
|
||||||
questionText: this.schoolPropertyQuestionText,
|
questionText: this.schoolPropertyQuestionText,
|
||||||
|
|
@ -139,7 +140,7 @@ export default {
|
||||||
);
|
);
|
||||||
|
|
||||||
// save answers to store as order.policy.endorsementQuestionAnswers
|
// save answers to store as order.policy.endorsementQuestionAnswers
|
||||||
useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray);
|
useMainStore().saveEndorsementQuestionAnswers(this.questionAnswersArray);
|
||||||
|
|
||||||
return this.navigateForward();
|
return this.navigateForward();
|
||||||
},
|
},
|
||||||
|
|
@ -156,13 +157,13 @@ export default {
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
:deep .subheader-primary {
|
:deep .subheader-primary {
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: map-get($spacers, 3);
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep .subheader-secondary {
|
:deep .subheader-secondary {
|
||||||
p {
|
p {
|
||||||
font-size: 0.875rem;
|
font-size: $h6-font-size;
|
||||||
line-height: 1.5rem;
|
line-height: map-get($spacers, 5);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -173,19 +174,19 @@ export default {
|
||||||
justify-content: left !important;
|
justify-content: left !important;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: map-get($spacers, 5);
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep .question-text {
|
:deep .question-text {
|
||||||
& > span {
|
& > span {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
line-height: 1.5rem;
|
line-height: map-get($spacers, 5);
|
||||||
}
|
}
|
||||||
margin-bottom: 0.5rem;
|
margin-bottom: map-get($spacers, 2);
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep div.question-text.d-flex {
|
:deep div.question-text.d-flex {
|
||||||
margin-top: 1rem;
|
margin-top: map-get($spacers, 4);
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -118,11 +118,11 @@ export default {
|
||||||
? vehicle?.coverages[0].deductible
|
? vehicle?.coverages[0].deductible
|
||||||
: 0;
|
: 0;
|
||||||
},
|
},
|
||||||
endorsementsForSelectedVehicle() {
|
selectedVehicleHasEndorsements() {
|
||||||
const vehicle = this.policyVehicles.find((policyVehicle) =>
|
const vehicle = this.policyVehicles.find((policyVehicle) =>
|
||||||
policyVehicle?.vin === this.selectedVehicleVin);
|
policyVehicle?.vin === this.selectedVehicleVin);
|
||||||
if (!vehicle) {
|
if (!vehicle) {
|
||||||
return undefined;
|
return false;
|
||||||
}
|
}
|
||||||
return vehicle.endorsements?.length > 0;
|
return vehicle.endorsements?.length > 0;
|
||||||
},
|
},
|
||||||
|
|
@ -206,12 +206,10 @@ export default {
|
||||||
{},
|
{},
|
||||||
{}
|
{}
|
||||||
);
|
);
|
||||||
} else if (this.endorsementsForSelectedVehicle) {
|
} else if (this.selectedVehicleHasEndorsements) {
|
||||||
this.$router.navigate(
|
this.$router.navigate(
|
||||||
this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
|
this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
|
||||||
this.$route,
|
this.$route
|
||||||
{},
|
|
||||||
{}
|
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
this.$router.navigate(
|
this.$router.navigate(
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue