mirror of
https://github.com/Floriansylvain/RenewCMS.git
synced 2026-08-19 11:43:22 +02:00
Added disabled button
This commit is contained in:
@@ -82,7 +82,8 @@ h2, h3, h4, h5, h6 {
|
|||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-primary {
|
.button-primary,
|
||||||
|
.button-disabled {
|
||||||
border-radius: var(--radius);
|
border-radius: var(--radius);
|
||||||
border: none;
|
border: none;
|
||||||
|
|
||||||
@@ -102,3 +103,9 @@ h2, h3, h4, h5, h6 {
|
|||||||
.button-primary:active {
|
.button-primary:active {
|
||||||
background-color: var(--primary-dark);
|
background-color: var(--primary-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.button-disabled {
|
||||||
|
color: var(--neutral-dark);
|
||||||
|
background-color: var(--neutral-light);
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
@@ -7,8 +7,13 @@ import { useRouter } from 'vue-router';
|
|||||||
|
|
||||||
const isTokenOK: Ref<boolean|undefined> = ref(undefined)
|
const isTokenOK: Ref<boolean|undefined> = ref(undefined)
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const authStore = useAuthStore()
|
const authStore = useAuthStore()
|
||||||
|
const email = ref('')
|
||||||
|
const password = ref('')
|
||||||
|
|
||||||
|
const isFormEmpty: ()=>boolean = () => {
|
||||||
|
return email.value === '' || password.value === ''
|
||||||
|
}
|
||||||
|
|
||||||
function updateJWTcookies(JWTdata: jwtFormat): void {
|
function updateJWTcookies(JWTdata: jwtFormat): void {
|
||||||
const cookieExpire = new Date(JWTdata.expire)
|
const cookieExpire = new Date(JWTdata.expire)
|
||||||
@@ -59,16 +64,12 @@ function login(email: string, password: string): void {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const email = ref('')
|
|
||||||
const password = ref('')
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="login-page">
|
<div class="login-page">
|
||||||
<div class="login-form">
|
<div class="login-form">
|
||||||
<h2>Connexion à GohCMS</h2>
|
<h2>Connexion à <span style="color:#00ACD7">Go</span>hCMS</h2>
|
||||||
|
|
||||||
<form @submit.prevent="login(email, password)">
|
<form @submit.prevent="login(email, password)">
|
||||||
<div class="inputs-group">
|
<div class="inputs-group">
|
||||||
@@ -83,7 +84,9 @@ const password = ref('')
|
|||||||
<p v-else-if="useErrorsStore().sessionExpired">⌛ Votre session a expiré.</p>
|
<p v-else-if="useErrorsStore().sessionExpired">⌛ Votre session a expiré.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<button class="button-primary" type="submit">Se connecter</button>
|
<button :class="`button-${isFormEmpty() ? 'disabled' : 'primary'}`" type="submit" :disabled="isFormEmpty()">
|
||||||
|
Se connecter
|
||||||
|
</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user