applying compatability changes from new-website to this

This commit is contained in:
Andrew Gundersen 2022-02-11 11:18:58 -06:00
commit ead81883b2
13 changed files with 232 additions and 190 deletions

View file

@ -1,58 +1,40 @@
import SmartForm from "./form.js";
const Login =
{
components: {
SmartForm
},
setup()
{
const usr = Vue.ref("");
const pwd = Vue.ref("");
const submitForm = async () => {
const success = await window.mainApi.invoke("login", usr.value, pwd.value);
if (!success) shake("login-form");
}
return { usr, pwd, submitForm };
return;
},
template: `
<form id="login" @submit.prevent="submitForm">
<div id="login">
<!-- username and password forms -->
<div id="login-form">
<!-- username -->
<div class="login-input-box">
<input class="login-input" type="text" v-model="usr" />
<div class="login-input-modifier">Email</div>
</div>
<!-- <SmartForm
:fields="[{
name: 'email',
value: null,
placeholder: 'Email',
},
{
name: 'password',
value: null,
placeholder: 'Password'
},
{
name: 'repassword',
value: null,
placeholder: 'Re-Password'
}]"
:channel="'auth'"
:modifier="'Login or re-enter password to register.'"
/> -->
<!-- password -->
<div class="login-input-box">
<input class="login-input" type="password" v-model="pwd" />
<div class="login-input-modifier">Password</div>
</div>
</div>
<!-- submit button; position: fixed -->
<button
class="login-submit-button button"
type="submit"
>
Login
</button>
</form> `
}
/** Shake a div to indicate incorrect credentials */
const shake = (elementId) =>
{
const el = document.getElementById(elementId);
if (el)
el.classList.remove("shake");
setTimeout(() => {
if (el) el.classList.add("shake");
}, 250);
</div>`
}
export default Login;