fix: apply ESLint rule vue/component-tags-order

This commit is contained in:
iamsivin
2024-07-25 19:33:28 +05:30
parent fede03ebe8
commit 0008fca511
544 changed files with 21263 additions and 21256 deletions
@@ -1,9 +1,3 @@
<template>
<div class="flex items-center justify-center h-full w-full">
<spinner color-scheme="primary" size="" />
<div class="ml-2">{{ $t('CONFIRM_EMAIL') }}</div>
</div>
</template>
<script>
import { DEFAULT_REDIRECT_URL } from 'dashboard/constants/globals';
import { verifyPasswordToken } from '../../../api/auth';
@@ -34,3 +28,9 @@ export default {
},
};
</script>
<template>
<div class="flex items-center justify-center h-full w-full">
<spinner color-scheme="primary" size="" />
<div class="ml-2">{{ $t('CONFIRM_EMAIL') }}</div>
</div>
</template>
+49 -49
View File
@@ -1,52 +1,3 @@
<template>
<div
class="flex flex-col justify-center w-full min-h-full py-12 bg-woot-25 sm:px-6 lg:px-8 dark:bg-slate-900"
>
<form
class="bg-white shadow sm:mx-auto sm:w-full sm:max-w-lg dark:bg-slate-800 p-11 sm:shadow-lg sm:rounded-lg"
@submit.prevent="submitForm"
>
<h1
class="mb-1 text-2xl font-medium tracking-tight text-left text-slate-900 dark:text-white"
>
{{ $t('SET_NEW_PASSWORD.TITLE') }}
</h1>
<div class="space-y-5">
<form-input
v-model.trim="credentials.password"
class="mt-3"
name="password"
type="password"
:has-error="v$.credentials.password.$error"
:error-message="$t('SET_NEW_PASSWORD.PASSWORD.ERROR')"
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
@blur="v$.credentials.password.$touch"
/>
<form-input
v-model.trim="credentials.confirmPassword"
class="mt-3"
name="confirm_password"
type="password"
:has-error="v$.credentials.confirmPassword.$error"
:error-message="$t('SET_NEW_PASSWORD.CONFIRM_PASSWORD.ERROR')"
:placeholder="$t('SET_NEW_PASSWORD.CONFIRM_PASSWORD.PLACEHOLDER')"
@blur="v$.credentials.confirmPassword.$touch"
/>
<submit-button
:disabled="
v$.credentials.password.$invalid ||
v$.credentials.confirmPassword.$invalid ||
newPasswordAPI.showLoading
"
:button-text="$t('SET_NEW_PASSWORD.SUBMIT')"
:loading="newPasswordAPI.showLoading"
/>
</div>
</form>
</div>
</template>
<script>
import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators';
@@ -135,3 +86,52 @@ export default {
},
};
</script>
<template>
<div
class="flex flex-col justify-center w-full min-h-full py-12 bg-woot-25 sm:px-6 lg:px-8 dark:bg-slate-900"
>
<form
class="bg-white shadow sm:mx-auto sm:w-full sm:max-w-lg dark:bg-slate-800 p-11 sm:shadow-lg sm:rounded-lg"
@submit.prevent="submitForm"
>
<h1
class="mb-1 text-2xl font-medium tracking-tight text-left text-slate-900 dark:text-white"
>
{{ $t('SET_NEW_PASSWORD.TITLE') }}
</h1>
<div class="space-y-5">
<form-input
v-model.trim="credentials.password"
class="mt-3"
name="password"
type="password"
:has-error="v$.credentials.password.$error"
:error-message="$t('SET_NEW_PASSWORD.PASSWORD.ERROR')"
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
@blur="v$.credentials.password.$touch"
/>
<form-input
v-model.trim="credentials.confirmPassword"
class="mt-3"
name="confirm_password"
type="password"
:has-error="v$.credentials.confirmPassword.$error"
:error-message="$t('SET_NEW_PASSWORD.CONFIRM_PASSWORD.ERROR')"
:placeholder="$t('SET_NEW_PASSWORD.CONFIRM_PASSWORD.PLACEHOLDER')"
@blur="v$.credentials.confirmPassword.$touch"
/>
<submit-button
:disabled="
v$.credentials.password.$invalid ||
v$.credentials.confirmPassword.$invalid ||
newPasswordAPI.showLoading
"
:button-text="$t('SET_NEW_PASSWORD.SUBMIT')"
:loading="newPasswordAPI.showLoading"
/>
</div>
</form>
</div>
</template>
@@ -1,51 +1,3 @@
<template>
<div
class="flex flex-col justify-center w-full min-h-full py-12 bg-woot-25 sm:px-6 lg:px-8 dark:bg-slate-900"
>
<form
class="bg-white shadow sm:mx-auto sm:w-full sm:max-w-lg dark:bg-slate-800 p-11 sm:shadow-lg sm:rounded-lg"
@submit.prevent="submit"
>
<h1
class="mb-1 text-2xl font-medium tracking-tight text-left text-slate-900 dark:text-white"
>
{{ $t('RESET_PASSWORD.TITLE') }}
</h1>
<p
class="mb-4 text-sm font-normal leading-6 tracking-normal text-slate-600 dark:text-woot-50"
>
{{
useInstallationName(
$t('RESET_PASSWORD.DESCRIPTION'),
globalConfig.installationName
)
}}
</p>
<div class="space-y-5">
<form-input
v-model.trim="credentials.email"
name="email_address"
:has-error="v$.credentials.email.$error"
:error-message="$t('RESET_PASSWORD.EMAIL.ERROR')"
:placeholder="$t('RESET_PASSWORD.EMAIL.PLACEHOLDER')"
@input="v$.credentials.email.$touch"
/>
<SubmitButton
:disabled="v$.credentials.email.$invalid || resetPassword.showLoading"
:button-text="$t('RESET_PASSWORD.SUBMIT')"
:loading="resetPassword.showLoading"
/>
</div>
<p class="mt-4 -mb-1 text-sm text-slate-600 dark:text-woot-50">
{{ $t('RESET_PASSWORD.GO_BACK_TO_LOGIN') }}
<router-link to="/auth/login" class="text-link">
{{ $t('COMMON.CLICK_HERE') }}.
</router-link>
</p>
</form>
</div>
</template>
<script>
import { useVuelidate } from '@vuelidate/core';
import { mapGetters } from 'vuex';
@@ -111,3 +63,51 @@ export default {
},
};
</script>
<template>
<div
class="flex flex-col justify-center w-full min-h-full py-12 bg-woot-25 sm:px-6 lg:px-8 dark:bg-slate-900"
>
<form
class="bg-white shadow sm:mx-auto sm:w-full sm:max-w-lg dark:bg-slate-800 p-11 sm:shadow-lg sm:rounded-lg"
@submit.prevent="submit"
>
<h1
class="mb-1 text-2xl font-medium tracking-tight text-left text-slate-900 dark:text-white"
>
{{ $t('RESET_PASSWORD.TITLE') }}
</h1>
<p
class="mb-4 text-sm font-normal leading-6 tracking-normal text-slate-600 dark:text-woot-50"
>
{{
useInstallationName(
$t('RESET_PASSWORD.DESCRIPTION'),
globalConfig.installationName
)
}}
</p>
<div class="space-y-5">
<form-input
v-model.trim="credentials.email"
name="email_address"
:has-error="v$.credentials.email.$error"
:error-message="$t('RESET_PASSWORD.EMAIL.ERROR')"
:placeholder="$t('RESET_PASSWORD.EMAIL.PLACEHOLDER')"
@input="v$.credentials.email.$touch"
/>
<SubmitButton
:disabled="v$.credentials.email.$invalid || resetPassword.showLoading"
:button-text="$t('RESET_PASSWORD.SUBMIT')"
:loading="resetPassword.showLoading"
/>
</div>
<p class="mt-4 -mb-1 text-sm text-slate-600 dark:text-woot-50">
{{ $t('RESET_PASSWORD.GO_BACK_TO_LOGIN') }}
<router-link to="/auth/login" class="text-link">
{{ $t('COMMON.CLICK_HERE') }}.
</router-link>
</p>
</form>
</div>
</template>
+34 -34
View File
@@ -1,3 +1,37 @@
<script>
import { mapGetters } from 'vuex';
import globalConfigMixin from 'shared/mixins/globalConfigMixin';
import SignupForm from './components/Signup/Form.vue';
import Testimonials from './components/Testimonials/Index.vue';
import Spinner from 'shared/components/Spinner.vue';
export default {
components: {
SignupForm,
Spinner,
Testimonials,
},
mixins: [globalConfigMixin],
data() {
return { isLoading: false };
},
computed: {
...mapGetters({ globalConfig: 'globalConfig/get' }),
isAChatwootInstance() {
return this.globalConfig.installationName === 'Chatwoot';
},
},
beforeMount() {
this.isLoading = this.isAChatwootInstance;
},
methods: {
resizeContainers() {
this.isLoading = false;
},
},
};
</script>
<template>
<div class="h-full w-full dark:bg-slate-900">
<div v-show="!isLoading" class="flex h-full">
@@ -51,37 +85,3 @@
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import globalConfigMixin from 'shared/mixins/globalConfigMixin';
import SignupForm from './components/Signup/Form.vue';
import Testimonials from './components/Testimonials/Index.vue';
import Spinner from 'shared/components/Spinner.vue';
export default {
components: {
SignupForm,
Spinner,
Testimonials,
},
mixins: [globalConfigMixin],
data() {
return { isLoading: false };
},
computed: {
...mapGetters({ globalConfig: 'globalConfig/get' }),
isAChatwootInstance() {
return this.globalConfig.installationName === 'Chatwoot';
},
},
beforeMount() {
this.isLoading = this.isAChatwootInstance;
},
methods: {
resizeContainers() {
this.isLoading = false;
},
},
};
</script>
@@ -1,83 +1,3 @@
<template>
<div class="flex-1 px-1 overflow-auto">
<form class="space-y-3" @submit.prevent="submit">
<div class="flex">
<form-input
v-model.trim="credentials.fullName"
name="full_name"
class="flex-1"
:class="{ error: v$.credentials.fullName.$error }"
:label="$t('REGISTER.FULL_NAME.LABEL')"
:placeholder="$t('REGISTER.FULL_NAME.PLACEHOLDER')"
:has-error="v$.credentials.fullName.$error"
:error-message="$t('REGISTER.FULL_NAME.ERROR')"
@blur="v$.credentials.fullName.$touch"
/>
<form-input
v-model.trim="credentials.accountName"
name="account_name"
class="flex-1 ml-2"
:class="{ error: v$.credentials.accountName.$error }"
:label="$t('REGISTER.COMPANY_NAME.LABEL')"
:placeholder="$t('REGISTER.COMPANY_NAME.PLACEHOLDER')"
:has-error="v$.credentials.accountName.$error"
:error-message="$t('REGISTER.COMPANY_NAME.ERROR')"
@blur="v$.credentials.accountName.$touch"
/>
</div>
<form-input
v-model.trim="credentials.email"
type="email"
name="email_address"
:class="{ error: v$.credentials.email.$error }"
:label="$t('REGISTER.EMAIL.LABEL')"
:placeholder="$t('REGISTER.EMAIL.PLACEHOLDER')"
:has-error="v$.credentials.email.$error"
:error-message="$t('REGISTER.EMAIL.ERROR')"
@blur="v$.credentials.email.$touch"
/>
<form-input
v-model.trim="credentials.password"
type="password"
name="password"
:class="{ error: v$.credentials.password.$error }"
:label="$t('LOGIN.PASSWORD.LABEL')"
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
:has-error="v$.credentials.password.$error"
:error-message="passwordErrorText"
@blur="v$.credentials.password.$touch"
/>
<div v-if="globalConfig.hCaptchaSiteKey" class="mb-3">
<vue-hcaptcha
ref="hCaptcha"
:class="{ error: !hasAValidCaptcha && didCaptchaReset }"
:sitekey="globalConfig.hCaptchaSiteKey"
@verify="onRecaptchaVerified"
/>
<span
v-if="!hasAValidCaptcha && didCaptchaReset"
class="text-xs text-red-400"
>
{{ $t('SET_NEW_PASSWORD.CAPTCHA.ERROR') }}
</span>
</div>
<submit-button
:button-text="$t('REGISTER.SUBMIT')"
:disabled="isSignupInProgress || !hasAValidCaptcha"
:loading="isSignupInProgress"
icon-class="arrow-chevron-right"
/>
</form>
<GoogleOAuthButton v-if="showGoogleOAuth" class="flex-col-reverse">
{{ $t('REGISTER.OAUTH.GOOGLE_SIGNUP') }}
</GoogleOAuthButton>
<p
class="text-sm mb-1 mt-5 text-slate-800 dark:text-woot-50 [&>a]:text-woot-500 [&>a]:font-medium [&>a]:hover:text-woot-600"
v-html="termsLink"
/>
</div>
</template>
<script>
import { useVuelidate } from '@vuelidate/core';
import { required, minLength, email } from '@vuelidate/validators';
@@ -210,6 +130,86 @@ export default {
},
};
</script>
<template>
<div class="flex-1 px-1 overflow-auto">
<form class="space-y-3" @submit.prevent="submit">
<div class="flex">
<form-input
v-model.trim="credentials.fullName"
name="full_name"
class="flex-1"
:class="{ error: v$.credentials.fullName.$error }"
:label="$t('REGISTER.FULL_NAME.LABEL')"
:placeholder="$t('REGISTER.FULL_NAME.PLACEHOLDER')"
:has-error="v$.credentials.fullName.$error"
:error-message="$t('REGISTER.FULL_NAME.ERROR')"
@blur="v$.credentials.fullName.$touch"
/>
<form-input
v-model.trim="credentials.accountName"
name="account_name"
class="flex-1 ml-2"
:class="{ error: v$.credentials.accountName.$error }"
:label="$t('REGISTER.COMPANY_NAME.LABEL')"
:placeholder="$t('REGISTER.COMPANY_NAME.PLACEHOLDER')"
:has-error="v$.credentials.accountName.$error"
:error-message="$t('REGISTER.COMPANY_NAME.ERROR')"
@blur="v$.credentials.accountName.$touch"
/>
</div>
<form-input
v-model.trim="credentials.email"
type="email"
name="email_address"
:class="{ error: v$.credentials.email.$error }"
:label="$t('REGISTER.EMAIL.LABEL')"
:placeholder="$t('REGISTER.EMAIL.PLACEHOLDER')"
:has-error="v$.credentials.email.$error"
:error-message="$t('REGISTER.EMAIL.ERROR')"
@blur="v$.credentials.email.$touch"
/>
<form-input
v-model.trim="credentials.password"
type="password"
name="password"
:class="{ error: v$.credentials.password.$error }"
:label="$t('LOGIN.PASSWORD.LABEL')"
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
:has-error="v$.credentials.password.$error"
:error-message="passwordErrorText"
@blur="v$.credentials.password.$touch"
/>
<div v-if="globalConfig.hCaptchaSiteKey" class="mb-3">
<vue-hcaptcha
ref="hCaptcha"
:class="{ error: !hasAValidCaptcha && didCaptchaReset }"
:sitekey="globalConfig.hCaptchaSiteKey"
@verify="onRecaptchaVerified"
/>
<span
v-if="!hasAValidCaptcha && didCaptchaReset"
class="text-xs text-red-400"
>
{{ $t('SET_NEW_PASSWORD.CAPTCHA.ERROR') }}
</span>
</div>
<submit-button
:button-text="$t('REGISTER.SUBMIT')"
:disabled="isSignupInProgress || !hasAValidCaptcha"
:loading="isSignupInProgress"
icon-class="arrow-chevron-right"
/>
</form>
<GoogleOAuthButton v-if="showGoogleOAuth" class="flex-col-reverse">
{{ $t('REGISTER.OAUTH.GOOGLE_SIGNUP') }}
</GoogleOAuthButton>
<p
class="text-sm mb-1 mt-5 text-slate-800 dark:text-woot-50 [&>a]:text-woot-500 [&>a]:font-medium [&>a]:hover:text-woot-600"
v-html="termsLink"
/>
</div>
</template>
<style scoped lang="scss">
.h-captcha--box {
&::v-deep .error {
@@ -1,3 +1,29 @@
<script>
import TestimonialCard from './TestimonialCard.vue';
import { getTestimonialContent } from '../../../../../api/testimonials';
export default {
components: { TestimonialCard },
data() {
return { testimonials: [] };
},
beforeMount() {
this.fetchTestimonials();
},
methods: {
async fetchTestimonials() {
try {
const { data } = await getTestimonialContent();
this.testimonials = data;
} catch (error) {
// Ignoring the error as the UI wouldn't break
} finally {
this.$emit('resize-containers', !!this.testimonials.length);
}
},
},
};
</script>
<template>
<div
v-if="testimonials.length"
@@ -31,32 +57,6 @@
</div>
</template>
<script>
import TestimonialCard from './TestimonialCard.vue';
import { getTestimonialContent } from '../../../../../api/testimonials';
export default {
components: { TestimonialCard },
data() {
return { testimonials: [] };
},
beforeMount() {
this.fetchTestimonials();
},
methods: {
async fetchTestimonials() {
try {
const { data } = await getTestimonialContent();
this.testimonials = data;
} catch (error) {
// Ignoring the error as the UI wouldn't break
} finally {
this.$emit('resize-containers', !!this.testimonials.length);
}
},
},
};
</script>
<style lang="scss" scoped>
.center--img {
}
@@ -1,21 +1,3 @@
<template>
<div
class="flex flex-col items-start justify-center p-6 w-80 bg-white rounded-lg drop-shadow-md dark:bg-slate-800"
>
<p class="text-sm text-slate-600 dark:text-woot-50 tracking-normal">
{{ reviewContent }}
</p>
<div class="flex items-center mt-4 text-slate-700 dark:text-woot-50">
<div class="bg-white rounded-full p-1">
<img :src="authorImage" class="h-8 w-8 rounded-full" />
</div>
<div class="ml-2">
<div class="text-sm font-medium">{{ authorName }}</div>
<div class="text-xs">{{ authorDesignation }}</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
@@ -38,3 +20,21 @@ export default {
},
};
</script>
<template>
<div
class="flex flex-col items-start justify-center p-6 w-80 bg-white rounded-lg drop-shadow-md dark:bg-slate-800"
>
<p class="text-sm text-slate-600 dark:text-woot-50 tracking-normal">
{{ reviewContent }}
</p>
<div class="flex items-center mt-4 text-slate-700 dark:text-woot-50">
<div class="bg-white rounded-full p-1">
<img :src="authorImage" class="h-8 w-8 rounded-full" />
</div>
<div class="ml-2">
<div class="text-sm font-medium">{{ authorName }}</div>
<div class="text-xs">{{ authorDesignation }}</div>
</div>
</div>
</div>
</template>