Johannes Zellner
92 lines
1.4 KiB
Vue
92 lines
1.4 KiB
Vue
<template>
|
|
<LoginView :login-url="loginUrl" @error="onError" @success="onSuccess"/>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import { LoginView } from 'pankow';
|
|
|
|
// can be exposed as env var, see develop.sh
|
|
const BASE_URL = import.meta.env.VITE_API_ORIGIN ? 'https://' + import.meta.env.VITE_API_ORIGIN : '';
|
|
|
|
export default {
|
|
components: {
|
|
LoginView
|
|
},
|
|
data() {
|
|
return {
|
|
username: '',
|
|
password: '',
|
|
totpToken: '',
|
|
error: '',
|
|
busy: false,
|
|
loginUrl: `${BASE_URL}/api/v1/cloudron/login`
|
|
};
|
|
},
|
|
methods: {
|
|
onError(error) {
|
|
console.error('Error loggin in', error);
|
|
},
|
|
onSuccess(accessToken) {
|
|
console.log('Success loggin in');
|
|
|
|
localStorage.accessToken = accessToken;
|
|
this.$router.push('/home');
|
|
}
|
|
}
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
|
h1 {
|
|
color: #777;
|
|
font-weight: normal;
|
|
font-size: 24px;
|
|
}
|
|
|
|
h1 b {
|
|
color: black;
|
|
font-size: 36px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 640px;
|
|
margin: auto;
|
|
margin-top: 100px;
|
|
padding: 20px;
|
|
background-color: white;
|
|
box-shadow: 0 2px 5px rgba(0,0,0,.1);
|
|
text-align: center;
|
|
}
|
|
|
|
.field * {
|
|
display: block;
|
|
width: 100%;
|
|
text-align: left;
|
|
}
|
|
|
|
.field label {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.field {
|
|
margin-bottom: 15px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.action-bar {
|
|
display: flex;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.action-bar * {
|
|
align-self: baseline;
|
|
}
|
|
|
|
</style>
|