Merge pull request #93 from Safelite/feature/SSR-188-v2

Fix whitespace issue reported by QA
This commit is contained in:
Kulbhushan Kaushik 2023-01-07 15:44:33 -05:00 committed by GitHub
commit f78a8743f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 78 additions and 67 deletions

View file

@ -6,7 +6,9 @@ module.exports = {
rules: { rules: {
'linebreak-style': 'off', 'linebreak-style': 'off',
'vue/component-definition-name-casing': ['warn', 'kebab-case'], 'vue/component-definition-name-casing': ['warn', 'kebab-case'],
'vue/require-default-prop': 'off' 'vue/require-default-prop': 'off',
'vue/attribute-hyphenation': ['warn', 'never'],
'vue/v-on-event-hyphenation': ['warn', 'never']
}, },
settings: { settings: {
'import/resolver': { 'import/resolver': {

View file

@ -1,12 +1,12 @@
<template> <template>
<div class="vin-location-information"> <div class="vin-location-information mt-2">
<div <div
class="vin-toggle mt-2" class="vin-toggle"
:class="[isVinLocationDetailVisible ? 'active' : '']" :class="[isVinLocationDetailVisible ? 'active' : '']"
@click="handleClickToggle" @click="handleClickToggle"
> >
<TextLink <textLink
link-type="text" linkType="text"
href="#!" href="#!"
:text="textForToggle" :text="textForToggle"
/> />
@ -31,12 +31,12 @@
</div> </div>
</template> </template>
<script> <script>
import TextLink from '@/ux-components/text-link/text-link.vue'; import textLink from '@/ux-components/text-link/text-link.vue';
export default { export default {
name: 'vin-location-information', name: 'vin-location-information',
components: { components: {
TextLink, textLink,
}, },
data() { data() {
return { return {

View file

@ -1,17 +1,17 @@
<template> <template>
<Alert <alert
alert-class="alert-danger" alertClass="alert-danger"
cms-widget-name="AlertVinNotFoundWidget" cmsWidgetName="AlertVinNotFoundWidget"
id="vehicle-not-found-alert" id="vehicle-not-found-alert"
/> />
</template> </template>
<script> <script>
import Alert from '@/ux-components/alert/alert.vue'; import alert from '@/ux-components/alert/alert.vue';
export default { export default {
name: 'vehicle-not-found-alert', name: 'vehicle-not-found-alert',
components: { components: {
Alert, alert,
}, },
}; };
</script> </script>

View file

@ -1,20 +1,20 @@
<template> <template>
<Alert <alert
alert-class="alert-warning" alertClass="alert-warning"
cms-widget-name="AlertMatchedDifferentVehicleWidget" cmsWidgetName="AlertMatchedDifferentVehicleWidget"
:manual-copy="body" :manualCopy="body"
:manual-headline="header" :manualHeadline="header"
/> />
</template> </template>
<script> <script>
import { getDamageString } from '@/helpers/damage-helper'; import { getDamageString } from '@/helpers/damage-helper';
import Alert from '@/ux-components/alert/alert.vue'; import alert from '@/ux-components/alert/alert.vue';
export default { export default {
name: 'vehicle-not-matched-alert', name: 'vehicle-not-matched-alert',
components: { components: {
Alert, alert,
}, },
inject: ['vehicleFromLookup'], inject: ['vehicleFromLookup'],
computed: { computed: {

View file

@ -3,24 +3,24 @@
id="vin-lookup-alerts-wrapper" id="vin-lookup-alerts-wrapper"
:class="wrapperCssClass" :class="wrapperCssClass"
> >
<VehicleNotFoundAlert <vehicleNotFoundAlert
v-if="isVehicleNotFoundVisible" v-if="isVehicleNotFoundVisible"
/> />
<VehicleNotMatchedAlert <vehicleNotMatchedAlert
v-else-if="isVehicleNotMatchedVisible" v-else-if="isVehicleNotMatchedVisible"
/> />
</div> </div>
</template> </template>
<script> <script>
import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types'; import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
import VehicleNotFoundAlert from './vehicle-not-found-alert/vehicle-not-found-alert.vue'; import vehicleNotFoundAlert from './vehicle-not-found-alert/vehicle-not-found-alert.vue';
import VehicleNotMatchedAlert from './vehicle-not-matched-alert/vehicle-not-matched-alert.vue'; import vehicleNotMatchedAlert from './vehicle-not-matched-alert/vehicle-not-matched-alert.vue';
export default { export default {
name: 'vin-lookup-alerts', name: 'vin-lookup-alerts',
components: { components: {
VehicleNotFoundAlert, vehicleNotFoundAlert,
VehicleNotMatchedAlert, vehicleNotMatchedAlert,
}, },
props: { props: {
activeAlertType: { activeAlertType: {

View file

@ -1,36 +1,36 @@
<template> <template>
<Form <Form
@submit="onSubmit" @submit="onSubmit"
@invalid-submit="onInvalidSubmit" @invalidSubmit="onInvalidSubmit"
v-slot="{ meta }" v-slot="{ meta }"
> >
<div class="page-container-grouped-styles overflow-auto"> <div class="page-container-grouped-styles overflow-auto">
<SiteHeader <siteHeader
cms-widget-name="SiteHeaderWidget" cmsWidgetName="SiteHeaderWidget"
/> />
<VehicleBanner <vehicleBanner
cms-widget-name="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:display-generic-vehicle-image="false" :displayGenericVehicleImage="false"
/> />
<SiteSubHeader <siteSubHeader
cms-widget-name="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
/> />
<div class="fade-on-route-transition sub-container make-tall mt-5"> <div class="fade-on-route-transition sub-container make-tall mt-5">
<VinLookupAlerts <vinLookupAlerts
:active-alert-type="activeVehicleLookupAlertType" :activeAlertType="activeVehicleLookupAlertType"
/> />
<VinQuestion <vinQuestion
v-model="vin" v-model="vin"
/> />
<VinLocationInformation /> <vinLocationInformation />
<SiteFooter <siteFooter
cms-widget-name="SiteFooterWidget" cmsWidgetName="SiteFooterWidget"
:is-forward-action-disabled="!meta.valid" :isForwardActionDisabled="!meta.valid"
@back-clicked="backButtonAction" @backClicked="backButtonAction"
@forward-clicked="forwardButtonAction" @forwardClicked="forwardButtonAction"
ref="siteFooter" ref="siteFooter"
/> />
</div> </div>
@ -48,28 +48,28 @@ import { settleAllPromises } from '@/helpers/layout-helper';
import { useMainStore } from '@/store'; import { useMainStore } from '@/store';
// Import Component // Import Component
import BaseFormMixin from '@/mixins/base-form-mixin'; import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate'; import { Form } from 'vee-validate';
import SiteFooter from '@/common-components/site-footer/site-footer.vue'; import siteFooter from '@/common-components/site-footer/site-footer.vue';
import SiteHeader from '@/common-components/site-header/site-header.vue'; import siteHeader from '@/common-components/site-header/site-header.vue';
import SiteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue'; import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
import VehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue'; import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
import VinLocationInformation from './vin-location-information/vin-location-information.vue'; import vinLocationInformation from './vin-location-information/vin-location-information.vue';
import VinLookupAlerts from './vin-lookup-alerts/vin-lookup-alerts.vue'; import vinLookupAlerts from './vin-lookup-alerts/vin-lookup-alerts.vue';
import VinQuestion from './vin-question/vin-question.vue'; import vinQuestion from './vin-question/vin-question.vue';
export default { export default {
name: 'vin-lookup', name: 'vin-lookup',
mixins: [BaseFormMixin], mixins: [baseFormMixin],
components: { components: {
SiteFooter, siteFooter,
SiteHeader, siteHeader,
SiteSubHeader, siteSubHeader,
Form, Form,
VehicleBanner, vehicleBanner,
VinLocationInformation, vinLocationInformation,
VinLookupAlerts, vinLookupAlerts,
VinQuestion, vinQuestion,
}, },
setup() { setup() {
const mainStore = useMainStore(); const mainStore = useMainStore();

View file

@ -1,12 +1,13 @@
<template> <template>
<TextboxQuestion <textboxQuestion
v-model="vin" v-model="vin"
cms-widget-name="VinNumberQuestionWidget" cmsWidgetName="VinNumberQuestionWidget"
disable-auto-fill disableAutoFill
input-id="vin-question" id="vin-question-wrapper"
is-required inputId="vin-question"
max-length="17" isRequired
validation-rules="vin-required|vin-format" maxLength="17"
validationRules="vin-required|vin-format"
/> />
</template> </template>
<script> <script>
@ -16,7 +17,7 @@ import { regex, required } from '@/helpers/validation-rules';
import { errorMessages } from '@/constants/error-messages'; import { errorMessages } from '@/constants/error-messages';
// Import Component(s) // Import Component(s)
import TextboxQuestion from '@/common-components/textbox-question/textbox-question.vue'; import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
defineRule('vin-required', required(errorMessages.VIN_REQUIRED)); defineRule('vin-required', required(errorMessages.VIN_REQUIRED));
defineRule('vin-format', regex(/^[a-hA-Hj-nJ-NpPr-zR-Z0-9]{17}$/, errorMessages.VIN_FORMAT)); defineRule('vin-format', regex(/^[a-hA-Hj-nJ-NpPr-zR-Z0-9]{17}$/, errorMessages.VIN_FORMAT));
@ -28,7 +29,7 @@ export default {
}, },
emits: ['update:modelValue'], emits: ['update:modelValue'],
components: { components: {
TextboxQuestion, textboxQuestion,
}, },
computed: { computed: {
vin: { vin: {
@ -42,3 +43,11 @@ export default {
}, },
}; };
</script> </script>
<style>
#vin-question-wrapper .form-test-error {
/**
Override extra margin-bottom in the error message in TextboxQuestion
*/
margin-bottom: 0 !important;
}
</style>