Add $root.username

This commit is contained in:
Louis Lam 2022-04-19 19:40:28 +08:00
parent 17d4003e5c
commit cb55e23718
3 changed files with 16 additions and 18 deletions

View File

@ -4,7 +4,7 @@
<!-- Change Password -->
<template v-if="!settings.disableAuth">
<p>
{{ $t("Current User") }}: <strong>{{ username }}</strong>
{{ $t("Current User") }}: <strong>{{ $root.username }}</strong>
<button v-if="! settings.disableAuth" id="logout-btn" class="btn btn-danger ms-4 me-2 mb-2" @click="$root.logout">{{ $t("Logout") }}</button>
</p>
@ -269,7 +269,6 @@ export default {
data() {
return {
username: "",
invalidPassword: false,
password: {
currentPassword: "",
@ -297,10 +296,6 @@ export default {
},
},
mounted() {
this.loadUsername();
},
methods: {
savePassword() {
if (this.password.newPassword !== this.password.repeatNewPassword) {
@ -319,14 +314,6 @@ export default {
}
},
loadUsername() {
const jwtPayload = this.$root.getJWTPayload();
if (jwtPayload) {
this.username = jwtPayload.username;
}
},
disableAuth() {
this.settings.disableAuth = true;

View File

@ -34,11 +34,11 @@
<li v-if="$root.loggedIn" class="nav-item">
<div class="dropdown dropdown-profile-pic">
<div type="button" class="nav-link" data-bs-toggle="dropdown">
<div class="profile-pic">L</div>
<div class="profile-pic">{{ $root.usernameFirstChar }}</div>
<font-awesome-icon icon="angle-down" />
</div>
<ul class="dropdown-menu">
<li><span class="dropdown-item-text">Signed in as <strong>louislamlouislam</strong></span></li>
<li><span class="dropdown-item-text">Signed in as <strong>{{ $root.username }}</strong></span></li>
<li><hr class="dropdown-divider"></li>
<li>
<router-link to="/settings" class="dropdown-item" :class="{ active: $route.path.includes('settings') }">

View File

@ -28,6 +28,7 @@ export default {
connectCount: 0,
initedSocketIO: false,
},
username: null,
remember: (localStorage.remember !== "0"),
allowLoginDialog: false, // Allowed to show login dialog, but "loggedIn" have to be true too. This exists because prevent the login dialog show 0.1s in first before the socket server auth-ed.
loggedIn: false,
@ -102,6 +103,7 @@ export default {
socket.on("autoLogin", (monitorID, data) => {
this.loggedIn = true;
this.username = "No Auth";
this.storage().token = "autoLogin";
this.allowLoginDialog = false;
});
@ -233,7 +235,6 @@ export default {
if (token !== "autoLogin") {
this.loginByToken(token);
} else {
// Timeout if it is not actually auto login
setTimeout(() => {
if (! this.loggedIn) {
@ -241,7 +242,6 @@ export default {
this.$root.storage().removeItem("token");
}
}, 5000);
}
} else {
this.allowLoginDialog = true;
@ -305,6 +305,7 @@ export default {
this.storage().token = res.token;
this.socket.token = res.token;
this.loggedIn = true;
this.username = this.getJWTPayload()?.username;
// Trigger Chrome Save Password
history.pushState({}, "");
@ -322,6 +323,7 @@ export default {
this.logout();
} else {
this.loggedIn = true;
this.username = this.getJWTPayload()?.username;
}
});
},
@ -331,6 +333,7 @@ export default {
this.storage().removeItem("token");
this.socket.token = null;
this.loggedIn = false;
this.username = null;
this.clearData();
},
@ -398,6 +401,14 @@ export default {
computed: {
usernameFirstChar() {
if (typeof this.username == "string" && this.username.length >= 1) {
return this.username.charAt(0).toUpperCase();
} else {
return "🐻";
}
},
lastHeartbeatList() {
let result = {};