Merge branch 'fix/add-back-login-error' into 'develop'

Fix/add back login error

See merge request pleroma/pleroma-fe!485
This commit is contained in:
lambda 2019-01-28 16:21:33 +00:00
commit 53712c1570
4 changed files with 60 additions and 28 deletions

View file

@ -654,6 +654,33 @@ nav {
border-radius: var(--inputRadius, $fallback--inputRadius);
}
@keyframes shakeError {
0% {
transform: translateX(0);
}
15% {
transform: translateX(0.375rem);
}
30% {
transform: translateX(-0.375rem);
}
45% {
transform: translateX(0.375rem);
}
60% {
transform: translateX(-0.375rem);
}
75% {
transform: translateX(0.375rem);
}
90% {
transform: translateX(-0.375rem);
}
100% {
transform: translateX(0);
}
}
@media all and (max-width: 959px) {
.mobile-hidden {
display: none;

View file

@ -22,19 +22,29 @@ const LoginForm = {
oauth: this.$store.state.oauth,
instance: this.$store.state.instance.server
}
this.clearError()
oauthApi.getOrCreateApp(data).then((app) => {
oauthApi.getTokenWithCredentials(
{
app,
instance: data.instance,
username: this.user.username,
password: this.user.password})
.then((result) => {
password: this.user.password
}
).then((result) => {
if (result.error) {
this.authError = result.error
this.user.password = ''
return
}
this.$store.commit('setToken', result.access_token)
this.$store.dispatch('loginUser', result.access_token)
this.$router.push({name: 'friends'})
})
})
},
clearError () {
this.authError = false
}
}
}

View file

@ -33,6 +33,13 @@
</div>
</div>
</form>
<div v-if="authError" class='form-group'>
<div class='alert error'>
{{authError}}
<i class="button-icon icon-cancel" @click="clearError"></i>
</div>
</div>
</div>
</div>
</template>
@ -48,10 +55,6 @@
width: 10em;
}
.error {
text-align: center;
}
.register {
flex: 1 1;
}
@ -64,4 +67,14 @@
justify-content: space-between;
}
}
.login {
.error {
text-align: center;
animation-name: shakeError;
animation-duration: 0.4s;
animation-timing-function: ease-in-out;
}
}
</style>

View file

@ -147,24 +147,6 @@ $validations-cRed: #f04124;
margin-bottom: 1em;
}
@keyframes shakeError {
0% {
transform: translateX(0); }
15% {
transform: translateX(0.375rem); }
30% {
transform: translateX(-0.375rem); }
45% {
transform: translateX(0.375rem); }
60% {
transform: translateX(-0.375rem); }
75% {
transform: translateX(0.375rem); }
90% {
transform: translateX(-0.375rem); }
100% {
transform: translateX(0); } }
.form-group--error {
animation-name: shakeError;
animation-duration: .6s;