From d4a651e2110b3b2ab40af378bc31309a2fdfe588 Mon Sep 17 00:00:00 2001
From: LouisLam <louislam@users.noreply.github.com>
Date: Thu, 1 Jul 2021 22:16:02 +0800
Subject: [PATCH] implement remember me

---
 src/components/Login.vue |  4 ++--
 src/mixins/socket.js     | 22 +++++++++++++++++-----
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/components/Login.vue b/src/components/Login.vue
index 29f70b401..cc5cea576 100644
--- a/src/components/Login.vue
+++ b/src/components/Login.vue
@@ -17,7 +17,7 @@
 
                 <div class="form-check mb-3 mt-3" >
                     <label>
-                        <input type="checkbox" value="remember-me" class="form-check-input" id="remember" v-model="remember">
+                        <input type="checkbox" value="remember-me" class="form-check-input" id="remember" v-model="$root.remember">
 
                         <label class="form-check-label" for="remember">
                             Remember me
@@ -41,7 +41,7 @@ export default {
             processing: false,
             username: "",
             password: "",
-            remember: true,
+
             res: null,
         }
     },
diff --git a/src/mixins/socket.js b/src/mixins/socket.js
index 9e4879dab..71dc3441a 100644
--- a/src/mixins/socket.js
+++ b/src/mixins/socket.js
@@ -3,7 +3,6 @@ import { useToast } from 'vue-toastification'
 import dayjs from "dayjs";
 const toast = useToast()
 
-let storage = localStorage;
 let socket;
 
 export default {
@@ -16,6 +15,7 @@ export default {
                 connected: false,
                 connectCount: 0,
             },
+            remember: (localStorage.remember !== "0"),
             userTimezone: localStorage.timezone || "auto",
             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,
@@ -107,8 +107,8 @@ export default {
                 this.clearData()
             }
 
-            if (storage.token) {
-                this.loginByToken(storage.token)
+            if (this.storage().token) {
+                this.loginByToken(this.storage().token)
             } else {
                 this.allowLoginDialog = true;
             }
@@ -120,6 +120,10 @@ export default {
 
     methods: {
 
+        storage() {
+            return (this.remember) ? localStorage : sessionStorage;
+        },
+
         getSocket() {
           return socket;
         },
@@ -139,7 +143,7 @@ export default {
             }, (res) => {
 
                 if (res.ok) {
-                    storage.token = res.token;
+                    this.storage().token = res.token;
                     this.socket.token = res.token;
                     this.loggedIn = true;
 
@@ -164,7 +168,7 @@ export default {
         },
 
         logout() {
-            storage.removeItem("token");
+            this.storage().removeItem("token");
             this.socket.token = null;
             this.loggedIn = false;
 
@@ -240,6 +244,14 @@ export default {
 
             return result;
         }
+    },
+
+    watch: {
+
+        remember() {
+            localStorage.remember = (this.remember) ? "1" : "0"
+        }
+
     }
 
 }