From d288282c5eeb7338c7d4aecb666f22ab0a3d8e62 Mon Sep 17 00:00:00 2001 From: Adam Caouette Date: Fri, 26 Aug 2022 10:36:31 -0400 Subject: [PATCH] CSR-110: updates to other question pages for consistency --- .../capability-questions.vue | 83 +++++------ src/layouts/part-questions/part-questions.vue | 139 +++++++++--------- 2 files changed, 104 insertions(+), 118 deletions(-) diff --git a/src/layouts/capability-questions/capability-questions.vue b/src/layouts/capability-questions/capability-questions.vue index be43f0db2..5bdb8b285 100644 --- a/src/layouts/capability-questions/capability-questions.vue +++ b/src/layouts/capability-questions/capability-questions.vue @@ -9,11 +9,11 @@ -
- +
0 + showThisQuestionChain(glassPart, i) { + if (glassPart.capabilityQuestions?.length < 1 || glassPart.isSuppressedPart) { return false; } // return false if no capabilityQuestions or if suppressed + return this.currentQuestionChainIndex === i || glassPart.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((glassPart) => { + const selectedAnswerResult1 = glassPart.answerData.answerResult; + const selectedAnswerResult2 = glassPart.answerData.answerResult2; return { - glassLocation: item.glassLocation, - glassName: item.glassName, - result: item.answerData.answerResult, + glassLocation: glassPart.glassLocation, + glassName: glassPart.glassName, + result: glassPart.answerData.answerResult, result1: selectedAnswerResult1, result2: selectedAnswerResult2, - answeredQuestions: item.answerData.answeredQuestions, - isSuppressedPart: item.isSuppressedPart, + answeredQuestions: glassPart.answerData.answeredQuestions, + isSuppressedPart: glassPart.isSuppressedPart, }; }); // clear out answerData for future page loads; must occur prior to store save - this.capabilityQuestionsData.forEach((part) => { - part.answerData = {}; + this.capabilityQuestionsData.forEach((glassPart) => { + glassPart.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 + "glassPartIndex": 0 } */ @@ -195,7 +186,7 @@ export default { this.capabilityQuestionsData.forEach((glassPart, gpIndex) => { // only look for duplicates forward... to parts that follow after the currently being answered part - if (gpIndex > answer.partIndex) { + if (gpIndex > answer.glassPart) { let suppressUntil; // reset this glass part, in case user is changing their previous answers @@ -346,10 +337,10 @@ export default { // "glassPart2": [7, 10] // }; - const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.partIndex]; + const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.glassPartIndex]; const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : []; - const glassPartAnswered = this.capabilityQuestionsData[answer.partIndex]; - + const glassPartAnswered = this.capabilityQuestionsData[answer.glassPartIndex]; +debugger; // eslint-disable-line no-debugger thisPartsDupes?.forEach((dupe) => { // dupe is a single integer const dupeQuestion = glassPartAnswered.capabilityQuestions[dupe - 1]; @@ -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.glassPartIndex + 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((glassPart, i) => { + glassPart.key = glassPart.glassLocation + "-" + glassPart.glassName; + this.selectedAnswers[glassPart.key] = []; if (!alreadyAnsweredQuestions) { - part.answerData = null; + glassPart.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 (glassPart.glassLocation === savedPart.glassLocation && glassPart.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 = glassPart.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; + glassPart.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; + glassPart.capabilityQuestions[aq.questionNum - 1].suppressQuestion = true; } }); // advance the currentQuestionChainIndex this.currentQuestionChainIndex = i; - // add answerData to current part - part.answerData = { + // add answerData to current glassPart + glassPart.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 glassPart questions, which gets updated when all questions for a glassPart have been answered + this.$watch("selectedAnswers." + glassPart.key, (newValue) => { if (newValue) { this.handleAnswerUpdates(newValue); } }, { deep: true }) - return part; + return glassPart; }); }, diff --git a/src/layouts/part-questions/part-questions.vue b/src/layouts/part-questions/part-questions.vue index 7de6eb5a2..9f3227c70 100644 --- a/src/layouts/part-questions/part-questions.vue +++ b/src/layouts/part-questions/part-questions.vue @@ -20,14 +20,14 @@ :manualCopy="AlertFewMoreQuestionsCopy" v-bind:isDismissible="false" /> -
+
@@ -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: [], 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(glassPart, i) { + if (glassPart.questions?.length < 1 || glassPart.isSuppressedPart) { return false; } // return false if no questions or if suppressed + return this.currentPartNum === i || glassPart.answerData?.answerResult?.length > 0; }, async forwardButtonAction() { - const partQuestionAnswersArray = this.partsQuestionsData.map((item) => { + const questionAnswersArray = this.partsQuestionsData.map((glassPart) => { return { - glassLocation: item.glassLocation, - glassName: item.glassName, - result: item.answerData.answerResult, - answeredQuestions: item.answerData.answeredQuestions, - isSuppressedPart: item.isSuppressedPart, + glassLocation: glassPart.glassLocation, + glassName: glassPart.glassName, + result: glassPart.answerData.answerResult, + answeredQuestions: glassPart.answerData.answeredQuestions, + isSuppressedPart: glassPart.isSuppressedPart, }; }); // clear out answerData for future page loads; must occur prior to store save - this.partsQuestionsData.forEach((part) => { - part.answerData = {}; + this.partsQuestionsData.forEach((glassPart) => { + glassPart.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 + "glassPartIndex": 0 } */ @@ -201,15 +193,15 @@ export default { this.partsQuestionsData.forEach((glassPart, gpIndex) => { // only look for duplicates forward... to parts that follow after the currently being answered part - if (gpIndex > answer.partIndex) { + if (gpIndex > answer.glassPartIndex) { let suppressUntil; // reset this glass part, in case user is changing their previous answers glassPart.answerData = null; glassPart.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 + glassPart.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 = glassPart.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; + glassPart.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) => { + glassPart.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; 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 = glassPart.questions.filter((q) => { return !q.suppressQuestion; }); @@ -351,16 +343,16 @@ export default { // "glassPart2": [7, 10] // }; - const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.partIndex]; + const thisPartsDupes = this.foundDuplicateQuestions["glassPart" + answer.glassPartIndex]; const completeAnsweredQuestions = answer.answeredQuestions ? [...answer.answeredQuestions] : []; - const glassPartAnswered = this.partsQuestionsData[answer.partIndex]; + const glassPartAnswered = this.partsQuestionsData[answer.glassPartIndex]; 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,7 +396,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.partsQuestionsData.length; i++) { + for (let i = answer.glassPartIndex + 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; @@ -413,16 +405,19 @@ export default { } }, - 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((glassPart, i) => { + glassPart.key = glassPart.glassLocation + "-" + glassPart.glassName; + // NOTE: property "questions" can differ between layouts + glassPart.questions = glassPart.partQuestions; + + this.selectedAnswers[glassPart.key] = []; if (!alreadyAnsweredQuestions) { - part.answerData = null; + glassPart.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 (glassPart.glassLocation === savedPart.glassLocation && glassPart.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 = glassPart.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) + glassPart.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; + glassPart.questions[aq.questionNum-1].suppressQuestion = true; } }); // advance the currentPartNum this.currentPartNum = i; - // add answerData to current part - part.answerData = { + // add answerData to current glassPart + glassPart.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 glassPart questions, which gets updated when all questions for a glassPart have been answered + this.$watch("selectedAnswers." + glassPart.key, (newValue) => { if (newValue) { - this.handleAnswerUpdates(part.key, newValue); + this.handleAnswerUpdates(glassPart.key, newValue); } }, {deep: true}) - return part; + return glassPart; }); },