From 148cc44b53a1deb6dde55ba47547380fa9a25c8e Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Tue, 30 May 2023 08:09:04 -0400 Subject: [PATCH 1/2] Tech review changes --- .../service-location-helper.js | 2 +- .../shop-list-button/shop-list-button.vue | 53 +++++++------------ src/ux-components/loader/loader.vue | 1 + 3 files changed, 21 insertions(+), 35 deletions(-) diff --git a/src/layouts/service-location/helpers/service-location-helper/service-location-helper.js b/src/layouts/service-location/helpers/service-location-helper/service-location-helper.js index 3768f1095..b100a50b5 100644 --- a/src/layouts/service-location/helpers/service-location-helper/service-location-helper.js +++ b/src/layouts/service-location/helpers/service-location-helper/service-location-helper.js @@ -84,7 +84,7 @@ export async function getAvailabilityRating( const isGoodAvailability = daysWithMinimalAppointmentsCount >= numberOfDaysToEvaluate; - const shopStatus = isGoodAvailability ? "Good" : "Low"; + const shopStatus = isGoodAvailability ? "high" : "low"; return Promise.resolve(shopStatus); } diff --git a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue index 8bc2a1ed5..aac3a8913 100644 --- a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue +++ b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue @@ -21,13 +21,11 @@
+ :class="availabilityRating == 'high' ? 'green' : 'red'"> {{ - availabilityRating == "Good" ? "Appts available" : "Appts low" + badgeText }} - +
@@ -54,9 +52,6 @@ import { experimentSettings } from "@/constants/experiments"; export default { name: "shopListButton", mixins: [inputButtonWrapperMixin], - props: { - loaderColor: String, - }, beforeMount() { if (this.displayAvailabilityIndicators) { this.displayLoader(); @@ -75,11 +70,7 @@ export default { data() { return { isLoaderDisplayed: false, - badgeText: "", - availabilityRating: "None", - availabilityRatingClass: "", - loaderPosition: "left", - blockUi: "no-block", + availabilityRating: null, }; }, computed: { @@ -89,28 +80,25 @@ export default { "true" ); }, + availabilityRatingClass() { + if (this.availabilityRating == null) { + return "gray"; + } else { + return this.availabilityRating == "high" ? "green" : "red"; + } + }, + badgeText() { + if (this.availabilityRating != null) { + return this.availabilityRating == "high" ? "Appts available" : "Appts low"; + } + + return ""; + }, }, methods: { displayLoader() { this.isLoaderDisplayed = true; }, - preHandleAnswerChange() { - if (this.selectingInitiatesLoad) { - this.displayLoader(); - } - }, - }, - watch: { - availabilityRating: { - handler(newValue) { - if (newValue == "None") { - this.availabilityRatingClass = "gray"; - } else { - this.availabilityRatingClass = newValue == "Good" ? "green" : "red"; - } - }, - immediate: true, - }, }, components: { loader, @@ -196,7 +184,7 @@ export default { } &.red { - background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 13 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 12C3.19159 12 0.5 9.30841 0.5 6C0.5 2.69159 3.19159 0 6.5 0C9.80841 0 12.5 2.69159 12.5 6C12.5 9.30841 9.80841 12 6.5 12ZM6.5 0.785047C3.62449 0.785047 1.28505 3.12449 1.28505 6C1.28505 8.87551 3.62449 11.215 6.5 11.215C9.37551 11.215 11.715 8.87551 11.715 6C11.715 3.12449 9.37551 0.785047 6.5 0.785047Z' fill='%23AC160B'/%3E%3Cpath d='M5.697 7.95252C5.5927 7.95252 5.49289 7.91102 5.41999 7.837L3.90597 6.32299C3.75233 6.16934 3.75233 5.92149 3.90597 5.76785C4.05962 5.6142 4.30747 5.6142 4.46111 5.76785L5.69812 7.00373L8.53999 4.16186C8.69364 4.00822 8.94149 4.00822 9.09513 4.16186C9.24878 4.31551 9.24878 4.56336 9.09513 4.717L5.97626 7.83588C5.90224 7.9099 5.80242 7.9514 5.69925 7.9514L5.697 7.95252Z' fill='%23AC160B'/%3E%3C/svg%3E%0A"); + background-image: url("data:image/svg+xml,%3Csvg width='13' height='12' viewBox='0 0 13 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 12C3.19159 12 0.5 9.30841 0.5 6C0.5 2.69159 3.19159 0 6.5 0C9.80841 0 12.5 2.69159 12.5 6C12.5 9.30841 9.80841 12 6.5 12ZM6.5 0.785047C3.62449 0.785047 1.28505 3.12449 1.28505 6C1.28505 8.87551 3.62449 11.215 6.5 11.215C9.37551 11.215 11.715 8.87551 11.715 6C11.715 3.12449 9.37551 0.785047 6.5 0.785047Z' fill='%23006A36'/%3E%3Csvg width='13' height='12' viewBox='0 0 13 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 0C9.81368 0 12.5 2.68632 12.5 6C12.5 9.31368 9.81368 12 6.5 12C3.18632 12 0.5 9.31368 0.5 6C0.5 2.68632 3.18632 0 6.5 0ZM6.5 0.84C3.6548 0.84 1.34 3.1548 1.34 6C1.34 8.8452 3.6548 11.16 6.5 11.16C9.3452 11.16 11.66 8.8452 11.66 6C11.66 3.1548 9.3452 0.84 6.5 0.84ZM7.90018 4.00596C8.06422 3.84204 8.33002 3.84192 8.49406 4.00596C8.6581 4.17 8.6581 4.43592 8.49406 4.59996L7.0939 6L8.49406 7.40004C8.6581 7.56408 8.6581 7.83 8.49406 7.99404C8.4121 8.076 8.30458 8.11704 8.19706 8.11704C8.08966 8.11704 7.98214 8.076 7.90018 7.99404L6.50002 6.594L5.09986 7.99404C5.01778 8.076 4.91038 8.11704 4.80286 8.11704C4.69546 8.11704 4.58794 8.076 4.50598 7.99404C4.34182 7.83 4.34182 7.56408 4.50598 7.40004L5.90614 6L4.50598 4.59996C4.34182 4.43592 4.34182 4.17 4.50598 4.00596C4.66978 3.84192 4.93582 3.84204 5.09986 4.00596L6.50002 5.406L7.90018 4.00596Z' fill='%23AC160B'/%3E%3C/svg%3E%3C/svg%3E%0A"); } } @@ -244,8 +232,5 @@ export default { text-align: left; } - .row-three { - text-align: left; - } } diff --git a/src/ux-components/loader/loader.vue b/src/ux-components/loader/loader.vue index f304b79fa..0635614b8 100644 --- a/src/ux-components/loader/loader.vue +++ b/src/ux-components/loader/loader.vue @@ -19,6 +19,7 @@ export default { loaderPosition: { type: String, }, + /* Controls whether we block the UI when the loader is active or now, defaults to true*/ blockUi: { type: Boolean, default: true, From 0877d7f26a841ed0646ded7c935864ad73c839d9 Mon Sep 17 00:00:00 2001 From: Leah Schumann Date: Tue, 30 May 2023 08:10:58 -0400 Subject: [PATCH 2/2] Prettified --- .../shop-question/shop-list-button/shop-list-button.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue index aac3a8913..73c07a85a 100644 --- a/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue +++ b/src/layouts/service-location/shop-question/shop-list-button/shop-list-button.vue @@ -231,6 +231,5 @@ export default { .row-two { text-align: left; } - }