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) {

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

@ -85,65 +85,71 @@ export default ({
showAddressFields: false, showAddressFields: false,
displayVerificationWarning: false, displayVerificationWarning: false,
displayNoMatchWarning: false, displayNoMatchWarning: false,
stateOptions: {
'AL': 'Alabama',
'AK': 'Alaska',
'AZ': 'Arizona',
'AR': 'Arkansas',
'CA': 'California',
'CO': 'Colorado',
'CT': 'Connecticut',
'DE': 'Delaware',
'DC': 'District Of Columbia',
'FL': 'Florida',
'GA': 'Georgia',
'HI': 'Hawaii',
'ID': 'Idaho',
'IL': 'Illinois',
'IN': 'Indiana',
'IA': 'Iowa',
'KS': 'Kansas',
'KY': 'Kentucky',
'LA': 'Louisiana',
'ME': 'Maine',
'MD': 'Maryland',
'MA': 'Massachusetts',
'MI': 'Michigan',
'MN': 'Minnesota',
'MS': 'Mississippi',
'MO': 'Missouri',
'MT': 'Montana',
'NE': 'Nebraska',
'NV': 'Nevada',
'NH': 'New Hampshire',
'NJ': 'New Jersey',
'NM': 'New Mexico',
'NY': 'New York',
'NC': 'North Carolina',
'ND': 'North Dakota',
'OH': 'Ohio',
'OK': 'Oklahoma',
'OR': 'Oregon',
'PA': 'Pennsylvania',
'RI': 'Rhode Island',
'SC': 'South Carolina',
'SD': 'South Dakota',
'TN': 'Tennessee',
'TX': 'Texas',
'UT': 'Utah',
'VT': 'Vermont',
'VA': 'Virginia',
'WA': 'Washington',
'WV': 'West Virginia',
'WI': 'Wisconsin',
'WY': 'Wyoming',
},
alertHeadlineVerificationWarning: "", alertHeadlineVerificationWarning: "",
alertCopyVerificationWarning: "", alertCopyVerificationWarning: "",
alertHeadlineNoMatchWarning: "", alertHeadlineNoMatchWarning: "",
alertCopyNoMatchWarning: "", alertCopyNoMatchWarning: "",
} }
}, },
computed: {
stateOptions: {
get: function () {
return {
'AL': 'Alabama',
'AK': 'Alaska',
'AZ': 'Arizona',
'AR': 'Arkansas',
'CA': 'California',
'CO': 'Colorado',
'CT': 'Connecticut',
'DE': 'Delaware',
'DC': 'District Of Columbia',
'FL': 'Florida',
'GA': 'Georgia',
'HI': 'Hawaii',
'ID': 'Idaho',
'IL': 'Illinois',
'IN': 'Indiana',
'IA': 'Iowa',
'KS': 'Kansas',
'KY': 'Kentucky',
'LA': 'Louisiana',
'ME': 'Maine',
'MD': 'Maryland',
'MA': 'Massachusetts',
'MI': 'Michigan',
'MN': 'Minnesota',
'MS': 'Mississippi',
'MO': 'Missouri',
'MT': 'Montana',
'NE': 'Nebraska',
'NV': 'Nevada',
'NH': 'New Hampshire',
'NJ': 'New Jersey',
'NM': 'New Mexico',
'NY': 'New York',
'NC': 'North Carolina',
'ND': 'North Dakota',
'OH': 'Ohio',
'OK': 'Oklahoma',
'OR': 'Oregon',
'PA': 'Pennsylvania',
'RI': 'Rhode Island',
'SC': 'South Carolina',
'SD': 'South Dakota',
'TN': 'Tennessee',
'TX': 'Texas',
'UT': 'Utah',
'VT': 'Vermont',
'VA': 'Virginia',
'WA': 'Washington',
'WV': 'West Virginia',
'WI': 'Wisconsin',
'WY': 'Wyoming',
}
}
}
},
methods: { methods: {
initializeComponent(cmsContent) { initializeComponent(cmsContent) {
this.$refs.autocomplete.initializeComponent(cmsContent[0].QuestionText); this.$refs.autocomplete.initializeComponent(cmsContent[0].QuestionText);
@ -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) {