ITAC - No Recal | Add in ITAC price viewer

This commit is contained in:
scottkiener-at-safelite 2026-01-16 14:02:19 -05:00
parent b26b00c954
commit 2319848c87

View file

@ -25,24 +25,31 @@
ref="secondaryText"
class="mt-4 mb-1 fw-bold text-black"
v-html="secondaryText"></div>
<div class="itac-price-container" v-if="isITACQuoteVisible">
<div class="itac-deductible-value-container">
<div class="itac-deductible-value-text">Your deductible:</div>
<div class="itac-deductible-value">
{{ formatAmountInDollars(deductibleValue) }}
</div>
</div>
<div class="separator"></div>
<div class="itac-cost-container">
<div class="itac-cost-text">Safelite price*:</div>
<div class="cost">
{{ formatAmountInDollars(totalServicePrice) }}
</div>
</div>
</div>
<div
v-if="isDeductibleVisible"
class="d-flex cost">
v-if="showDeductibleOnly"
class="d-flex cost cost-underline">
{{ formatAmountInDollars(deductibleValue) }}
</div>
<div
v-if="isQuoteDisplayed"
class="d-flex justify-content-center cost mb-0">
class="d-flex justify-content-center cost mb-0 cost-underline">
{{ formatAmountInDollars(totalServicePrice) }}
</div>
<div
v-if="isITACQuoteVisible"
class="d-flex justify-content-center mb-4 deductible-text">
{{ deductibleText }}&nbsp;
<span class="text-success fw-bold">{{
formatAmountInDollars(deductibleValue)
}}</span>
</div>
<div
class="fw-bold text-black mt-5 mb-2"
v-html="nextStepsHeader"></div>
@ -63,7 +70,7 @@
href="#"
@clickEvent="cancelClaim" />
<textBlock
v-if="isQuoteDisplayed"
v-if="isDisclaimerVisible"
:customText="disclaimerText"
typeStyle="caption" />
<siteFooter
@ -321,8 +328,14 @@ export default {
);
},
isQuoteDisplayed() {
return this.isNoCompQuoteVisible;
},
isDisclaimerVisible() {
return this.isITACQuoteVisible || this.isNoCompQuoteVisible;
},
showDeductibleOnly() {
return this.isDeductibleVisible && this.isITACQuoteVisible;
},
shouldRegisterClaim() {
const {
vehicle,
@ -511,9 +524,11 @@ export default {
font-size: 1.675rem;
font-weight: $font-weight-bold;
line-height: 2.5rem;
border-bottom: 4px solid #0c7e47;
width: fit-content;
}
.cost-underline {
border-bottom: 4px solid #0c7e47;
}
.deductible-text {
line-height: 1.5rem;
}
@ -564,6 +579,37 @@ export default {
}
}
}
.itac-price-container {
display: flex;
justify-content: space-around;
border: solid 1px #cacbcc;
border-radius: 5px;
align-items: center;
font-weight: $font-weight-bold;
color: $black;
padding: 10px;
.itac-deductible-value-container {
display: flex;
flex-direction: column;
align-items: center;
}
.itac-cost-container {
display: flex;
flex-direction: column;
align-items: center;
}
.itac-deductible-value {
font-size: 1.675rem;
font-weight: $font-weight-normal;
line-height: 2.5rem;
}
.separator {
width: 1px;
height: 60px;
background-color: #cacbcc;
}
}
}
:deep(.deductible-modal) {