WIP donation component.

This commit is contained in:
Bryan Mauger 2025-02-05 14:41:57 -05:00
parent fec478340d
commit 7c07b95a79
7 changed files with 171 additions and 120 deletions

File diff suppressed because one or more lines are too long

View file

@ -205,7 +205,7 @@ export default {
}
}
}
.alert {
border-radius: $border-radius-lg;
border: 1px solid $green;

View file

@ -219,7 +219,7 @@ export default {
.textbox-question {
padding: 0;
margin: 0 0 1.5rem 0;
label {
text-align: left;
font-weight: 900;
@ -258,7 +258,7 @@ export default {
&.progress-saved {
.modal-footer-button,
.modal-disclaimer {
.modal-disclaimer {
display: none;
}
.skip-button {

View file

@ -64,10 +64,9 @@
:isItac="isItac"
:isNoComp="isNoComp" />
<div class="mt-3">
<donationBlock
cmsWidgetName="DonationWidget" />
</div>
<div class="mt-3">
<donationBlock cmsWidgetName="DonationWidget" />
</div>
<hr class="mb-5" />
@ -113,7 +112,7 @@ import experimentMixin from "@/mixins/experiment-mixin.js";
import { partTypeStrings } from "@/constants/part-type-strings";
import { containsLineItemWithPartType } from "@/helpers/service-package-helper";
import { containsRecalParts } from "@/helpers/recal-helper.js";
import donationBlock from "../../fmg-components/donation-block/donation-block.vue";
import donationBlock from "@/fmg-components/donation-block/donation-block.vue";
export default {
name: "confirmation",
@ -122,13 +121,13 @@ export default {
// send part question data to SPS API for logging
const orderFromStore = await deepClone(store.getters.order);
const ctu = orderFromStore.serviceLocation?.zipCodeCtu
const ctu = orderFromStore.serviceLocation?.zipCodeCtu;
const partsOrQuestions = orderFromStore.damage?.partQuestionAnswers;
partsOrQuestions.forEach(pqa => {
partsOrQuestions.forEach((pqa) => {
const payloadPartQuestions = [];
pqa.answeredQuestions.forEach(answer => {
pqa.answeredQuestions.forEach((answer) => {
payloadPartQuestions.push({
questionSeq: answer?.questionNum,
questionText: answer?.questionText,
@ -138,24 +137,18 @@ export default {
});
const payload = {
eon: orderFromStore.eon,
ctu: ctu,
workOrderId: orderFromStore.workOrderId,
workOrderNumber: orderFromStore.workOrderNumber,
carId: orderFromStore.vehicle.carId,
glassLocation: pqa?.glassLocation,
partQuestions: payloadPartQuestions,
};
baseMixin.methods.dispatchStoreAction(
storeActions.LOG_PART_QUESTIONS,
payload,
false
);
eon: orderFromStore.eon,
ctu: ctu,
workOrderId: orderFromStore.workOrderId,
workOrderNumber: orderFromStore.workOrderNumber,
carId: orderFromStore.vehicle.carId,
glassLocation: pqa?.glassLocation,
partQuestions: payloadPartQuestions,
};
baseMixin.methods.dispatchStoreAction(storeActions.LOG_PART_QUESTIONS, payload, false);
});
// Create order
await baseMixin.methods.dispatchStoreAction(storeActions.CREATE_SUBMITTED_ORDER); // This nulls the Store order
@ -503,7 +496,7 @@ export default {
addToCalendar,
cart,
textBlock,
donationBlock
donationBlock,
},
};
</script>

View file

@ -37,7 +37,7 @@
:isItac="isItac"
:isNoComp="isNoComp"
:isExpandedOnLoad="false" />
<hr />
<div>

View file

@ -1448,16 +1448,7 @@ export const actions = {
logPartQuestions(
context,
{
eon,
ctu,
workOrderId,
workOrderNumber,
carId,
glassLocation,
partQuestions,
userAgent,
}
{ eon, ctu, workOrderId, workOrderNumber, carId, glassLocation, partQuestions, userAgent }
) {
var payload = {
applicationName: applicationConfig.APPLICATION_NAME,
@ -1468,15 +1459,14 @@ export const actions = {
carId: carId,
glassLocation: glassLocation,
partQuestions: partQuestions,
userAgent: navigator.userAgent
userAgent: navigator.userAgent,
};
return globalMethods
.callHttpClient({
method: endpoints.LogPartQuestions.method,
endpoint: endpoints.LogPartQuestions.url,
payload: payload,
});
return globalMethods.callHttpClient({
method: endpoints.LogPartQuestions.method,
endpoint: endpoints.LogPartQuestions.url,
payload: payload,
});
},
// Misc Actions

View file

@ -156,5 +156,48 @@ export default {
transition: background 0s 0s ease-in-out;
}
}
&.btn-success {
position: relative;
background: $green-100;
border: 1px solid $green-400;
border-radius: $border-radius-lg;
color: $black;
font-weight: 500;
transition: all 150ms linear;
height: 3rem;
&:hover {
color: $black;
background: $green-200;
}
&:focus, // Mouse, touch, stylus focus
&:focus-visible {
// Keyboard focus for accessibility
outline: none;
box-shadow:
0 0 0 3px $white,
0 0 0 5.5px $green-400;
color: $black;
background: $green-100;
}
&:disabled {
background: transparent;
color: $gray-550 !important;
font-weight: 400;
height: 48px;
border: 1px solid $gray-550;
border-radius: $border-radius-lg;
cursor: pointer;
pointer-events: all;
}
&.has-loader {
color: $white;
@include blue-gradient;
pointer-events: none;
}
&.delay {
// fixes flicker while transitioning between states
transition: background 0s 0s ease-in-out;
}
}
}
</style>