parent
b9a6088f50
commit
0969be5981
@ -1,10 +1,10 @@
|
|||||||
import { library } from "@fortawesome/fontawesome-svg-core"
|
import { library } from "@fortawesome/fontawesome-svg-core"
|
||||||
import { faCog, faEdit, faList, faPause, faPlay, faPlus, faSignInAlt, faSignOutAlt, faTachometerAlt, faTrash } from "@fortawesome/free-solid-svg-icons"
|
import { faCog, faEdit, faList, faPause, faPlay, faPlus, faTachometerAlt, faTrash } from "@fortawesome/free-solid-svg-icons"
|
||||||
//import { fa } from '@fortawesome/free-regular-svg-icons'
|
//import { fa } from '@fortawesome/free-regular-svg-icons'
|
||||||
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"
|
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"
|
||||||
|
|
||||||
// Add Free Font Awesome Icons here
|
// Add Free Font Awesome Icons here
|
||||||
// https://fontawesome.com/v5.15/icons?d=gallery&p=2&s=solid&m=free
|
// https://fontawesome.com/v5.15/icons?d=gallery&p=2&s=solid&m=free
|
||||||
library.add(faCog, faTachometerAlt, faEdit, faPlus, faPause, faPlay, faTrash, faList, faSignInAlt, faSignOutAlt)
|
library.add(faCog, faTachometerAlt, faEdit, faPlus, faPause, faPlay, faTrash, faList)
|
||||||
|
|
||||||
export { FontAwesomeIcon }
|
export { FontAwesomeIcon }
|
||||||
|
@ -1,78 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="form-container">
|
|
||||||
<div class="form">
|
|
||||||
<form @submit.prevent="submit">
|
|
||||||
<h1 class="h3 mb-3 fw-normal" />
|
|
||||||
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="floatingInput" v-model="username" type="text" class="form-control" placeholder="Username">
|
|
||||||
<label for="floatingInput">Username</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-floating mt-3">
|
|
||||||
<input id="floatingPassword" v-model="password" type="password" class="form-control" placeholder="Password">
|
|
||||||
<label for="floatingPassword">Password</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-check mb-3 mt-3 d-flex justify-content-center pe-4">
|
|
||||||
<div class="form-check">
|
|
||||||
<input id="remember" v-model="$root.remember" type="checkbox" value="remember-me" class="form-check-input">
|
|
||||||
|
|
||||||
<label class="form-check-label" for="remember">
|
|
||||||
Remember me
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button class="w-100 btn btn-primary" type="submit" :disabled="processing">
|
|
||||||
Login
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div v-if="res && !res.ok" class="alert alert-danger mt-3" role="alert">
|
|
||||||
{{ res.msg }}
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
processing: false,
|
|
||||||
username: "",
|
|
||||||
password: "",
|
|
||||||
|
|
||||||
res: null,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
submit() {
|
|
||||||
this.processing = true;
|
|
||||||
this.$root.login(this.username, this.password, (res) => {
|
|
||||||
this.processing = false;
|
|
||||||
this.res = res;
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
.form-container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding-top: 40px;
|
|
||||||
padding-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form {
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
max-width: 330px;
|
|
||||||
padding: 15px;
|
|
||||||
margin: auto;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in new issue