commit
f4f2ae3a7d
8 changed files with 548 additions and 243 deletions
|
|
@ -16,8 +16,10 @@ module.exports = {
|
|||
"!src/layouts/capability-questions/**/*.vue",
|
||||
"!src/layouts/part-questions/**/*.vue",
|
||||
"!src/layouts/reveal/**/*.vue",
|
||||
"!src/layouts/quote/**/*.vue",
|
||||
"!src/ux-components/text-link/**/*.vue",
|
||||
"!src/common-components/question-chain/**/*.vue",
|
||||
"!src/common-components/funnel-header/menu-modal/**/*.vue",
|
||||
// END
|
||||
], // ! means exclude from coverage.
|
||||
testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ export default {
|
|||
questionData: Object,
|
||||
validationRules: String,
|
||||
modelValue: Array,
|
||||
partIndex: Number,
|
||||
glassIndex: Number,
|
||||
keyString: String,
|
||||
},
|
||||
async created() {
|
||||
|
|
@ -41,43 +41,43 @@ export default {
|
|||
await useValidateForm(); // do a test validation check, without triggering full validation
|
||||
|
||||
this.questionData.map((q, i) => {
|
||||
let answerPair = [];
|
||||
const question = {
|
||||
questionText: q.questionText,
|
||||
questionSequence: q.questionSequence,
|
||||
answers: q.answers.map((a) => {
|
||||
answerPair.push(a.nextQuestionSequence ? a.nextQuestionSequence : a.answerResult);
|
||||
return {
|
||||
Text: a.answerText,
|
||||
// Name will either be nextQuestionSequence or answerResult
|
||||
// Name will be used by list-button as the input value.
|
||||
// It must be a single string or number, so concatenating together a string with
|
||||
// 4 pieces of data separated by pipe characters:
|
||||
// question number|type of answer|answer value|answer text
|
||||
Name: a.nextQuestionSequence ?
|
||||
q.questionSequence + "|nextQuestion|" + a.nextQuestionSequence + "|" + a.answerText :
|
||||
q.questionSequence + "|answer|" + a.answerResult + "|" + a.answerText,
|
||||
nextQuestionSequence: a.nextQuestionSequence,
|
||||
answerResult: a.answerResult,
|
||||
questionSequence: q.questionSequence,
|
||||
questionType: a.nextQuestionSequence ? "nextQuestion" : "answer",
|
||||
}
|
||||
}),
|
||||
answerSelected: q.answerSelected || "",
|
||||
};
|
||||
question.answerPair = answerPair;
|
||||
if (!q.suppressQuestion) {
|
||||
this.questions.push(question);
|
||||
}
|
||||
let answerPair = [];
|
||||
const question = {
|
||||
questionText: q.questionText,
|
||||
questionSequence: q.questionSequence,
|
||||
answers: q.answers.map((a) => {
|
||||
answerPair.push(a.nextQuestionSequence ? a.nextQuestionSequence : a.answerResult);
|
||||
return {
|
||||
Text: a.answerText,
|
||||
// Name will either be nextQuestionSequence or answerResult
|
||||
// Name will be used by list-button as the input value.
|
||||
// It must be a single string or number, so concatenating together a string with
|
||||
// 4 pieces of data separated by pipe characters:
|
||||
// question number|type of answer|answer value|answer text
|
||||
Name: a.nextQuestionSequence ?
|
||||
q.questionSequence + "|nextQuestion|" + a.nextQuestionSequence + "|" + a.answerText :
|
||||
q.questionSequence + "|answer|" + a.answerResult + "|" + a.answerText,
|
||||
nextQuestionSequence: a.nextQuestionSequence,
|
||||
answerResult: a.answerResult,
|
||||
questionSequence: q.questionSequence,
|
||||
questionType: a.nextQuestionSequence ? "nextQuestion" : "answer",
|
||||
}
|
||||
}),
|
||||
answerSelected: q.answerSelected || "",
|
||||
};
|
||||
question.answerPair = answerPair;
|
||||
if (!q.suppressQuestion) {
|
||||
this.questions.push(question);
|
||||
}
|
||||
});
|
||||
|
||||
if (!this.modelValue?.length > 0) {
|
||||
// set this.currentQuestionNum to first valid question
|
||||
this.currentQuestionNum = this.questions[0].questionSequence;
|
||||
// scroll the next question into view
|
||||
this.$nextTick(() => {
|
||||
document.querySelector('.current-question').scrollIntoView({behavior: "smooth"});
|
||||
})
|
||||
if (!this.modelValue?.length > 0 && this.questions.length > 0) {
|
||||
// set this.currentQuestionNum to first valid question
|
||||
this.currentQuestionNum = this.questions[0].questionSequence;
|
||||
// scroll the next question into view
|
||||
this.$nextTick(() => {
|
||||
document.querySelector('.current-question').scrollIntoView({behavior: "smooth"});
|
||||
})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -151,7 +151,7 @@ export default {
|
|||
return {
|
||||
answerResult: questionAnswer,
|
||||
answeredQuestions: answeredQuestions,
|
||||
partIndex: this.partIndex,
|
||||
glassIndex: this.glassIndex,
|
||||
};
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@ const storeActions = {
|
|||
GET_PARTS: "getParts",
|
||||
GET_CAPABILITY_QUESTIONS: "getCapabilityQuestions",
|
||||
GET_PART_FROM_CAPABILITY_QUESTION_ANSWER: "getPartFromCapabilityQuestionAnswer",
|
||||
GET_MOLDING_QUESTIONS: "getMoldingQuestions",
|
||||
SAVE_ORDER: "saveOrder",
|
||||
LOAD_ORDER: "loadOrder",
|
||||
UPDATE_STORE_WITH_SAVE_ORDER_RESPONSE: "updateStoreWithSaveOrderResponse",
|
||||
|
|
@ -57,6 +58,7 @@ const storeActions = {
|
|||
SAVE_REGISTRATION_ADDRESS_LOOKUP: "saveRegistrationAddressLookup",
|
||||
SAVE_GLASS_PARTS: "saveGlassParts",
|
||||
SAVE_PART_QUESTION_ANSWERS: "savePartQuestionAnswers",
|
||||
SAVE_MOLDING_QUESTION_ANSWERS: "saveMoldingQuestionAnswers",
|
||||
SAVE_CAPABILITY_QUESTION_ANSWERS: "saveCapabilityQuestionAnswers"
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@ const storeMutations = {
|
|||
UPDATE_NUMBER_OF_CHIPS: "updateNumberOfChips",
|
||||
UPDATE_GLASS_TO_REPLACE: "updateGlassToReplace",
|
||||
UPDATE_PART_QUESTION_ANSWERS: "updatePartQuestionAnswers",
|
||||
UPDATE_MOLDING_QUESTION_ANSWERS: "updateMoldingQuestionAnswers",
|
||||
UPDATE_CAPABILITY_QUESTION_ANSWERS: "updateCapabilityQuestionAnswers",
|
||||
UPDATE_GLASS_PARTS: "updateGlassParts",
|
||||
UPDATE_OTHER_PARTS: "updateOtherParts",
|
||||
|
|
|
|||
|
|
@ -9,11 +9,11 @@
|
|||
<alert ref="alertFewMoreQuestions" class="my-5" alertClass="alert-warning"
|
||||
:manualHeadline="AlertFewMoreQuestionsHeader" :manualCopy="AlertFewMoreQuestionsCopy"
|
||||
v-bind:isDismissible="false" />
|
||||
<div v-for="(part, i) in capabilityQuestionsData" :key="part.key">
|
||||
<questionChain ref="questionChain" :keyString="part.key"
|
||||
v-model="selectedAnswers[part.glassLocation + '-' + part.glassName]"
|
||||
:questionData="part.capabilityQuestions" :partIndex="i"
|
||||
v-if="showThisPartQuestionChain(part, i)"
|
||||
<div v-for="(glass, i) in capabilityQuestionsData" :key="glass.key">
|
||||
<questionChain ref="questionChain" :keyString="glass.key"
|
||||
v-model="selectedAnswers[glass.glassLocation + '-' + glass.glassName]"
|
||||
:questionData="glass.capabilityQuestions" :glassIndex="i"
|
||||
v-if="showThisQuestionChain(glass, i)"
|
||||
validationRules="questions-required" />
|
||||
</div>
|
||||
<funnel-footer ref="funnelFooter" cmsWidgetName="FunnelFooterWidget"
|
||||
|
|
@ -73,11 +73,9 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
selectedAnswer: [],
|
||||
capabilityQuestionsData: store.getters.pageData(fmgPageValues.CAPABILITY_QUESTIONS).partsOrQuestions,
|
||||
selectedAnswers: {},
|
||||
currentQuestionChainIndex: 0,
|
||||
newAnswersArray: [],
|
||||
foundDuplicateQuestions: [],
|
||||
};
|
||||
},
|
||||
|
|
@ -102,33 +100,33 @@ export default {
|
|||
this.loadInitialCapabilityQuestionsData();
|
||||
},
|
||||
methods: {
|
||||
showThisPartQuestionChain(part, i) {
|
||||
if (part.capabilityQuestions?.length < 1 || part.isSuppressedPart) { return false; } // return false if no capabilityQuestions or if suppressed
|
||||
return this.currentQuestionChainIndex === i || part.answerData?.answerResult?.length > 0
|
||||
showThisQuestionChain(glass, i) {
|
||||
if (!glass.capabilityQuestions || glass.capabilityQuestions?.length < 1 || glass.isSuppressedPart) { return false; } // return false if no capabilityQuestions or if suppressed
|
||||
return this.currentQuestionChainIndex === i || glass.answerData?.answerResult?.length > 0;
|
||||
},
|
||||
arePagePrerequisitesValid() {
|
||||
const capabilityQuestionsPageData = store.getters.pageData(fmgPageValues.CAPABILITY_QUESTIONS);
|
||||
return capabilityQuestionsPageData && Object.keys(capabilityQuestionsPageData).length > 0;
|
||||
},
|
||||
async forwardButtonAction() {
|
||||
const capabilityQuestionsAnswersArray = this.capabilityQuestionsData.map((item) => {
|
||||
const selectedAnswerResult1 = item.answerData.answerResult;
|
||||
const selectedAnswerResult2 = item.answerData.answerResult2;
|
||||
const capabilityQuestionsAnswersArray = this.capabilityQuestionsData.map((glass) => {
|
||||
const selectedAnswerResult1 = glass.answerData.answerResult;
|
||||
const selectedAnswerResult2 = glass.answerData.answerResult2;
|
||||
|
||||
return {
|
||||
glassLocation: item.glassLocation,
|
||||
glassName: item.glassName,
|
||||
result: item.answerData.answerResult,
|
||||
glassLocation: glass.glassLocation,
|
||||
glassName: glass.glassName,
|
||||
result: glass.answerData.answerResult,
|
||||
result1: selectedAnswerResult1,
|
||||
result2: selectedAnswerResult2,
|
||||
answeredQuestions: item.answerData.answeredQuestions,
|
||||
isSuppressedPart: item.isSuppressedPart,
|
||||
answeredQuestions: glass.answerData.answeredQuestions,
|
||||
isSuppressedPart: glass.isSuppressedPart,
|
||||
};
|
||||
});
|
||||
|
||||
// clear out answerData for future page loads; must occur prior to store save
|
||||
this.capabilityQuestionsData.forEach((part) => {
|
||||
part.answerData = {};
|
||||
this.capabilityQuestionsData.forEach((glass) => {
|
||||
glass.answerData = {};
|
||||
});
|
||||
|
||||
// save to vuex store as order.damage.capabilityQuestionAnswers (array)
|
||||
|
|
@ -160,16 +158,9 @@ export default {
|
|||
"questionText": "Is your Grand Cherokee the Laredo model?",
|
||||
"selectedAnswerText": "Yes",
|
||||
"questionNum": 1,
|
||||
"extra": {
|
||||
"Text": "Yes",
|
||||
"nextQuestionSequence": null,
|
||||
"answerResult": "DD11132",
|
||||
"questionSequence": 1,
|
||||
"questionType": "answer"
|
||||
}
|
||||
}
|
||||
],
|
||||
"partIndex": 0
|
||||
"glassIndex": 0
|
||||
}
|
||||
*/
|
||||
|
||||
|
|
@ -192,18 +183,18 @@ export default {
|
|||
// HANDLE DUPLICATE QUESTIONS
|
||||
|
||||
// loop through all glass parts data
|
||||
this.capabilityQuestionsData.forEach((glassPart, gpIndex) => {
|
||||
this.capabilityQuestionsData.forEach((glass, gpIndex) => {
|
||||
|
||||
// only look for duplicates forward... to parts that follow after the currently being answered part
|
||||
if (gpIndex > answer.partIndex) {
|
||||
if (gpIndex > answer.glass) {
|
||||
|
||||
let suppressUntil;
|
||||
// reset this glass part, in case user is changing their previous answers
|
||||
glassPart.answerData = null;
|
||||
glassPart.isSuppressedPart = null;
|
||||
glass.answerData = null;
|
||||
glass.isSuppressedPart = null;
|
||||
|
||||
// loop through this glass part's part questions, looking for a questionText match
|
||||
glassPart.capabilityQuestions.forEach((pq, pqIndex) => {
|
||||
glass.capabilityQuestions.forEach((pq, pqIndex) => {
|
||||
|
||||
// clear out any previously set answers
|
||||
pq.answerSelected = null;
|
||||
|
|
@ -223,7 +214,7 @@ export default {
|
|||
// if these match then we have a duplicate question
|
||||
if (pq.questionText.toUpperCase() === answeredQuestionText) {
|
||||
|
||||
const thisAnsweredCapabilityQuestion = glassPart.capabilityQuestions[pqIndex];
|
||||
const thisAnsweredCapabilityQuestion = glass.capabilityQuestions[pqIndex];
|
||||
let matchedAnswer;
|
||||
let rejectedAnswers = []; // set as an array, in case we ever have questions with more than 2 answers...
|
||||
|
||||
|
|
@ -245,7 +236,7 @@ export default {
|
|||
|
||||
if (matchedAnswer.nextQuestionSequence) {
|
||||
// ensure that the question that the accepted answer has set to be next is NOT suppressed
|
||||
glassPart.capabilityQuestions[matchedAnswer.nextQuestionSequence - 1].suppressQuestion = null;
|
||||
glass.capabilityQuestions[matchedAnswer.nextQuestionSequence - 1].suppressQuestion = null;
|
||||
// if the duplicate is the 1ST question, then set suppressUntil var to lowest nextQuestion number
|
||||
if (pqIndex === 0) {
|
||||
if (!suppressUntil) { suppressUntil = matchedAnswer.nextQuestionSequence }
|
||||
|
|
@ -254,7 +245,7 @@ export default {
|
|||
}
|
||||
|
||||
// handle suppressing upstream in this question chain
|
||||
glassPart.capabilityQuestions.forEach((q) => {
|
||||
glass.capabilityQuestions.forEach((q) => {
|
||||
q.answers.forEach((thisAns) => {
|
||||
// restore any of the answers that formerly led to the duplicated question
|
||||
if (thisAns.originalNextQuestionSequence === pq.questionSequence) {
|
||||
|
|
@ -288,7 +279,7 @@ export default {
|
|||
// suppress current question
|
||||
thisAnsweredCapabilityQuestion.suppressQuestion = true;
|
||||
|
||||
const thisGlassPart = "glassPart" + gpIndex;
|
||||
const thisGlassPart = "glass" + gpIndex;
|
||||
if (this.foundDuplicateQuestions[thisGlassPart]) {
|
||||
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredCapabilityQuestion.questionSequence)) {
|
||||
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredCapabilityQuestion.questionSequence);
|
||||
|
|
@ -298,7 +289,7 @@ export default {
|
|||
}
|
||||
|
||||
// are there any questions left that are not suppressed?
|
||||
const remainingQuestions = glassPart.capabilityQuestions.filter((q) => {
|
||||
const remainingQuestions = glass.capabilityQuestions.filter((q) => {
|
||||
return !q.suppressQuestion;
|
||||
});
|
||||
|
||||
|
|
@ -313,14 +304,14 @@ export default {
|
|||
suppressQuestion: pq.suppressQuestion,
|
||||
};
|
||||
// set the answerData as 'already answered'
|
||||
glassPart.answerData = {
|
||||
glass.answerData = {
|
||||
answerResult: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
|
||||
answerResult1: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
|
||||
answeredQuestions: [answeredQuestionObj],
|
||||
};
|
||||
|
||||
// suppress this glassPart because it has an answer
|
||||
glassPart.isSuppressedPart = true;
|
||||
// suppress this glass because it has an answer
|
||||
glass.isSuppressedPart = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -346,9 +337,9 @@ export default {
|
|||
// "glassPart2": [7, 10]
|
||||
// };
|
||||
|
||||
const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.partIndex];
|
||||
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
|
||||
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
|
||||
const glassPartAnswered = this.capabilityQuestionsData[answer.partIndex];
|
||||
const glassPartAnswered = this.capabilityQuestionsData[answer.glassIndex];
|
||||
|
||||
thisPartsDupes?.forEach((dupe) => {
|
||||
// dupe is a single integer
|
||||
|
|
@ -404,7 +395,7 @@ export default {
|
|||
}
|
||||
|
||||
// this part has been fully answered, so advance to next part's question chain
|
||||
for (let i = answer.partIndex + 1; i < this.capabilityQuestionsData.length; i++) {
|
||||
for (let i = answer.glassIndex + 1; i < this.capabilityQuestionsData.length; i++) {
|
||||
// if this part has not yet been fully answered, then make it the current part
|
||||
if (!this.capabilityQuestionsData[i].answerData?.answerResult) {
|
||||
this.currentQuestionChainIndex = i;
|
||||
|
|
@ -425,11 +416,11 @@ export default {
|
|||
// are there alreadyAnsweredQuestions?
|
||||
const alreadyAnsweredQuestions = store.getters.damage.capabilityQuestionAnswers;
|
||||
|
||||
this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((part, i) => {
|
||||
part.key = part.glassLocation + "-" + part.glassName;
|
||||
this.selectedAnswers[part.key] = [];
|
||||
this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((glass, i) => {
|
||||
glass.key = glass.glassLocation + "-" + glass.glassName;
|
||||
this.selectedAnswers[glass.key] = [];
|
||||
if (!alreadyAnsweredQuestions) {
|
||||
part.answerData = null;
|
||||
glass.answerData = null;
|
||||
}
|
||||
|
||||
alreadyAnsweredQuestions?.forEach((savedPart) => {
|
||||
|
|
@ -437,7 +428,7 @@ export default {
|
|||
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) {
|
||||
return;
|
||||
}
|
||||
if (part.glassLocation === savedPart.glassLocation && part.glassName === savedPart.glassName) {
|
||||
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
|
||||
let answerString = "";
|
||||
|
||||
// matches; loop through answeredQuestions for matches
|
||||
|
|
@ -446,7 +437,7 @@ export default {
|
|||
return;
|
||||
}
|
||||
// determine which answer was previously chosen
|
||||
const theAns = part.capabilityQuestions[aq.questionNum - 1].answers.find((a) => {
|
||||
const theAns = glass.capabilityQuestions[aq.questionNum - 1].answers.find((a) => {
|
||||
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
|
||||
});
|
||||
if (theAns.nextQuestionSequence) {
|
||||
|
|
@ -456,18 +447,18 @@ export default {
|
|||
}
|
||||
|
||||
// mark this partQuestion as answered (question-chain will read this)
|
||||
part.capabilityQuestions[aq.questionNum - 1].answerSelected = answerString;
|
||||
glass.capabilityQuestions[aq.questionNum - 1].answerSelected = answerString;
|
||||
// mark this partQuestion as duplicate if it is (question-chain will read this)
|
||||
if (aq.suppressQuestion) {
|
||||
part.capabilityQuestions[aq.questionNum - 1].suppressQuestion = true;
|
||||
glass.capabilityQuestions[aq.questionNum - 1].suppressQuestion = true;
|
||||
}
|
||||
});
|
||||
|
||||
// advance the currentQuestionChainIndex
|
||||
this.currentQuestionChainIndex = i;
|
||||
|
||||
// add answerData to current part
|
||||
part.answerData = {
|
||||
// add answerData to current glass
|
||||
glass.answerData = {
|
||||
answerResult: savedPart.result,
|
||||
answerResult1: savedPart.result,
|
||||
answerResult2: this.getCorrespondingAnswerResult2(savedPart.result),
|
||||
|
|
@ -477,14 +468,14 @@ export default {
|
|||
|
||||
});
|
||||
|
||||
// Set up watch for each set of part questions, which gets updated when all questions for a part have been answered
|
||||
this.$watch("selectedAnswers." + part.key, (newValue) => {
|
||||
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
|
||||
this.$watch("selectedAnswers." + glass.key, (newValue) => {
|
||||
if (newValue) {
|
||||
this.handleAnswerUpdates(newValue);
|
||||
}
|
||||
}, { deep: true })
|
||||
|
||||
return part;
|
||||
return glass;
|
||||
});
|
||||
|
||||
},
|
||||
|
|
|
|||
|
|
@ -11,22 +11,23 @@
|
|||
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage=false />
|
||||
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
|
||||
<div class="fade-on-route-transition sub-container make-tall">
|
||||
<h1>MOLDING QUESTIONS TEMPORARY PLACEHOLDER</h1>
|
||||
<alert
|
||||
ref="alertFewMoreQuestions"
|
||||
cmsWidgetName="AlertFewMoreQuestionsWidget"
|
||||
class="my-5"
|
||||
alertClass="alert-warning"
|
||||
:manualHeadline="AlertFewMoreQuestionsHeader"
|
||||
:manualCopy="AlertFewMoreQuestionsCopy"
|
||||
v-bind:isDismissible="false"
|
||||
/>
|
||||
<div v-for="(part, i) in moldingQuestionsData" :key="i">
|
||||
<div v-for="(glass, i) in moldingQuestionsData" :key="glass.key">
|
||||
<questionChain
|
||||
ref="questionChain"
|
||||
v-model="selectedModel"
|
||||
:questionData="part"
|
||||
:partIndex="i"
|
||||
v-if="showThisPartQuestionChain(part, i)"
|
||||
:keyString="glass.key"
|
||||
v-model="selectedAnswers[glass.glassLocation + '-' + glass.glassName]"
|
||||
:questionData="glass.questions"
|
||||
:glassIndex="i"
|
||||
v-if="showThisQuestionChain(glass, i)"
|
||||
validationRules="questions-required"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -63,7 +64,6 @@ import { Form, defineRule } from "vee-validate";
|
|||
import { required } from "@/helpers/validation-rules";
|
||||
import { errorMessages } from "@/constants/error-messages";
|
||||
import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
|
||||
import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
|
||||
|
||||
// DEFINE VALIDATION RULES
|
||||
defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
|
||||
|
|
@ -92,89 +92,391 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
selectedModel: [],
|
||||
partsQuestionsData: this.$store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS).partsOrQuestions.filter((p) => {
|
||||
if (Array.isArray(p.partQuestions) && p.partQuestions.length > 0) {
|
||||
return {
|
||||
glassName: p.glassName,
|
||||
glassLocation: p.glassLocation,
|
||||
partQuestions: p.partQuestions,
|
||||
};
|
||||
}
|
||||
}),
|
||||
currentPartNum: 0,
|
||||
moldingQuestionsData: store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS).partsOrQuestions,
|
||||
selectedAnswers: {},
|
||||
currentGlassIndex: 0,
|
||||
foundDuplicateQuestions: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
AlertFewMoreQuestionsHeader() {
|
||||
return this.getCmsContent("AlertPartsQuestions", "HeadlineText");
|
||||
return this.getCmsContent("AdditionalPartsQuestionsAlert", "HeadlineText");
|
||||
},
|
||||
AlertFewMoreQuestionsCopy() {
|
||||
return this.getCmsContent("AlertPartsQuestions", "BodyText");
|
||||
return this.getCmsContent("AdditionalPartsQuestionsAlert", "BodyText");
|
||||
},
|
||||
pageData() {
|
||||
return this.$store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.LoadInitialData();
|
||||
},
|
||||
methods: {
|
||||
arePagePrerequisitesValid() {
|
||||
return false; // TODO - DO TRUE TEST OF PAGEDATA
|
||||
// return Object.keys(store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS)).length > 0;
|
||||
const moldingQuestionsFromPageData = store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS);
|
||||
return moldingQuestionsFromPageData && Object.keys(moldingQuestionsFromPageData).length > 0;
|
||||
},
|
||||
showThisPartQuestionChain(part, i) {
|
||||
if (part.partQuestions?.length < 1) { return false; } // return false if only one partQuestion
|
||||
if (this.currentPartNum === i || part.answerData?.answerResult.length > 0) { return true; }
|
||||
return false;
|
||||
},
|
||||
backButtonAction() {
|
||||
// route to move backwards
|
||||
this.$router.navigateWithoutSaving(
|
||||
this.navigationScenarios.CLICKED_BACK,
|
||||
this.$route
|
||||
);
|
||||
showThisQuestionChain(glass, i) {
|
||||
if (glass.questions?.length < 1 || glass.isSuppressedPart) { return false; } // return false if no questions or if suppressed
|
||||
return this.currentGlassIndex === i || glass.answerData?.answerResult?.length > 0;
|
||||
},
|
||||
async forwardButtonAction() {
|
||||
const partQuestionAnswersArray = this.partsQuestionsData.map((item) => {
|
||||
const questionAnswersArray = this.moldingQuestionsData.map((glass) => {
|
||||
return {
|
||||
glassLocation: item.glassLocation,
|
||||
glassName: item.glassName,
|
||||
result: item.answerData.answerResult,
|
||||
answeredQuestions: item.answerData.answeredQuestions,
|
||||
glassLocation: glass.glassLocation,
|
||||
glassName: glass.glassName,
|
||||
partNum: glass.answerData.answerResult,
|
||||
answeredQuestions: glass.answerData.answeredQuestions,
|
||||
isSuppressedPart: glass.isSuppressedPart,
|
||||
};
|
||||
});
|
||||
|
||||
// save to vuex store as order.damage.partQuestionAnswers (array)
|
||||
await this.dispatchStoreAction(this.storeActions.SAVE_PART_QUESTION_ANSWERS, partQuestionAnswersArray, false);
|
||||
// clear out answerData for future page loads; must occur prior to store save
|
||||
this.moldingQuestionsData.forEach((glass) => {
|
||||
glass.answerData = {};
|
||||
});
|
||||
|
||||
// save to vuex store as order.damage.partQuestionAnswers (array)
|
||||
await this.dispatchStoreAction(this.storeActions.SAVE_MOLDING_QUESTION_ANSWERS, questionAnswersArray, false);
|
||||
|
||||
// get parts from the questionAnswers
|
||||
let partsOrQuestions = this.pageData.partsOrQuestions;
|
||||
for (let answer of questionAnswersArray) {
|
||||
partsOrQuestions.find(partOrQuestion => {
|
||||
return partOrQuestion.glassLocation === answer.glassLocation && partOrQuestion.glassName === answer.glassName;
|
||||
}).parts[0].childParts = [
|
||||
{
|
||||
partNumber: answer.partNum
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
this.navigateForward(partsOrQuestions);
|
||||
},
|
||||
handleAnswerUpdates(key, answer) {
|
||||
// only runs when all questions in a question-chain have been answered
|
||||
// when selectedAnswers updates, user has completed this part's question chain and has a final answer
|
||||
// (does not get run for each invididual question's answer, only when
|
||||
// all relevent questions for the current part have been answered)
|
||||
|
||||
/*
|
||||
answer example format:
|
||||
{
|
||||
"answerResult": "DD11132",
|
||||
"answeredQuestions": [
|
||||
{
|
||||
"questionText": "Is your Grand Cherokee the Laredo model?",
|
||||
"selectedAnswerText": "Yes",
|
||||
"questionNum": 1,
|
||||
}
|
||||
],
|
||||
"glassIndex": 0
|
||||
}
|
||||
*/
|
||||
|
||||
// collect a list of the answered questions' numbers, needed later below
|
||||
const answeredQuestionIndexes = [];
|
||||
|
||||
// if user has answered a question differently than anything that was preloaded,
|
||||
// we need to clear out any preloaded answers
|
||||
this.selectedAnswers = {};
|
||||
|
||||
// loop through every answered question on the currently answered glass part
|
||||
answer.answeredQuestions?.forEach((aq) => {
|
||||
|
||||
// keep track of this question number
|
||||
answeredQuestionIndexes.push(aq.questionNum);
|
||||
|
||||
const answeredQuestionText = aq.questionText.toUpperCase();
|
||||
const answeredQuestionAnswer = aq.selectedAnswerText.toUpperCase();
|
||||
|
||||
// HANDLE DUPLICATE QUESTIONS
|
||||
|
||||
// loop through all glass parts data
|
||||
this.moldingQuestionsData.forEach((glass, gpIndex) => {
|
||||
|
||||
// only look for duplicates forward... to parts that follow after the currently being answered part
|
||||
if (gpIndex > answer.glassIndex) {
|
||||
|
||||
let suppressUntil;
|
||||
// reset this glass part, in case user is changing their previous answers
|
||||
glass.answerData = null;
|
||||
glass.isSuppressedPart = null;
|
||||
|
||||
// loop through this glass part's part questions, looking for a questionText match
|
||||
glass.questions.forEach((pq, pqIndex) => {
|
||||
|
||||
// clear out any previously set answers
|
||||
pq.answerSelected = null;
|
||||
|
||||
// clear or set suppressQuestion property for each question
|
||||
if (suppressUntil) {
|
||||
// if suppressUntil has been set, then suppress this question if before it
|
||||
if (pqIndex + 1 < suppressUntil) {
|
||||
pq.suppressQuestion = true;
|
||||
} else {
|
||||
pq.suppressQuestion = null;
|
||||
}
|
||||
} else {
|
||||
pq.suppressQuestion = null;
|
||||
}
|
||||
|
||||
// if these match then we have a duplicate question
|
||||
if (pq.questionText.toUpperCase() === answeredQuestionText) {
|
||||
|
||||
const thisAnsweredPartQuestion = glass.questions[pqIndex];
|
||||
let matchedAnswer;
|
||||
let rejectedAnswers = []; // set as an array, in case we ever have questions with more than 2 answers...
|
||||
|
||||
// which one of this questions' answers matches our answer?
|
||||
pq.answers.forEach((ans) => {
|
||||
if (ans.answerText.toUpperCase() === answeredQuestionAnswer) {
|
||||
matchedAnswer = ans;
|
||||
ans.selected = true;
|
||||
} else {
|
||||
rejectedAnswers.push(ans);
|
||||
ans.selected = null;
|
||||
}
|
||||
});
|
||||
|
||||
// Update the key to re-render this part's question-chain component
|
||||
this.moldingQuestionsData[gpIndex].key = this.moldingQuestionsData[gpIndex].glassLocation + this.moldingQuestionsData[gpIndex].glassName + Date.now().toString();
|
||||
|
||||
// handle suppressing downstream in this question chain
|
||||
|
||||
if (matchedAnswer.nextQuestionSequence) {
|
||||
// ensure that the question that the accepted answer has set to be next is NOT suppressed
|
||||
glass.questions[matchedAnswer.nextQuestionSequence - 1].suppressQuestion = null;
|
||||
// if the duplicate is the 1ST question, then set suppressUntil var to lowest nextQuestion number
|
||||
if (pqIndex === 0) {
|
||||
if (!suppressUntil) { suppressUntil = matchedAnswer.nextQuestionSequence }
|
||||
if (matchedAnswer.nextQuestionSequence < suppressUntil) { suppressUntil = matchedAnswer.nextQuestionSequence}
|
||||
}
|
||||
}
|
||||
|
||||
// handle suppressing upstream in this question chain
|
||||
glass.questions.forEach((q) => {
|
||||
q.answers.forEach((thisAns) => {
|
||||
// restore any of the answers that formerly led to the duplicated question
|
||||
if (thisAns.originalNextQuestionSequence === pq.questionSequence) {
|
||||
// restore original nextQuestionSequence
|
||||
thisAns.nextQuestionSequence = thisAns.originalNextQuestionSequence;
|
||||
this.originalNextQuestionSequence = null;
|
||||
// restore original answerResult
|
||||
if (thisAns.originalAnswerResult) {
|
||||
thisAns.answerResult = thisAns.originalAnswerResult;
|
||||
thisAns.originalAnswerResult = null;
|
||||
}
|
||||
}
|
||||
// search for any answers that lead to the duplicated question
|
||||
if (thisAns.nextQuestionSequence === pq.questionSequence) {
|
||||
// update either the nextQuestionSequence or the answerResult
|
||||
if (matchedAnswer.nextQuestionSequence) {
|
||||
thisAns.originalNextQuestionSequence = thisAns.nextQuestionSequence;
|
||||
thisAns.nextQuestionSequence = matchedAnswer.nextQuestionSequence;
|
||||
} else {
|
||||
thisAns.originalNextQuestionSequence = thisAns.nextQuestionSequence;
|
||||
thisAns.nextQuestionSequence = null;
|
||||
thisAns.originalAnswerResult = thisAns.originalAnswerResult || thisAns.answerResult;
|
||||
thisAns.answerResult = matchedAnswer.answerResult;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// suppress current question
|
||||
thisAnsweredPartQuestion.suppressQuestion = true;
|
||||
|
||||
const thisGlassPart = "glass" + gpIndex;
|
||||
if (this.foundDuplicateQuestions[thisGlassPart]) {
|
||||
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredPartQuestion.questionSequence)) {
|
||||
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredPartQuestion.questionSequence);
|
||||
}
|
||||
} else {
|
||||
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredPartQuestion.questionSequence];
|
||||
}
|
||||
|
||||
// are there any questions left that are not suppressed?
|
||||
const remainingQuestions = glass.questions.filter((q) => {
|
||||
return !q.suppressQuestion;
|
||||
});
|
||||
|
||||
if (remainingQuestions.length < 1) {
|
||||
// this is the final answer for this glass part
|
||||
|
||||
// mark this part as completely answered by adding answerData
|
||||
const answeredQuestionObj = {
|
||||
questionText: pq.questionText,
|
||||
selectedAnswerText: matchedAnswer.answerText,
|
||||
questionNum: pq.questionSequence,
|
||||
suppressQuestion: pq.suppressQuestion,
|
||||
};
|
||||
// set the answerData as 'already answered'
|
||||
glass.answerData = {
|
||||
answerResult: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
|
||||
answeredQuestions: [answeredQuestionObj],
|
||||
};
|
||||
|
||||
// suppress this glass because it has an answer
|
||||
glass.isSuppressedPart = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// Update the key to re-render this part's question-chain component
|
||||
this.moldingQuestionsData[gpIndex].key = this.moldingQuestionsData[gpIndex].glassLocation + this.moldingQuestionsData[gpIndex].glassName + Date.now().toString();
|
||||
|
||||
}
|
||||
|
||||
// call API parts method
|
||||
const partsLookup = await this.dispatchStoreAction(storeActions.GET_PARTS)
|
||||
.catch(() => {
|
||||
return this.$refs.funnelFooter.removeLoader();
|
||||
});
|
||||
|
||||
const glassNameAndPartsForStore = partsLookup.data.glassNameAndPartsForStore;
|
||||
});
|
||||
|
||||
const hasCapabilityQuestions = this.hasCapabilityQuestions(glassNameAndPartsForStore);
|
||||
// DETERMINE ANSWERED QUESTIONS LIST FOR THIS GLASS PART
|
||||
|
||||
if (hasCapabilityQuestions) {
|
||||
// if has capability questions
|
||||
// go to capability-questions page
|
||||
this.$router.navigateWithSaving(this.navigationScenarios.HAS_CAPABILITY_QUESTIONS,this.$route,{},{},{partsOrQuestions: glassNameAndPartsForStore});
|
||||
} else {
|
||||
// if single parts only
|
||||
const collectedGlassParts = this.reducedGlassPartsArray(glassNameAndPartsForStore);
|
||||
// save to store lineItems.glassParts
|
||||
this.$store.commit(storeMutations.UPDATE_GLASS_PARTS, collectedGlassParts);
|
||||
// go to heritage quote page
|
||||
this.$refs.loadingModal.showModal();
|
||||
navigateToHeritageFunnel();
|
||||
// look through all (this part's) part questions for any duplicates that were suppressed;
|
||||
// add them to the list of answered questions if found
|
||||
|
||||
// EX answeredQuestionIndexes: [1,5,11,13]
|
||||
|
||||
// EX this.foundDuplicateQuestions = {
|
||||
// "glassPart1": [1],
|
||||
// "glassPart2": [7, 10]
|
||||
// };
|
||||
|
||||
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
|
||||
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
|
||||
const glassPartAnswered = this.moldingQuestionsData[answer.glassIndex];
|
||||
|
||||
thisPartsDupes?.forEach((dupe) => {
|
||||
// dupe is a single integer
|
||||
const dupeQuestion = glassPartAnswered.questions[dupe - 1];
|
||||
const dupeQuestionAnswer = dupeQuestion.answers.find((q) => q.selected === true);
|
||||
|
||||
glassPartAnswered.questions.forEach((q) => {
|
||||
let includeThisDupeInAnsweredQuestions = false;
|
||||
|
||||
// did one of the answers of this question point to the duplicated question?
|
||||
q.answers.forEach((a) => {
|
||||
if ((dupe === a.originalNextQuestionSequence) &&
|
||||
(answeredQuestionIndexes.includes(q.questionSequence)) &&
|
||||
(a.answerText.toUpperCase() === dupeQuestionAnswer.answerText.toUpperCase())) {
|
||||
includeThisDupeInAnsweredQuestions = true;
|
||||
}
|
||||
});
|
||||
|
||||
// is this q.questionSequence listed as the duplicated question's nextQuestionSequence?
|
||||
if ((q.questionSequence === dupeQuestionAnswer.nextQuestionSequence) && (answeredQuestionIndexes.includes(q.questionSequence))) {
|
||||
includeThisDupeInAnsweredQuestions = true;
|
||||
}
|
||||
|
||||
if (includeThisDupeInAnsweredQuestions) {
|
||||
completeAnsweredQuestions.push({
|
||||
questionNum: dupeQuestion.questionSequence,
|
||||
questionText: dupeQuestion.questionText,
|
||||
selectedAnswerText: dupeQuestionAnswer.answerText,
|
||||
suppressQuestion: dupeQuestion.suppressQuestion,
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// make sure there are no duplicated dupes in the list...
|
||||
const foundInCompleteAnsweredQuestions = new Set();
|
||||
let filteredCompleteAnsweredQuestions = completeAnsweredQuestions.filter(el => {
|
||||
const duplicate = foundInCompleteAnsweredQuestions.has(el.questionText);
|
||||
foundInCompleteAnsweredQuestions.add(el.questionText);
|
||||
return !duplicate;
|
||||
});
|
||||
filteredCompleteAnsweredQuestions = filteredCompleteAnsweredQuestions.sort((a,b) => a.questionNum - b.questionNum);
|
||||
|
||||
// set final answer data for the current answered glass part
|
||||
glassPartAnswered.answerData = {
|
||||
answerResult: answer.answerResult,
|
||||
answeredQuestions: filteredCompleteAnsweredQuestions,
|
||||
}
|
||||
|
||||
// this part has been fully answered, so advance to next molding question chain
|
||||
for (let i = answer.glassIndex + 1; i < this.moldingQuestionsData.length; i++) {
|
||||
// if this part has not yet been fully answered, then make it the current part
|
||||
if (!this.moldingQuestionsData[i].answerData?.answerResult) {
|
||||
this.currentGlassIndex = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
selectedModel(model) {
|
||||
this.moldingQuestionsData[model.partIndex].answerData = {
|
||||
answerResult: model.answerResult,
|
||||
answeredQuestions: model.answeredQuestions,
|
||||
}
|
||||
this.currentPartNum = model.partIndex + 1;
|
||||
LoadInitialData() {
|
||||
|
||||
// are there alreadyAnsweredQuestions?
|
||||
const alreadyAnsweredQuestions = store.getters.damage.moldingQuestionAnswers;
|
||||
|
||||
this.moldingQuestionsData = this.pageData.partsOrQuestions.filter(x => x.parts[0].childPartQuestions.length).map((glass, i) => {
|
||||
glass.key = glass.glassLocation + "-" + glass.glassName;
|
||||
// NOTE: property "questions" can differ between layouts
|
||||
glass.questions = glass.parts[0].childPartQuestions;
|
||||
|
||||
this.selectedAnswers[glass.key] = [];
|
||||
if (!alreadyAnsweredQuestions) {
|
||||
glass.answerData = null;
|
||||
}
|
||||
|
||||
alreadyAnsweredQuestions?.forEach((savedPart) => {
|
||||
|
||||
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.partNum) {
|
||||
return;
|
||||
}
|
||||
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
|
||||
let answerString = "";
|
||||
|
||||
// matches; loop through answeredQuestions for matches
|
||||
savedPart.answeredQuestions.forEach((aq) => {
|
||||
if (!aq.questionNum || !aq.selectedAnswerText) {
|
||||
return;
|
||||
}
|
||||
// determine which answer was previously chosen
|
||||
const theAns = glass.questions[aq.questionNum-1].answers.find((a) => {
|
||||
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
|
||||
});
|
||||
if (theAns.nextQuestionSequence) {
|
||||
answerString = `${aq.questionNum}|nextQuestion|${theAns.nextQuestionSequence}|${theAns.answerText}`
|
||||
} else {
|
||||
answerString = `${aq.questionNum}|answer|${theAns.answerResult}|${theAns.answerText}`
|
||||
}
|
||||
|
||||
// mark this partQuestion as answered (question-chain will read this)
|
||||
glass.questions[aq.questionNum-1].answerSelected = answerString;
|
||||
// mark this partQuestion as duplicate if it is (question-chain will read this)
|
||||
if (aq.suppressQuestion) {
|
||||
glass.questions[aq.questionNum-1].suppressQuestion = true;
|
||||
}
|
||||
});
|
||||
|
||||
// advance the currentGlassIndex
|
||||
this.currentGlassIndex = i;
|
||||
|
||||
// add answerData to current glass
|
||||
glass.answerData = {
|
||||
answerResult: savedPart.result,
|
||||
answeredQuestions: savedPart.answeredQuestions
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
|
||||
this.$watch("selectedAnswers." + glass.key, (newValue) => {
|
||||
if (newValue) {
|
||||
this.handleAnswerUpdates(glass.key, newValue);
|
||||
}
|
||||
}, {deep: true})
|
||||
|
||||
return glass;
|
||||
});
|
||||
|
||||
},
|
||||
},
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -20,14 +20,14 @@
|
|||
:manualCopy="AlertFewMoreQuestionsCopy"
|
||||
v-bind:isDismissible="false"
|
||||
/>
|
||||
<div v-for="(part, i) in partsQuestionsData" :key="part.key">
|
||||
<div v-for="(glass, i) in partsQuestionsData" :key="glass.key">
|
||||
<questionChain
|
||||
ref="questionChain"
|
||||
:keyString="part.key"
|
||||
v-model="selectedAnswers[part.glassLocation + '-' + part.glassName]"
|
||||
:questionData="part.partQuestions"
|
||||
:partIndex="i"
|
||||
v-if="showThisPartQuestionChain(part, i)"
|
||||
:keyString="glass.key"
|
||||
v-model="selectedAnswers[glass.glassLocation + '-' + glass.glassName]"
|
||||
:questionData="glass.questions"
|
||||
:glassIndex="i"
|
||||
v-if="showThisQuestionChain(glass, i)"
|
||||
validationRules="questions-required"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -91,13 +91,9 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
partsQuestionsFromApi: this.$store.getters.pageData(fmgPageValues.PART_QUESTIONS)?.partsOrQuestions.filter((p) => {
|
||||
return Array.isArray(p.partQuestions) && p.partQuestions.length > 0;
|
||||
}),
|
||||
partsQuestionsData: store.getters.pageData(fmgPageValues.PART_QUESTIONS).partsOrQuestions,
|
||||
selectedAnswers: {},
|
||||
currentPartNum: 0,
|
||||
newAnswersArray: [],
|
||||
partsQuestionsData: [],
|
||||
currentGlassIndex: 0,
|
||||
foundDuplicateQuestions: [],
|
||||
};
|
||||
},
|
||||
|
|
@ -108,35 +104,41 @@ export default {
|
|||
AlertFewMoreQuestionsCopy() {
|
||||
return this.getCmsContent("AlertPartsQuestions", "BodyText");
|
||||
},
|
||||
pageData() {
|
||||
return this.$store.getters.pageData(fmgPageValues.PART_QUESTIONS);
|
||||
}
|
||||
},
|
||||
mixins: [vehicleQuestionsMixin],
|
||||
mounted() {
|
||||
this.LoadInitialPartsData();
|
||||
this.LoadInitialData();
|
||||
},
|
||||
methods: {
|
||||
showThisPartQuestionChain(part, i) {
|
||||
if (part.partQuestions?.length < 1 || part.isSuppressedPart) { return false; } // return false if no partQuestions or if suppressed
|
||||
if (this.currentPartNum === i || part.answerData?.answerResult?.length > 0) { return true; }
|
||||
return false;
|
||||
arePagePrerequisitesValid() {
|
||||
const partQuestionsFromPageData = store.getters.pageData(fmgPageValues.PART_QUESTIONS);
|
||||
return partQuestionsFromPageData && Object.keys(partQuestionsFromPageData).length > 0;
|
||||
},
|
||||
showThisQuestionChain(glass, i) {
|
||||
if (!glass.questions || glass.questions?.length < 1 || glass.isSuppressedPart) { return false; } // return false if no questions or if suppressed
|
||||
return this.currentGlassIndex === i || glass.answerData?.answerResult?.length > 0;
|
||||
},
|
||||
async forwardButtonAction() {
|
||||
const partQuestionAnswersArray = this.partsQuestionsData.map((item) => {
|
||||
const questionAnswersArray = this.partsQuestionsData.map((glass) => {
|
||||
return {
|
||||
glassLocation: item.glassLocation,
|
||||
glassName: item.glassName,
|
||||
result: item.answerData.answerResult,
|
||||
answeredQuestions: item.answerData.answeredQuestions,
|
||||
isSuppressedPart: item.isSuppressedPart,
|
||||
glassLocation: glass.glassLocation,
|
||||
glassName: glass.glassName,
|
||||
result: glass.answerData.answerResult,
|
||||
answeredQuestions: glass.answerData.answeredQuestions,
|
||||
isSuppressedPart: glass.isSuppressedPart,
|
||||
};
|
||||
});
|
||||
|
||||
// clear out answerData for future page loads; must occur prior to store save
|
||||
this.partsQuestionsData.forEach((part) => {
|
||||
part.answerData = {};
|
||||
this.partsQuestionsData.forEach((glass) => {
|
||||
glass.answerData = {};
|
||||
});
|
||||
|
||||
// save to vuex store as order.damage.partQuestionAnswers (array)
|
||||
await this.dispatchStoreAction(this.storeActions.SAVE_PART_QUESTION_ANSWERS, partQuestionAnswersArray, false);
|
||||
await this.dispatchStoreAction(this.storeActions.SAVE_PART_QUESTION_ANSWERS, questionAnswersArray, false);
|
||||
|
||||
// call API parts method
|
||||
const partsLookup = await this.dispatchStoreAction(storeActions.GET_PARTS)
|
||||
|
|
@ -145,12 +147,9 @@ export default {
|
|||
});
|
||||
|
||||
const glassNameAndPartsForStore = partsLookup.data.glassNameAndParts;
|
||||
|
||||
this.navigateForward(glassNameAndPartsForStore);
|
||||
},
|
||||
arePagePrerequisitesValid() {
|
||||
const partQuestionsFromPageData = store.getters.pageData(fmgPageValues.PART_QUESTIONS);
|
||||
return partQuestionsFromPageData && Object.keys(partQuestionsFromPageData).length > 0;
|
||||
},
|
||||
handleAnswerUpdates(key, answer) {
|
||||
// only runs when all questions in a question-chain have been answered
|
||||
// when selectedAnswers updates, user has completed this part's question chain and has a final answer
|
||||
|
|
@ -166,16 +165,9 @@ export default {
|
|||
"questionText": "Is your Grand Cherokee the Laredo model?",
|
||||
"selectedAnswerText": "Yes",
|
||||
"questionNum": 1,
|
||||
"extra": {
|
||||
"Text": "Yes",
|
||||
"nextQuestionSequence": null,
|
||||
"answerResult": "DD11132",
|
||||
"questionSequence": 1,
|
||||
"questionType": "answer"
|
||||
}
|
||||
}
|
||||
],
|
||||
"partIndex": 0
|
||||
"glassIndex": 0
|
||||
}
|
||||
*/
|
||||
|
||||
|
|
@ -198,18 +190,18 @@ export default {
|
|||
// HANDLE DUPLICATE QUESTIONS
|
||||
|
||||
// loop through all glass parts data
|
||||
this.partsQuestionsData.forEach((glassPart, gpIndex) => {
|
||||
this.partsQuestionsData.forEach((glass, gpIndex) => {
|
||||
|
||||
// only look for duplicates forward... to parts that follow after the currently being answered part
|
||||
if (gpIndex > answer.partIndex) {
|
||||
if (gpIndex > answer.glassIndex) {
|
||||
|
||||
let suppressUntil;
|
||||
// reset this glass part, in case user is changing their previous answers
|
||||
glassPart.answerData = null;
|
||||
glassPart.isSuppressedPart = null;
|
||||
glass.answerData = null;
|
||||
glass.isSuppressedPart = null;
|
||||
|
||||
// loop through this glass part's part questions, looking for a questionText match
|
||||
glassPart.partQuestions.forEach((pq, pqIndex) => {
|
||||
// loop through this glass part's questions, looking for a questionText match
|
||||
glass.questions.forEach((pq, pqIndex) => {
|
||||
|
||||
// clear out any previously set answers
|
||||
pq.answerSelected = null;
|
||||
|
|
@ -229,11 +221,11 @@ export default {
|
|||
// if these match then we have a duplicate question
|
||||
if (pq.questionText.toUpperCase() === answeredQuestionText) {
|
||||
|
||||
const thisAnsweredPartQuestion = glassPart.partQuestions[pqIndex];
|
||||
const thisAnsweredQuestion = glass.questions[pqIndex];
|
||||
let matchedAnswer;
|
||||
let rejectedAnswers = []; // set as an array, in case we ever have questions with more than 2 answers...
|
||||
|
||||
// which one of this partQuestions' answers matches our answer?
|
||||
// which one of this questions' answers matches our answer?
|
||||
pq.answers.forEach((ans) => {
|
||||
if (ans.answerText.toUpperCase() === answeredQuestionAnswer) {
|
||||
matchedAnswer = ans;
|
||||
|
|
@ -251,7 +243,7 @@ export default {
|
|||
|
||||
if (matchedAnswer.nextQuestionSequence) {
|
||||
// ensure that the question that the accepted answer has set to be next is NOT suppressed
|
||||
glassPart.partQuestions[matchedAnswer.nextQuestionSequence - 1].suppressQuestion = null;
|
||||
glass.questions[matchedAnswer.nextQuestionSequence - 1].suppressQuestion = null;
|
||||
// if the duplicate is the 1ST question, then set suppressUntil var to lowest nextQuestion number
|
||||
if (pqIndex === 0) {
|
||||
if (!suppressUntil) { suppressUntil = matchedAnswer.nextQuestionSequence }
|
||||
|
|
@ -260,7 +252,7 @@ export default {
|
|||
}
|
||||
|
||||
// handle suppressing upstream in this question chain
|
||||
glassPart.partQuestions.forEach((q) => {
|
||||
glass.questions.forEach((q) => {
|
||||
q.answers.forEach((thisAns) => {
|
||||
// restore any of the answers that formerly led to the duplicated question
|
||||
if (thisAns.originalNextQuestionSequence === pq.questionSequence) {
|
||||
|
|
@ -290,19 +282,19 @@ export default {
|
|||
});
|
||||
|
||||
// suppress current question
|
||||
thisAnsweredPartQuestion.suppressQuestion = true;
|
||||
thisAnsweredQuestion.suppressQuestion = true;
|
||||
|
||||
const thisGlassPart = "glassPart" + gpIndex;
|
||||
const thisGlassPart = "glass" + gpIndex;
|
||||
if (this.foundDuplicateQuestions[thisGlassPart]) {
|
||||
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredPartQuestion.questionSequence)) {
|
||||
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredPartQuestion.questionSequence);
|
||||
if (!this.foundDuplicateQuestions[thisGlassPart].includes(thisAnsweredQuestion.questionSequence)) {
|
||||
this.foundDuplicateQuestions[thisGlassPart].push(thisAnsweredQuestion.questionSequence);
|
||||
}
|
||||
} else {
|
||||
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredPartQuestion.questionSequence];
|
||||
this.foundDuplicateQuestions[thisGlassPart] = [thisAnsweredQuestion.questionSequence];
|
||||
}
|
||||
|
||||
// are there any questions left that are not suppressed?
|
||||
const remainingQuestions = glassPart.partQuestions.filter((q) => {
|
||||
const remainingQuestions = glass.questions.filter((q) => {
|
||||
return !q.suppressQuestion;
|
||||
});
|
||||
|
||||
|
|
@ -317,13 +309,13 @@ export default {
|
|||
suppressQuestion: pq.suppressQuestion,
|
||||
};
|
||||
// set the answerData as 'already answered'
|
||||
glassPart.answerData = {
|
||||
glass.answerData = {
|
||||
answerResult: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult,
|
||||
answeredQuestions: [answeredQuestionObj],
|
||||
};
|
||||
|
||||
// suppress this glassPart because it has an answer
|
||||
glassPart.isSuppressedPart = true;
|
||||
// suppress this glass because it has an answer
|
||||
glass.isSuppressedPart = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -351,16 +343,16 @@ export default {
|
|||
// "glassPart2": [7, 10]
|
||||
// };
|
||||
|
||||
const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.partIndex];
|
||||
const thisPartsDupes = this.foundDuplicateQuestions["glass" + answer.glassIndex];
|
||||
const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : [];
|
||||
const glassPartAnswered = this.partsQuestionsData[answer.partIndex];
|
||||
const glassPartAnswered = this.partsQuestionsData[answer.glassIndex];
|
||||
|
||||
thisPartsDupes?.forEach((dupe) => {
|
||||
// dupe is a single integer
|
||||
const dupeQuestion = glassPartAnswered.partQuestions[dupe - 1];
|
||||
const dupeQuestion = glassPartAnswered.questions[dupe - 1];
|
||||
const dupeQuestionAnswer = dupeQuestion.answers.find((q) => q.selected === true);
|
||||
|
||||
glassPartAnswered.partQuestions.forEach((q) => {
|
||||
glassPartAnswered.questions.forEach((q) => {
|
||||
let includeThisDupeInAnsweredQuestions = false;
|
||||
|
||||
// did one of the answers of this question point to the duplicated question?
|
||||
|
|
@ -404,25 +396,28 @@ export default {
|
|||
}
|
||||
|
||||
// this part has been fully answered, so advance to next part's question chain
|
||||
for (let i = answer.partIndex + 1; i < this.partsQuestionsData.length; i++) {
|
||||
for (let i = answer.glassIndex + 1; i < this.partsQuestionsData.length; i++) {
|
||||
// if this part has not yet been fully answered, then make it the current part
|
||||
if (!this.partsQuestionsData[i].answerData?.answerResult) {
|
||||
this.currentPartNum = i;
|
||||
this.currentGlassIndex = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
LoadInitialPartsData() {
|
||||
LoadInitialData() {
|
||||
|
||||
// are there alreadyAnsweredQuestions?
|
||||
const alreadyAnsweredQuestions = store.getters.damage.partQuestionAnswers;
|
||||
|
||||
this.partsQuestionsData = this.partsQuestionsFromApi.map((part, i) => {
|
||||
part.key = part.glassLocation + "-" + part.glassName;
|
||||
this.selectedAnswers[part.key] = [];
|
||||
|
||||
this.partsQuestionsData = this.pageData.partsOrQuestions.filter(x => x.partQuestions).map((glass, i) => {
|
||||
glass.key = glass.glassLocation + "-" + glass.glassName;
|
||||
// NOTE: property "questions" can differ between layouts
|
||||
glass.questions = glass.partQuestions;
|
||||
|
||||
this.selectedAnswers[glass.key] = [];
|
||||
if (!alreadyAnsweredQuestions) {
|
||||
part.answerData = null;
|
||||
glass.answerData = null;
|
||||
}
|
||||
|
||||
alreadyAnsweredQuestions?.forEach((savedPart) => {
|
||||
|
|
@ -430,7 +425,7 @@ export default {
|
|||
if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) {
|
||||
return;
|
||||
}
|
||||
if (part.glassLocation === savedPart.glassLocation && part.glassName === savedPart.glassName) {
|
||||
if (glass.glassLocation === savedPart.glassLocation && glass.glassName === savedPart.glassName) {
|
||||
let answerString = "";
|
||||
|
||||
// matches; loop through answeredQuestions for matches
|
||||
|
|
@ -439,7 +434,7 @@ export default {
|
|||
return;
|
||||
}
|
||||
// determine which answer was previously chosen
|
||||
const theAns = part.partQuestions[aq.questionNum-1].answers.find((a) => {
|
||||
const theAns = glass.questions[aq.questionNum-1].answers.find((a) => {
|
||||
return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase();
|
||||
});
|
||||
if (theAns.nextQuestionSequence) {
|
||||
|
|
@ -448,19 +443,19 @@ export default {
|
|||
answerString = `${aq.questionNum}|answer|${theAns.answerResult}|${theAns.answerText}`
|
||||
}
|
||||
|
||||
// mark this partQuestion as answered (question-chain will read this)
|
||||
part.partQuestions[aq.questionNum-1].answerSelected = answerString;
|
||||
// mark this partQuestion as duplicate if it is (question-chain will read this)
|
||||
// mark this question as answered (question-chain will read this)
|
||||
glass.questions[aq.questionNum-1].answerSelected = answerString;
|
||||
// mark this question as duplicate if it is (question-chain will read this)
|
||||
if (aq.suppressQuestion) {
|
||||
part.partQuestions[aq.questionNum-1].suppressQuestion = true;
|
||||
glass.questions[aq.questionNum-1].suppressQuestion = true;
|
||||
}
|
||||
});
|
||||
|
||||
// advance the currentPartNum
|
||||
this.currentPartNum = i;
|
||||
// advance the currentGlassIndex
|
||||
this.currentGlassIndex = i;
|
||||
|
||||
// add answerData to current part
|
||||
part.answerData = {
|
||||
// add answerData to current glass
|
||||
glass.answerData = {
|
||||
answerResult: savedPart.result,
|
||||
answeredQuestions: savedPart.answeredQuestions
|
||||
}
|
||||
|
|
@ -468,14 +463,14 @@ export default {
|
|||
|
||||
});
|
||||
|
||||
// Set up watch for each set of part questions, which gets updated when all questions for a part have been answered
|
||||
this.$watch("selectedAnswers." + part.key, (newValue) => {
|
||||
// Set up watch for each set of glass questions, which gets updated when all questions for a glass have been answered
|
||||
this.$watch("selectedAnswers." + glass.key, (newValue) => {
|
||||
if (newValue) {
|
||||
this.handleAnswerUpdates(part.key, newValue);
|
||||
this.handleAnswerUpdates(glass.key, newValue);
|
||||
}
|
||||
}, {deep: true})
|
||||
|
||||
return part;
|
||||
return glass;
|
||||
});
|
||||
|
||||
},
|
||||
|
|
|
|||
|
|
@ -49,6 +49,7 @@ const getDefaultState = () => {
|
|||
numberOfChips: null,
|
||||
glassToReplace: null,
|
||||
partQuestionAnswers: null,
|
||||
moldingQuestionAnswers: null,
|
||||
capabilityQuestionAnswers: null
|
||||
},
|
||||
lineItems: {
|
||||
|
|
@ -127,6 +128,9 @@ export const mutations = {
|
|||
updatePartQuestionAnswers(state, answersArray) {
|
||||
state.order.damage.partQuestionAnswers = answersArray;
|
||||
},
|
||||
updateMoldingQuestionAnswers(state, answersArray) {
|
||||
state.order.damage.moldingQuestionAnswers = answersArray;
|
||||
},
|
||||
updateCapabilityQuestionAnswers(state, answersArray) {
|
||||
state.order.damage.capabilityQuestionAnswers = answersArray;
|
||||
},
|
||||
|
|
@ -281,6 +285,7 @@ export const mutations = {
|
|||
resetGlassPartsState(state) {
|
||||
state.order.lineItems.glassParts = null;
|
||||
state.order.damage.partQuestionAnswers = null;
|
||||
state.order.damage.moldingQuestionAnswers = null;
|
||||
state.order.damage.capabilityQuestionAnswers = null;
|
||||
state.applicationUser.pageData[fmgPageValues.PART_QUESTIONS] = null;
|
||||
state.applicationUser.pageData[fmgPageValues.VEHICLE_PARTS] = null;
|
||||
|
|
@ -1002,12 +1007,19 @@ export const actions = {
|
|||
!previousResultsArray.every((x, i) => x.result === partQuestionAnswersArray[i].result);
|
||||
|
||||
if (havePartQuestionAnswersChanged) {
|
||||
context.commit(storeMutations.UPDATE_MOLDING_QUESTION_ANSWERS, null);
|
||||
context.commit(storeMutations.UPDATE_CAPABILITY_QUESTION_ANSWERS, null);
|
||||
state.applicationUser.pageData[fmgPageValues.MOLDING_QUESTIONS] = null;
|
||||
state.applicationUser.pageData[fmgPageValues.CAPABILITY_QUESTIONS] = null;
|
||||
}
|
||||
|
||||
//Save new values
|
||||
context.commit(storeMutations.UPDATE_PART_QUESTION_ANSWERS, partQuestionAnswersArray);
|
||||
},
|
||||
saveMoldingQuestionAnswers(context, moldingQuestionAnswers) {
|
||||
//Save new values
|
||||
context.commit(storeMutations.UPDATE_MOLDING_QUESTION_ANSWERS, moldingQuestionAnswers);
|
||||
},
|
||||
saveCapabilityQuestionAnswers(context, capabilityQuestionAnswers) {
|
||||
//Save new values
|
||||
context.commit(storeMutations.UPDATE_CAPABILITY_QUESTION_ANSWERS, capabilityQuestionAnswers);
|
||||
|
|
|
|||
Loading…
Reference in a new issue