jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Post code review related refactoring

Browse source
This commit is contained in:
Leah Schumann 2022-03-22 13:34:33 -04:00
parent 49cef04e2e
commit 36a98936f2
3 changed files with 98 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/common-components/dropdown-question/dropdown-question.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div class="dropdown-question"> <div class="dropdown-question">
<label :for="inputId" :aria-label="ariaLabelText" class="form-label" v-html="labelText"></label> <label :for="inputId" :aria-label="questionText" class="form-label" v-html="labelText"></label>
<select v-model="selectedOption" <select v-model="selectedOption"
class="form-select" class="form-select"
:id="inputId" :id="inputId"
@ -60,21 +60,12 @@ export default {
}, },
data() { data() {
return { return {
labelText: "", questionText: "",
ariaLabelText: "",
} }
}, },
methods: { methods: {
initializeComponent(cmsContent) { initializeComponent(cmsContent) {
var labelText = cmsContent; this.questionText = cmsContent;
if (this.disableAutoFill) {
var noBreakChar = "&NoBreak;";
var position = 1;
labelText = [labelText.slice(0, position), noBreakChar, labelText.slice(position)].join('');
}
this.labelText = labelText;
this.ariaLabelText = cmsContent;
} }
}, },
computed: { computed: {
@ -86,6 +77,18 @@ export default {
this.$emit("update:modelValue", newValue); this.$emit("update:modelValue", newValue);
} }
}, },
labelText: {
get: function () {
let labelText = this.questionText;
if (this.disableAutoFill) {
const noBreakChar = "&NoBreak;";
const position = 1;
labelText = [labelText.slice(0, position), noBreakChar, labelText.slice(position)].join('');
}
return labelText;
}
}
}, },
watch: { watch: {
selectedOption(newValue) { selectedOption(newValue) {

27
src/common-components/textbox-question/textbox-question.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div class="textbox-question" :class="hasError ? 'has-error' : ''"> <div class="textbox-question" :class="hasError ? 'has-error' : ''">
<label :for="inputId" :aria-label="ariaLabelText" class="form-label" v-html="labelText"></label> <label :for="inputId" :aria-label="questionText" class="form-label" v-html="labelText"></label>
<input v-model="value" <input v-model="value"
v-maska="mask" v-maska="mask"
:type="type" :type="type"
@ -76,21 +76,12 @@ export default {
}, },
data() { data() {
return { return {
labelText: "", questionText: "",
ariaLabelText: "",
} }
}, },
methods: { methods: {
initializeComponent(cmsContent){ initializeComponent(cmsContent){
var labelText = cmsContent; this.questionText = cmsContent;
if (this.disableAutoFill) {
var noBreakChar = "&NoBreak;";
var position = 1;
labelText = [labelText.slice(0, position), noBreakChar, labelText.slice(position)].join('');
}
this.labelText = labelText;
this.ariaLabelText = cmsContent;
}, },
}, },
computed: { computed: {
@ -102,6 +93,18 @@ export default {
this.$emit("update:modelValue", newValue); this.$emit("update:modelValue", newValue);
} }
}, },
labelText: {
get: function () {
let labelText = this.questionText;
if (this.disableAutoFill) {
var noBreakChar = "&NoBreak;";
var position = 1;
labelText = [labelText.slice(0, position), noBreakChar, labelText.slice(position)].join('');
}
return labelText;
}
}
}, },
watch: { watch: {
value(newValue) { value(newValue) {

30
src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue
View file

@ -85,7 +85,16 @@ export default ({
showAddressFields: false, showAddressFields: false,
displayVerificationWarning: false, displayVerificationWarning: false,
displayNoMatchWarning: false, displayNoMatchWarning: false,
alertHeadlineVerificationWarning: "",
alertCopyVerificationWarning: "",
alertHeadlineNoMatchWarning: "",
alertCopyNoMatchWarning: "",
}
},
computed: {
stateOptions: { stateOptions: {
get: function () {
return {
'AL': 'Alabama', 'AL': 'Alabama',
'AK': 'Alaska', 'AK': 'Alaska',
'AZ': 'Arizona', 'AZ': 'Arizona',
@ -137,11 +146,8 @@ export default ({
'WV': 'West Virginia', 'WV': 'West Virginia',
'WI': 'Wisconsin', 'WI': 'Wisconsin',
'WY': 'Wyoming', 'WY': 'Wyoming',
}, }
alertHeadlineVerificationWarning: "", }
alertCopyVerificationWarning: "",
alertHeadlineNoMatchWarning: "",
alertCopyNoMatchWarning: "",
} }
}, },
methods: { methods: {
@ -161,10 +167,10 @@ export default ({
}, },
mounted() { mounted() {
let addressField1 = document.getElementById("autocomplete"); const addressField1 = document.getElementById("autocomplete");
let self = this; const self = this;
let apiKey = applicationConfig.GOOGLE_PLACES_API_KEY; const apiKey = applicationConfig.GOOGLE_PLACES_API_KEY;
this.$loadScript(`https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`) this.$loadScript(`https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places`)
.then(() => { .then(() => {
@ -182,14 +188,14 @@ export default ({
autocomplete.addListener('place_changed', fillInAddress); autocomplete.addListener('place_changed', fillInAddress);
addressField1.onblur = function() { addressField1.onblur = function() {
var hover = document.querySelector(".pac-container .pac-item:hover"); const hover = document.querySelector(".pac-container .pac-item:hover");
// if an item has been clicked, do nothing, otherwise get first solution and use Geocoder to get the place // if an item has been clicked, do nothing, otherwise get first solution and use Geocoder to get the place
if (hover === null) { if (hover === null) {
var item = document.querySelector(".pac-container .pac-item"); const item = document.querySelector(".pac-container .pac-item");
if (item != null) { if (item != null) {
var firstResult = item.textContent; const firstResult = item.textContent;
var geocoder = new window.google.maps.Geocoder(); const geocoder = new window.google.maps.Geocoder();
geocoder.geocode({ geocoder.geocode({
address: firstResult address: firstResult
}, function (results, status) { }, function (results, status) {