There seems to be an issue with password validation when requiring 1 upper case, 1 lower case, 1 number, and 1 special character.
methods: {
validateBeforeSubmit() {
this.$validator.localize('en', dict)
this.$validator.validateAll()
.then(function(response){
})
.catch(function(e){
})
}
}<form class="center-container" @submit.prevent="validateBeforeSubmit()">
<input
:type="passwordFieldType"
v-model="user.password"
v-model.trim="$v.user.password.$model"
id="password"
name="password"
class="input-section-three-login"
:class="{'is-invalid': validationStatus($v.user.password) }"
placeholder="Enter new password"
v-on:keypress="isPassword($event)" ref="password"
v-validate="{ required: true, min: 10, regex: /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).*$/ }"/>
<input
:type="passwordFieldTypetwo"
v-model="user.confirmPassword"
id="confirmPassword"
name="confirmPassword"
class="input-section-three-login"
:class="{
'is-invalid': submitted && $v.user.confirmPassword.$error,
}"
placeholder="Confirm password"
:maxlength="maxconfirmpassword"
v-on:keypress="isconfirmPassword($event)"
:disabled="user.password.length < 8"
v-validate="'confirmPassword'" data-vv-as="password"/>
<button class="register-button-screen2"v-on:click="registerMe"
:disabled="user.confirmPassword != user.password "
:class="(isDisabled) ? '' : 'selected'">Register</button>
<div class="alert alert-danger" v-show="errors.any()">
<div v-if="errors.has('password')">
{{ errors.first('password') }}
</div>
<div v-if="errors.has('password_confirmation')">
{{ errors.first('password_confirmation') }}
</div>
</div>
</form>There appears to be a complexity issue with the current password validation requirements.