akadmin/chatwoot
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Upgrade @vuelidate to 2.x

Browse Source
This commit is contained in:
Pranav Raj S
2024-01-25 12:15:21 -08:00
parent c33c844039
commit 1fe3960285
81 changed files with 866 additions and 601 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/javascript/v3/views/auth/password/Edit.vue
+12 -7
View File
@@ -18,25 +18,25 @@
class="mt-3"
name="password"
type="password"
:has-error="$v.credentials.password.$error"
: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"
@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"
: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"
@blur="v$.credentials.confirmPassword.$touch"
/>
<submit-button
:disabled="
$v.credentials.password.$invalid ||
$v.credentials.confirmPassword.$invalid ||
v$.credentials.password.$invalid ||
v$.credentials.confirmPassword.$invalid ||
newPasswordAPI.showLoading
"
:button-text="$t('SET_NEW_PASSWORD.SUBMIT')"
@@ -48,7 +48,9 @@
</template>
<script>
import { required, minLength } from 'vuelidate/lib/validators';
import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators';
import FormInput from '../../../components/Form/Input.vue';
import SubmitButton from '../../../components/Button/SubmitButton.vue';
import { DEFAULT_REDIRECT_URL } from 'dashboard/constants/globals';
@@ -64,6 +66,9 @@ export default {
redirectUrl: { type: String, default: '' },
config: { type: String, default: '' },
},
setup() {
return { v$: useVuelidate() };
},
data() {
return {
// We need to initialize the component with any
app/javascript/v3/views/auth/reset/password/Index.vue
+9 -4
View File
@@ -25,13 +25,13 @@
<form-input
v-model.trim="credentials.email"
name="email_address"
:has-error="$v.credentials.email.$error"
:has-error="v$.credentials.email.$error"
:error-message="$t('RESET_PASSWORD.EMAIL.ERROR')"
:placeholder="$t('RESET_PASSWORD.EMAIL.PLACEHOLDER')"
@input="$v.credentials.email.$touch"
@input="v$.credentials.email.$touch"
/>
<SubmitButton
:disabled="$v.credentials.email.$invalid || resetPassword.showLoading"
:disabled="v$.credentials.email.$invalid || resetPassword.showLoading"
:button-text="$t('RESET_PASSWORD.SUBMIT')"
:loading="resetPassword.showLoading"
/>
@@ -47,7 +47,9 @@
</template>
<script>
import { required, minLength, email } from 'vuelidate/lib/validators';
import { useVuelidate } from '@vuelidate/core';
import { required, minLength, email } from '@vuelidate/validators';
import globalConfigMixin from 'shared/mixins/globalConfigMixin';
import { mapGetters } from 'vuex';
import FormInput from '../../../../components/Form/Input.vue';
@@ -57,6 +59,9 @@ import SubmitButton from '../../../../components/Button/SubmitButton.vue';
export default {
components: { FormInput, SubmitButton },
mixins: [globalConfigMixin],
setup() {
return { v$: useVuelidate() };
},
data() {
return {
credentials: { email: '' },
app/javascript/v3/views/auth/signup/components/Signup/Form.vue
+21 -16
View File
@@ -6,46 +6,46 @@
v-model.trim="credentials.fullName"
name="full_name"
class="flex-1"
:class="{ error: $v.credentials.fullName.$error }"
:class="{ error: v$.credentials.fullName.$error }"
:label="$t('REGISTER.FULL_NAME.LABEL')"
:placeholder="$t('REGISTER.FULL_NAME.PLACEHOLDER')"
:has-error="$v.credentials.fullName.$error"
:has-error="v$.credentials.fullName.$error"
:error-message="$t('REGISTER.FULL_NAME.ERROR')"
@blur="$v.credentials.fullName.$touch"
@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 }"
:class="{ error: v$.credentials.accountName.$error }"
:label="$t('REGISTER.COMPANY_NAME.LABEL')"
:placeholder="$t('REGISTER.COMPANY_NAME.PLACEHOLDER')"
:has-error="$v.credentials.accountName.$error"
:has-error="v$.credentials.accountName.$error"
:error-message="$t('REGISTER.COMPANY_NAME.ERROR')"
@blur="$v.credentials.accountName.$touch"
@blur="v$.credentials.accountName.$touch"
/>
</div>
<form-input
v-model.trim="credentials.email"
type="email"
name="email_address"
:class="{ error: $v.credentials.email.$error }"
:class="{ error: v$.credentials.email.$error }"
:label="$t('REGISTER.EMAIL.LABEL')"
:placeholder="$t('REGISTER.EMAIL.PLACEHOLDER')"
:has-error="$v.credentials.email.$error"
:has-error="v$.credentials.email.$error"
:error-message="$t('REGISTER.EMAIL.ERROR')"
@blur="$v.credentials.email.$touch"
@blur="v$.credentials.email.$touch"
/>
<form-input
v-model.trim="credentials.password"
type="password"
name="password"
:class="{ error: $v.credentials.password.$error }"
:class="{ error: v$.credentials.password.$error }"
:label="$t('LOGIN.PASSWORD.LABEL')"
:placeholder="$t('SET_NEW_PASSWORD.PASSWORD.PLACEHOLDER')"
:has-error="$v.credentials.password.$error"
:has-error="v$.credentials.password.$error"
:error-message="passwordErrorText"
@blur="$v.credentials.password.$touch"
@blur="v$.credentials.password.$touch"
/>
<div v-if="globalConfig.hCaptchaSiteKey" class="mb-3">
<vue-hcaptcha
@@ -79,7 +79,9 @@
</template>
<script>
import { required, minLength, email } from 'vuelidate/lib/validators';
import { useVuelidate } from '@vuelidate/core';
import { required, minLength, email } from '@vuelidate/validators';
import { mapGetters } from 'vuex';
import globalConfigMixin from 'shared/mixins/globalConfigMixin';
import alertMixin from 'shared/mixins/alertMixin';
@@ -100,6 +102,9 @@ export default {
VueHcaptcha,
},
mixins: [globalConfigMixin, alertMixin],
setup() {
return { v$: useVuelidate() };
},
data() {
return {
credentials: {
@@ -155,7 +160,7 @@ export default {
return true;
},
passwordErrorText() {
const { password } = this.$v.credentials;
const { password } = this.v$.credentials;
if (!password.$error) {
return '';
}
@@ -173,8 +178,8 @@ export default {
},
methods: {
async submit() {
this.$v.$touch();
if (this.$v.$invalid) {
this.v$.$touch();
if (this.v$.$invalid) {
this.resetCaptcha();
return;
}
app/javascript/v3/views/login/Index.vue
+12 -6
View File
@@ -49,8 +49,8 @@
required
:label="$t('LOGIN.EMAIL.LABEL')"
:placeholder="$t('LOGIN.EMAIL.PLACEHOLDER')"
:has-error="$v.credentials.email.$error"
@input="$v.credentials.email.$touch"
:has-error="v$.credentials.email.$error"
@input="v$.credentials.email.$touch"
/>
<form-input
v-model.trim="credentials.password"
@@ -60,8 +60,8 @@
required
:label="$t('LOGIN.PASSWORD.LABEL')"
:placeholder="$t('LOGIN.PASSWORD.PLACEHOLDER')"
:has-error="$v.credentials.password.$error"
@input="$v.credentials.password.$touch"
:has-error="v$.credentials.password.$error"
@input="v$.credentials.password.$touch"
>
<p v-if="!globalConfig.disableUserProfileUpdate">
<router-link to="auth/reset/password" class="text-link">
@@ -84,7 +84,9 @@
</template>
<script>
import { required, email } from 'vuelidate/lib/validators';
import { useVuelidate } from '@vuelidate/core';
import { required, email } from '@vuelidate/validators';
import globalConfigMixin from 'shared/mixins/globalConfigMixin';
import SubmitButton from '../../components/Button/SubmitButton.vue';
import { mapGetters } from 'vuex';
@@ -93,6 +95,7 @@ import GoogleOAuthButton from '../../components/GoogleOauth/Button.vue';
import FormInput from '../../components/Form/Input.vue';
import { login } from '../../api/auth';
import Spinner from 'shared/components/Spinner.vue';
const ERROR_MESSAGES = {
'no-account-found': 'LOGIN.OAUTH.NO_ACCOUNT_FOUND',
'business-account-only': 'LOGIN.OAUTH.BUSINESS_ACCOUNTS_ONLY',
@@ -114,6 +117,9 @@ export default {
email: { type: String, default: '' },
authError: { type: String, default: '' },
},
setup() {
return { v$: useVuelidate() };
},
data() {
return {
// We need to initialize the component with any
@@ -173,7 +179,7 @@ export default {
bus.$emit('newToastMessage', this.loginApi.message);
},
submitLogin() {
if (this.$v.credentials.email.$invalid && !this.email) {
if (this.v$.credentials.email.$invalid && !this.email) {
this.showAlert(this.$t('LOGIN.EMAIL.ERROR'));
return;
}