diff --git a/src/common-components/question-chain/question-chain.vue b/src/common-components/question-chain/question-chain.vue index 0b5f45363..4eaa0b69e 100644 --- a/src/common-components/question-chain/question-chain.vue +++ b/src/common-components/question-chain/question-chain.vue @@ -72,7 +72,7 @@ export default { this.currentQuestionNum = this.questions[0].questionSequence; // scroll the next question into view this.$nextTick(() => { - document.querySelector('.current-question').scrollIntoView({behavior: "smooth"}); + document.querySelector('.current-question')?.scrollIntoView({behavior: "smooth"}); }) } }, diff --git a/src/layouts/capability-questions/capability-questions.vue b/src/layouts/capability-questions/capability-questions.vue index 00200c31a..39b96c361 100644 --- a/src/layouts/capability-questions/capability-questions.vue +++ b/src/layouts/capability-questions/capability-questions.vue @@ -96,7 +96,17 @@ export default { } }, mounted() { - this.loadInitialCapabilityQuestionsData(); + // are there alreadyAnsweredQuestions? + const alreadyAnsweredQuestions = store.getters.damage.capabilityQuestionAnswers; + + this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((glass, i) => { + // NOTE: questions for property "questions" can differ between layouts + glass.questions = glass.capabilityQuestions; + // reset selectedAnswers for this glass + this.selectedAnswers[glass.key] = []; + // pass in: glass, i, alreadyAnsweredQuestions + return this.setupInitialData(glass, i, alreadyAnsweredQuestions); + }); }, methods: { showThisQuestionChain(glass, i) { @@ -109,14 +119,13 @@ export default { }, async forwardButtonAction() { const capabilityQuestionsAnswersArray = this.capabilityQuestionsData.map((glass) => { - const selectedAnswerResult1 = glass.answerData.answerResult; - const selectedAnswerResult2 = glass.answerData.answerResult2; + const selectedAnswerResult2 = this.getCorrespondingAnswerResult2(glass.answerData.answerResult); return { glassLocation: glass.glassLocation, glassName: glass.glassName, result: glass.answerData.answerResult, - result1: selectedAnswerResult1, + result1: glass.answerData.answerResult, result2: selectedAnswerResult2, answeredQuestions: glass.answerData.answeredQuestions, isSuppressedPart: glass.isSuppressedPart, @@ -255,7 +264,6 @@ export default { // restore original answerResult if (thisAns.originalAnswerResult) { thisAns.answerResult = thisAns.originalAnswerResult; - thisAns.answerResult1 = thisAns.originalAnswerResult; thisAns.originalAnswerResult = null; } } @@ -270,7 +278,6 @@ export default { thisAns.nextQuestionSequence = null; thisAns.originalAnswerResult = thisAns.originalAnswerResult || thisAns.answerResult; thisAns.answerResult = matchedAnswer.answerResult; - thisAns.answerResult1 = matchedAnswer.answerResult; } } }); @@ -306,7 +313,6 @@ export default { // set the answerData as 'already answered' glass.answerData = { answerResult: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult, - answerResult1: matchedAnswer.nextQuestionSequence ? matchedAnswer.nextQuestionSequence : matchedAnswer.answerResult, answeredQuestions: [answeredQuestionObj], }; @@ -383,14 +389,9 @@ export default { }); filteredCompleteAnsweredQuestions = filteredCompleteAnsweredQuestions.sort((a, b) => a.questionNum - b.questionNum); - const selectedAnswerResult1 = answer.answerResult; - const selectedAnswerResult2 = this.getCorrespondingAnswerResult2(selectedAnswerResult1); - // set final answer data for the current answered glass part glassPartAnswered.answerData = { - answerResult: selectedAnswerResult1, - answerResult1: selectedAnswerResult1, - answerResult2: selectedAnswerResult2, + answerResult: answer.answerResult, answeredQuestions: filteredCompleteAnsweredQuestions, } @@ -412,73 +413,6 @@ export default { .answers.find(answer => answer.answerResult == answerResult1) .answerResult2; }, - loadInitialCapabilityQuestionsData() { - // are there alreadyAnsweredQuestions? - const alreadyAnsweredQuestions = store.getters.damage.capabilityQuestionAnswers; - - this.capabilityQuestionsData = this.pageData.partsOrQuestions.filter(x => x.capabilityQuestions).map((glass, i) => { - glass.key = glass.glassLocation + "-" + glass.glassName; - this.selectedAnswers[glass.key] = []; - if (!alreadyAnsweredQuestions) { - glass.answerData = null; - } - - alreadyAnsweredQuestions?.forEach((savedPart) => { - - if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) { - 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.capabilityQuestions[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.capabilityQuestions[aq.questionNum - 1].answerSelected = answerString; - // mark this partQuestion as duplicate if it is (question-chain will read this) - if (aq.suppressQuestion) { - glass.capabilityQuestions[aq.questionNum - 1].suppressQuestion = true; - } - }); - - // advance the currentQuestionChainIndex - this.currentQuestionChainIndex = i; - - // add answerData to current glass - glass.answerData = { - answerResult: savedPart.result, - answerResult1: savedPart.result, - answerResult2: this.getCorrespondingAnswerResult2(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(newValue); - } - }, { deep: true }) - - return glass; - }); - - }, }, components: { funnelHeader, diff --git a/src/layouts/molding-questions/molding-questions.vue b/src/layouts/molding-questions/molding-questions.vue index 333e02e61..50cfe42c2 100644 --- a/src/layouts/molding-questions/molding-questions.vue +++ b/src/layouts/molding-questions/molding-questions.vue @@ -108,7 +108,17 @@ export default { } }, mounted() { - this.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) => { + // NOTE: questions for property "questions" can differ between layouts + glass.questions = glass.parts[0].childPartQuestions; + // reset selectedAnswers for this glass + this.selectedAnswers[glass.key] = []; + // pass in: glass, i, alreadyAnsweredQuestions + return this.setupInitialData(glass, i, alreadyAnsweredQuestions); + }); }, methods: { arePagePrerequisitesValid() { @@ -152,7 +162,7 @@ export default { this.navigateForward(partsOrQuestions); }, - handleAnswerUpdates(key, answer) { + handleAnswerUpdates(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 @@ -408,75 +418,6 @@ export default { } }, - 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.partNum, - 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: { funnelHeader, diff --git a/src/layouts/part-questions/part-questions.vue b/src/layouts/part-questions/part-questions.vue index 2cd4a99db..131a70f44 100644 --- a/src/layouts/part-questions/part-questions.vue +++ b/src/layouts/part-questions/part-questions.vue @@ -90,7 +90,7 @@ export default { }, data() { return { - partsQuestionsData: store.getters.pageData(fmgPageValues.PART_QUESTIONS).partsOrQuestions, + partsQuestionsData: [], selectedAnswers: {}, currentGlassIndex: 0, }; @@ -108,7 +108,17 @@ export default { }, mixins: [vehicleQuestionsMixin], mounted() { - this.LoadInitialData(); + // are there alreadyAnsweredQuestions? + const alreadyAnsweredQuestions = store.getters.damage.partQuestionAnswers; + + this.partsQuestionsData = this.pageData.partsOrQuestions.filter(x => x.partQuestions).map((glass, i) => { + // NOTE: questions for property "questions" can differ between layouts + glass.questions = glass.partQuestions; + // reset selectedAnswers for this glass + this.selectedAnswers[glass.key] = []; + // pass in: glass, i, alreadyAnsweredQuestions + return this.setupInitialData(glass, i, alreadyAnsweredQuestions); + }); }, methods: { arePagePrerequisitesValid() { @@ -148,7 +158,7 @@ export default { this.navigateForward(glassNameAndPartsForStore); }, - handleAnswerUpdates(key, answer) { + handleAnswerUpdates(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 @@ -404,75 +414,6 @@ export default { } }, - LoadInitialData() { - - // are there alreadyAnsweredQuestions? - const alreadyAnsweredQuestions = store.getters.damage.partQuestionAnswers; - - 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) { - glass.answerData = null; - } - - alreadyAnsweredQuestions?.forEach((savedPart) => { - - if (!savedPart.glassLocation || !savedPart.glassName || !savedPart.answeredQuestions || !savedPart.result) { - 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 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) { - 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: { funnelHeader, diff --git a/src/mixins/vehicle-questions-mixin.js b/src/mixins/vehicle-questions-mixin.js index 49d5f2a40..415fa1e6d 100644 --- a/src/mixins/vehicle-questions-mixin.js +++ b/src/mixins/vehicle-questions-mixin.js @@ -64,6 +64,68 @@ export default { currentPageComesAfterPage(currentPage = this.$route.query.fmgPage, fmgPage) { return this.comparePageIndices(currentPage, fmgPage) > 0; }, + setupInitialData(glass, i, alreadyAnsweredQuestions, vm) { + glass.key = glass.glassLocation + "-" + glass.glassName; + const self = vm ?? this; + // clear answerData if no questions are already answered + if (!alreadyAnsweredQuestions) { glass.answerData = null } + + alreadyAnsweredQuestions?.forEach((answeredGlass) => { + // if answeredGlass lacks any of these properties then exit + if (!answeredGlass.glassLocation || + !answeredGlass.glassName || + !answeredGlass.answeredQuestions || + !answeredGlass.result && !answeredGlass.partNum) { return } + + // test if glass parts match + if (glass.glassLocation === answeredGlass.glassLocation && glass.glassName === answeredGlass.glassName) { + let answerString = ""; + + // loop through answeredQuestions for matches + answeredGlass.answeredQuestions.forEach((aq) => { + if (!aq.questionNum || !aq.selectedAnswerText) { return } + // determine which answer was previously chosen + const chosenAns = glass.questions[aq.questionNum-1].answers.find((a) => { + return a.answerText.toUpperCase() === aq.selectedAnswerText.toUpperCase(); + }); + // set the answerString to use for answerSelected + if (chosenAns.nextQuestionSequence) { + answerString = `${aq.questionNum}|nextQuestion|${chosenAns.nextQuestionSequence}|${chosenAns.answerText}` + } else { + answerString = `${aq.questionNum}|answer|${chosenAns.answerResult}|${chosenAns.answerText}` + } + + // mark this question as answered (question-chain will read this) + glass.questions[aq.questionNum-1].answerSelected = answerString; + // mark this question as suppressed if needed (question-chain uses this) + if (aq.suppressQuestion) { glass.questions[aq.questionNum-1].suppressQuestion = true } + }); + + // advance the currentGlassIndex + self.currentGlassIndex = i; + + const answerResult = (answeredGlass.partNum) ? answeredGlass.partNum : answeredGlass.result; + // the above logic for answerResult covers all 3 ___-questions page scenarios + + // add answerData to current glass + glass.answerData = { + answerResult: answerResult, + answeredQuestions: answeredGlass.answeredQuestions + } + } + + }); + + // Set up watch for each set of glass questions + // (updated when all questions for a glass have been answered in question-chain) + self.$watch("selectedAnswers." + glass.key, (newValue) => { + if (newValue) { + self.handleAnswerUpdates(newValue); + } + }, {deep: true}) + + return glass; + }, // Can't use `this` because navigateForward is also called from vin-pages-mixin async navigateForward(partsOrQuestions, vm) { const self = vm ?? this;