CSR-762 Fix estimate page, start on question-chain
This commit is contained in:
parent
04f4a9369b
commit
b14ca820ac
6 changed files with 54 additions and 17 deletions
|
|
@ -261,9 +261,10 @@ export default {
|
|||
// this.$emit("isCheckedChanged", val);
|
||||
// },
|
||||
handleAnswerChange(eventValue) {
|
||||
// console.log({
|
||||
// bqEvent: eventValue
|
||||
// })
|
||||
console.log({
|
||||
bqEvent: eventValue
|
||||
})
|
||||
this.$emit("change", eventValue);
|
||||
this.$emit("update:modelValue", eventValue);
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@ export default {
|
|||
// const isSingleAnswerPreselected = this.modelValue?.length === 1 && this.isChecked;
|
||||
|
||||
if (this.isChecked) {
|
||||
console.log("HI THERE");
|
||||
// console.log("HI THERE");
|
||||
this.handleChange(this.modelValue);
|
||||
}
|
||||
},
|
||||
|
|
@ -241,7 +241,7 @@ export default {
|
|||
|
||||
this.valueToEmit = newValue;
|
||||
} else {
|
||||
console.log("not multi");
|
||||
// console.log("not multi");
|
||||
this.valueToEmit = this.value;
|
||||
}
|
||||
|
||||
|
|
@ -253,7 +253,7 @@ export default {
|
|||
// }
|
||||
},
|
||||
handleClick(e) {
|
||||
console.log("handleClick");
|
||||
// console.log("handleClick");
|
||||
this.handleSelectionChange(e);
|
||||
// console.log("HC");
|
||||
// console.log({
|
||||
|
|
@ -335,8 +335,7 @@ export default {
|
|||
};
|
||||
</script>
|
||||
|
||||
<!-- TODO KO Scope this? -->
|
||||
<style lang="scss">
|
||||
<style lang="scss" scoped>
|
||||
input {
|
||||
opacity: 0;
|
||||
height: 0.1px; // NOTE: cannot be zero or Safari can't put focus on it
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
<template>
|
||||
<div v-for="(q, i) in questions" :key="i">
|
||||
q.answerSelected: {{q.answerSelected}}<br/>
|
||||
currentQuestionNum: {{currentQuestionNum}}
|
||||
<transition appear name="fade" mode="out-in">
|
||||
<buttonQuestion
|
||||
<!-- <buttonQuestion
|
||||
v-if="q.answerSelected || (q.questionSequence === currentQuestionNum)"
|
||||
class="radioQuestion"
|
||||
:class="(q.questionSequence === currentQuestionNum) && 'current-question'"
|
||||
|
|
@ -9,7 +11,18 @@
|
|||
:answers="q.answers"
|
||||
:groupName="`question-${glassIndex}-${q.questionSequence}`"
|
||||
v-model="q.answerSelected"
|
||||
@isCheckedChanged="handleAnswer"
|
||||
isRequired
|
||||
:validationRules="validationRules"
|
||||
/> -->
|
||||
<buttonQuestion
|
||||
v-if="q.answerSelected || (q.questionSequence === currentQuestionNum)"
|
||||
class="radioQuestion"
|
||||
:class="(q.questionSequence === currentQuestionNum) && 'current-question'"
|
||||
:questionText="q.questionText"
|
||||
:answers="q.answers"
|
||||
:groupName="`question-${glassIndex}-${q.questionSequence}`"
|
||||
:modelValue="q.answerSelected"
|
||||
@update:modelValue="handleAnswer(q, $event)"
|
||||
isRequired
|
||||
:validationRules="validationRules"
|
||||
/>
|
||||
|
|
@ -67,6 +80,10 @@ export default {
|
|||
}
|
||||
});
|
||||
|
||||
console.log({
|
||||
modelValue: this.modelValue,
|
||||
questions: this.questions
|
||||
})
|
||||
if (!this.modelValue?.length > 0 && this.questions.length > 0) {
|
||||
// set this.currentQuestionNum to first valid question
|
||||
this.currentQuestionNum = this.questions[0].questionSequence;
|
||||
|
|
@ -77,7 +94,12 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
handleAnswer(returnedAnswer) {
|
||||
handleAnswer(question, returnedAnswer) {
|
||||
console.log({
|
||||
returnedAnswer: returnedAnswer
|
||||
})
|
||||
|
||||
question.answerSelected = returnedAnswer;
|
||||
/*
|
||||
returnedAnswer example format:
|
||||
{
|
||||
|
|
@ -86,13 +108,19 @@ export default {
|
|||
"buttonId": "Driver-Front-1-1|answer|DD11132|Yes"
|
||||
}
|
||||
*/
|
||||
const isQuestionChainComplete = this.getQuestionChainAnswerIfComplete(returnedAnswer.value);
|
||||
const isQuestionChainComplete = this.getQuestionChainAnswerIfComplete(returnedAnswer);
|
||||
|
||||
console.log({
|
||||
isQuestionChainComplete: isQuestionChainComplete
|
||||
})
|
||||
if (isQuestionChainComplete) {
|
||||
this.$emit("update:modelValue", isQuestionChainComplete);
|
||||
}
|
||||
},
|
||||
getQuestionChainAnswerIfComplete(returnedAnswer) { // this method will return either a final answer or Boolean false
|
||||
console.log("getQuestionChainAnswerIfComplete: ", {
|
||||
returnedAnswer: returnedAnswer
|
||||
})
|
||||
if (!returnedAnswer) { return false }
|
||||
|
||||
// Example returnedAnswers:
|
||||
|
|
@ -127,6 +155,10 @@ export default {
|
|||
}
|
||||
});
|
||||
|
||||
console.log({
|
||||
questionType: questionType,
|
||||
returnedAnswerArray: returnedAnswerArray
|
||||
})
|
||||
// return false if there's a nextQuestion... or return an object with final answers (truthy)
|
||||
if (questionType === "nextQuestion") {
|
||||
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
validationRules="option-required"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="isRepair">
|
||||
<div v-else>
|
||||
<alert
|
||||
class="my-4"
|
||||
cmsWidgetName="AlertQuoteReady"
|
||||
|
|
@ -87,7 +87,6 @@
|
|||
cmsWidgetName="FunnelFooterWidget"
|
||||
ref="funnelFooter"
|
||||
:isForwardActionDisabled="!meta.valid"
|
||||
@isDisabled="!meta.valid"
|
||||
@back-clicked="backButtonAction"
|
||||
@ForwardClicked="forwardButtonAction"
|
||||
/>
|
||||
|
|
@ -131,7 +130,7 @@ export default {
|
|||
name: "estimate",
|
||||
data() {
|
||||
return {
|
||||
selectedVinLookupMethod: "",
|
||||
selectedVinLookupMethod: null,
|
||||
serviceZipCode: this.getZipFromStore(),
|
||||
emailAddress: this.getEmailFromStore(),
|
||||
displayInvalidZipAlert: false,
|
||||
|
|
|
|||
|
|
@ -122,10 +122,11 @@ export default {
|
|||
},
|
||||
async forwardButtonAction() {
|
||||
const questionAnswersArray = this.partsQuestionsData.map((glass) => {
|
||||
console.log(glass)
|
||||
return {
|
||||
glassLocation: glass.glassLocation,
|
||||
glassName: glass.glassName,
|
||||
result: glass.answerData.answerResult,
|
||||
result: glass.answerData.result,
|
||||
answeredQuestions: glass.answerData.answeredQuestions,
|
||||
isSuppressedPart: glass.isSuppressedPart,
|
||||
};
|
||||
|
|
@ -193,7 +194,7 @@ export default {
|
|||
|
||||
// only look for duplicates forward... to parts that follow after the currently being answered part
|
||||
if (gpIndex > answer.glassIndex) {
|
||||
|
||||
console.log("RESETTING ANSWERDATA")
|
||||
let suppressUntil;
|
||||
// reset this glass part, in case user is changing their previous answers
|
||||
glass.answerData = null;
|
||||
|
|
@ -297,6 +298,7 @@ export default {
|
|||
return !q.suppressQuestion;
|
||||
});
|
||||
|
||||
console.log("REMAINING QUESTIONS", remainingQuestions)
|
||||
if (remainingQuestions.length < 1) {
|
||||
// this is the final answer for this glass part
|
||||
|
||||
|
|
@ -313,6 +315,8 @@ export default {
|
|||
answeredQuestions: [answeredQuestionObj],
|
||||
};
|
||||
|
||||
console.log(glass.answerData)
|
||||
|
||||
// suppress this glass because it has an answer
|
||||
glass.isSuppressedPart = true;
|
||||
}
|
||||
|
|
@ -416,6 +420,7 @@ export default {
|
|||
|
||||
this.selectedAnswers[glass.key] = [];
|
||||
if (!alreadyAnsweredQuestions) {
|
||||
console.log("NULLING ANSWERDATA")
|
||||
glass.answerData = null;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -34,6 +34,7 @@
|
|||
:value="value"
|
||||
:groupName="groupName"
|
||||
buttonWrapperClasses="list-group list-button rounded-3 d-flex flex-column w-100 mb-2"
|
||||
:validationRules="validationRules"
|
||||
@change="handleAnswerChange"
|
||||
>
|
||||
<div
|
||||
|
|
|
|||
Loading…
Reference in a new issue