This commit is contained in:
Troplo 2021-01-16 15:33:33 +11:00
parent bb6f1c82b6
commit 769b039365
5 changed files with 2940 additions and 16 deletions

View file

@ -12,6 +12,7 @@
"axios": "^0.21.1",
"buefy": "^0.9.4",
"core-js": "^3.6.5",
"crypto-random-string": "^3.3.0",
"dotenv-webpack": "^6.0.0",
"socket.io": "^3.1.0",
"to-boolean": "^1.0.0",

View file

@ -49,16 +49,17 @@
required>
</b-input>
</b-field>
<b-checkbox v-model="login.doNotSaveToken">Do not save authentication token in browser (Logout when refreshed)</b-checkbox>
</section>
<footer class="modal-card-foot">
<b-button
label="Close"
@click="$emit('close')" />
<b-button
@click="doLogin()"
label="Login"
:loading="login.loading"
type="is-primary" />
<b-button
label="Close"
@click="$emit('close')" />
<b-button
@click="registerModal = true; loginModal = false"
label="Need an account?"
@ -118,14 +119,14 @@
<b-checkbox v-model="register.agree">I agree to the <router-link to="/legal/tos">Terms of Service</router-link></b-checkbox>
</section>
<footer class="modal-card-foot">
<b-button
label="Close"
@click="$emit('close')" />
<b-button
@click="doRegister()"
label="Register"
:loading="register.loading"
type="is-primary" />
<b-button
label="Close"
@click="$emit('close')" />
<b-button
@click="registerModal = false; loginModal = true"
label="Have an account?"
@ -162,6 +163,7 @@
</template>
<template #end>
<div v-if="!loading">
<b-navbar-item v-if="!$store.state.user.username" tag="div">
<div class="buttons">
<b-button @click="registerModal = true" class="button is-primary">
@ -187,6 +189,15 @@
</div>
</div>
</b-navbar-item>
</div>
<div v-if="loading">
<b-navbar-item>
<div class="fa-1x">
<i class="fas fa-circle-notch fa-spin"></i>&nbsp;
&nbsp;Loading
</div>
</b-navbar-item>
</div>
</template>
</b-navbar>
</nav>
@ -199,10 +210,12 @@ export default {
return {
loginModal: false,
registerModal: false,
loading: true,
login: {
username: '',
password: '',
loading: false
loading: false,
doNotSaveToken: false,
},
register: {
username: '',
@ -264,10 +277,38 @@ export default {
}).then((res) => {
this.login.loading = false
this.$store.commit('setToken', res.data.token)
if (!this.login.doNotSaveToken) {
localStorage.setItem('token', JSON.stringify(res.data.token));
}
Object.assign(axios.defaults, {headers: {Authorization: this.$store.state.user.token}})
this.loginModal = false
this.axios.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'userinfo')
.then(res => {
this.$store.commit('setUsername', res.data.username)
this.$store.commit('setEmail', res.data.email)
this.$store.commit('setEmailVerified', res.data.emailVerified)
this.$store.commit('setAdmin', res.data.admin)
this.$store.commit('setKoins', res.data.koins)
this.$store.commit('setID', res.data.id)
this.$store.commit('setBot', res.data.bot)
}).catch(() => {
this.$buefy.snackbar.open({message:`Error occurred while fetching user information.`, type: 'is-warning'})
})
}).catch(e => {
this.login.loading = false
AjaxErrorHandler(this.$store)(e)
this.axios.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'userinfo')
.then(res => {
this.$store.commit('setUsername', res.data.username)
this.$store.commit('setEmail', res.data.email)
this.$store.commit('setEmailVerified', res.data.emailVerified)
this.$store.commit('setAdmin', res.data.admin)
this.$store.commit('setKoins', res.data.koins)
this.$store.commit('setID', res.data.id)
this.$store.commit('setBot', res.data.bot)
}).catch(() => {
this.$buefy.snackbar.open({message:`Error occurred while fetching user information.`, type: 'is-warning'})
})
AjaxErrorHandler(this.$store)(e, (error, errors) => {
let path = error.path
@ -285,6 +326,29 @@ export default {
this.$buefy.snackbar.open(`WARNING: You have fake authenticated, you do not have authenticated API access. Use for debug purposes only.`)
Object.assign(axios.defaults, {headers: {Authorization: this.$store.state.user.token}})
}
},
mounted() {
this.axios.get(process.env.VUE_APP_APIENDPOINT + process.env.VUE_APP_APIVERSION + '/' + 'userinfo')
.then(res => {
this.$store.commit('setUsername', res.data.username)
this.$store.commit('setEmail', res.data.email)
this.$store.commit('setEmailVerified', res.data.emailVerified)
this.$store.commit('setAdmin', res.data.admin)
this.$store.commit('setKoins', res.data.koins)
this.$store.commit('setID', res.data.id)
this.$store.commit('setBot', res.data.bot)
if(localStorage.getItem('usernameCache')) {
localStorage.removeItem('usernameCache')
localStorage.setItem('usernameCache', JSON.stringify(res.data.username));
} else {
localStorage.setItem('usernameCache', JSON.stringify(res.data.username));
}
this.loading = false
}).catch(() => {
localStorage.setItem('userCache', JSON.stringify(this.$store.state.user));
this.$buefy.snackbar.open({message:`Error occurred while fetching user information.`, type: 'is-warning'})
this.loading = false
})
}
}
</script>

File diff suppressed because it is too large Load diff

View file

@ -1,6 +1,33 @@
<template>
<main>
DEBUG HOME
<div class="columns is-centered">
<div class="column is-4">
<div class="box">
<img :src="'https://cdn.kaverti.com/user/avatars/full/' + $store.state.user.avatar + '.png'" :alt="$store.state.user.username + '\'s avatar'" width="50%">
<p>{{$store.state.user.username}}</p>
</div>
</div>
<div class="column is-6">
<div class="card">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-4">John Smith</p>
<p class="subtitle is-6">@johnsmith</p>
</div>
</div>
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Phasellus nec iaculis mauris. <a>@bulmaio</a>.
<a href="#">#css</a> <a href="#">#responsive</a>
<br>
<time datetime="2016-1-1">11:09 PM - 1 Jan 2016</time>
</div>
</div>
</div>
</div>
</div>
</main>
</template>

View file

@ -4519,6 +4519,13 @@ crypto-random-string@^1.0.0:
resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-1.0.0.tgz#a230f64f568310e1498009940790ec99545bca7e"
integrity sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=
crypto-random-string@^3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-3.3.0.tgz#c7a4682b2a87146a1f8b7378ea2606f95775e7e6"
integrity sha512-teWAwfMb1d6brahYyKqcBEb5Yp8PJPvPOdOonXDnvaKOTmKDFNVE8E3Y2XQuzjNV/3XMwHbrX9fHWvrhRKt4Gg==
dependencies:
type-fest "^0.8.1"
css-color-names@0.0.4, css-color-names@^0.0.4:
version "0.0.4"
resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"