From bdfb4bbf8aceeadd477e145791d3734cb6796582 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Fri, 7 Oct 2022 16:31:49 -0400 Subject: [PATCH 01/17] WIP date picker --- .../date-picker/date-picker.vue | 456 ++++++------------ 1 file changed, 158 insertions(+), 298 deletions(-) diff --git a/src/common-components/date-picker/date-picker.vue b/src/common-components/date-picker/date-picker.vue index 28d433289..2bbd1bad5 100644 --- a/src/common-components/date-picker/date-picker.vue +++ b/src/common-components/date-picker/date-picker.vue @@ -1,147 +1,151 @@ + From eea0b883a77e064d1ed34f6a1151ae400e5ed00f Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Mon, 10 Oct 2022 15:44:37 -0400 Subject: [PATCH 02/17] WIP date picker. --- .../date-picker/date-picker.vue | 233 +++++++++++------- 1 file changed, 147 insertions(+), 86 deletions(-) diff --git a/src/common-components/date-picker/date-picker.vue b/src/common-components/date-picker/date-picker.vue index 2bbd1bad5..f2db85e42 100644 --- a/src/common-components/date-picker/date-picker.vue +++ b/src/common-components/date-picker/date-picker.vue @@ -2,7 +2,7 @@
Date Picker -
+
{{currentMonth}} {{currentYear}}
= Available
@@ -15,147 +15,146 @@
ThursdayT
FridayF
SaturdayS
-
- - +
+ +
- - + +
- - - + + +
OCT
- - + +
- - -
-
- - - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + +
- - + + +
+
+ +
- - + +
- - + +
@@ -175,13 +174,14 @@ export default { isFirstDayOfMonth: true, isCurrentDay: true, isCurrentDayDot: true, + isPastDay: true, }; }, }; + From 204807bf791fadca71f8d1a543f9ba1cf14fa664 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Thu, 13 Oct 2022 09:09:42 -0400 Subject: [PATCH 14/17] Code cleanup per Adam comments. --- .../date-picker/date-picker.vue | 86 +++++++++---------- 1 file changed, 43 insertions(+), 43 deletions(-) diff --git a/src/common-components/date-picker/date-picker.vue b/src/common-components/date-picker/date-picker.vue index 7bff6191c..121f6ed89 100644 --- a/src/common-components/date-picker/date-picker.vue +++ b/src/common-components/date-picker/date-picker.vue @@ -16,175 +16,175 @@
FridayF
SaturdayS
- +
- +
- +
- +
- +
- +
- +
OCT
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
OCT
- +
- +
- +
- +
@@ -295,7 +295,7 @@ export default { outline: none; input[type="radio"] { - position: absolute;; //override bootstrap + position: absolute; //override bootstrap height: 0; opacity: 0; From 2bfb265291fc95a5ab58496ff6ed57f8b9357a92 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Thu, 13 Oct 2022 09:30:50 -0400 Subject: [PATCH 15/17] Moved div to inside label so month name was hoverable with label. Updated CSS accordingly. --- .../date-picker/date-picker.vue | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/common-components/date-picker/date-picker.vue b/src/common-components/date-picker/date-picker.vue index 121f6ed89..e07f8d38c 100644 --- a/src/common-components/date-picker/date-picker.vue +++ b/src/common-components/date-picker/date-picker.vue @@ -43,8 +43,8 @@ -
OCT
@@ -168,8 +168,10 @@
- -
OCT
+ +
@@ -318,7 +320,7 @@ export default { &:after { background-color: $white; } - + .first-day { + .first-day { color: $white; } } @@ -331,7 +333,7 @@ export default { &:after { background-color: $white; } - + .first-day { + .first-day { color: $white; } } @@ -380,7 +382,7 @@ export default { position: absolute; top: 28px; } - + .first-day { + .first-day { color: $blue; } } @@ -414,7 +416,7 @@ export default { color: $white; } } - + .first-day { + .first-day { color: $white; } } From 9d1a768234192ca4a734d644ff7410e95754533f Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Thu, 13 Oct 2022 09:48:28 -0400 Subject: [PATCH 16/17] Add comments. --- src/common-components/date-picker/date-picker.vue | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/common-components/date-picker/date-picker.vue b/src/common-components/date-picker/date-picker.vue index e07f8d38c..548ca8d99 100644 --- a/src/common-components/date-picker/date-picker.vue +++ b/src/common-components/date-picker/date-picker.vue @@ -39,6 +39,7 @@
+
+
From 4f5c71dcf9f629654787536a9322eaad8dfb2fc4 Mon Sep 17 00:00:00 2001 From: Katie Date: Thu, 13 Oct 2022 15:01:05 -0400 Subject: [PATCH 17/17] CSR-762 Refactor to use v-model --- .../base-input-button/base-input-button.vue | 7 +------ .../button-question/button-question.vue | 9 ++------- src/mixins/input-button-wrapper-mixin.js | 19 ++++++++++++------- .../list-button-horizontal.vue | 2 +- src/ux-components/list-button/list-button.vue | 2 +- src/ux-components/list-card/list-card.vue | 2 +- src/ux-components/radio/radio.vue | 2 +- 7 files changed, 19 insertions(+), 24 deletions(-) diff --git a/src/common-components/base-input-button/base-input-button.vue b/src/common-components/base-input-button/base-input-button.vue index 8cd50278e..c7c2291ce 100644 --- a/src/common-components/base-input-button/base-input-button.vue +++ b/src/common-components/base-input-button/base-input-button.vue @@ -30,11 +30,6 @@ import inputButtonWrapperMixin from "../../mixins/input-button-wrapper-mixin"; export default { name: "base-input-button", - emits: ["change", "inputButtonClicked"], - model: { - prop: "modelValue", - event: "change", - }, props: { // ...inputButtonWrapperMixin.props value: { @@ -132,7 +127,7 @@ export default { }, handleClick(e) { this.handleSelectionChange(e); - this.$emit("inputButtonClicked", this.valueToEmit); + this.$emit("update:modelValue", this.valueToEmit); }, handleFocus() { this.$root.handleInputFocus({ diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index a20ff376e..eb198c93f 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -45,7 +45,6 @@ :groupName="answer.groupName" :isMultiSelect="isMultiSelect" :value="answer.value" - :modelValue="modelValue" :selectingInitiatesLoad="selectingInitiatesLoad" :isWide="isWide" :validationRules="validationRules" @@ -54,7 +53,8 @@ :lastValuePushedToGa="lastValuePushedToGa" :setLastValuePushedToGa="setLastValuePushedToGa" :shouldPushClickEventToGAOnMount="shouldPushClickEventToGAOnMount" - @inputButtonClicked="handleAnswerChange" /> + v-model="selectedValues" + />
+ v-model="selectedValue">
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue index 44ead9b3f..54ef98b35 100644 --- a/src/ux-components/list-button/list-button.vue +++ b/src/ux-components/list-button/list-button.vue @@ -2,7 +2,7 @@ + v-model="selectedValue">
diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue index c49c4ce05..7e27a6476 100644 --- a/src/ux-components/list-card/list-card.vue +++ b/src/ux-components/list-card/list-card.vue @@ -5,7 +5,7 @@ 'list-card w-100 rounded-3 d-flex align-items-center h-100', { horizontal: isWide }, ]" - @inputButtonClicked="handleAnswerChange"> + v-model="selectedValue">
diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index ea72d6895..0d120de39 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -3,7 +3,7 @@ v-bind="$props" buttonWrapperClasses="ui-radio form-check" inputClasses="form-check-input" - @inputButtonClicked="handleAnswerChange"> + v-model="selectedValue">

{{ buttonLabel }}

{{