瀏覽代碼

Login and logout

master
LeneS 5 年之前
父節點
當前提交
9888d2fa08
共有 3 個檔案被更改,包括 21 行新增13 行删除
  1. 19
    9
      src/components/shared/navBar.vue
  2. 0
    1
      src/components/user/loginPage.vue
  3. 2
    3
      src/store/modules/user/authentication.js

+ 19
- 9
src/components/shared/navBar.vue 查看文件

1
 <template>
1
 <template>
2
   <!-- eslint-disable max-len -->
2
   <!-- eslint-disable max-len -->
3
   <nav class="navbar navbar-default navbar-trans navbar-expand-lg fixed-top">
3
   <nav class="navbar navbar-default navbar-trans navbar-expand-lg fixed-top">
4
-    <div class="container-fluid">
4
+    <div class="container">
5
       <button
5
       <button
6
         class="navbar-toggler collapsed"
6
         class="navbar-toggler collapsed"
7
         type="button"
7
         type="button"
16
         <span></span>
16
         <span></span>
17
       </button>
17
       </button>
18
       <a class="navbar-brand text-brand" @click="routerGoTo('/')">
18
       <a class="navbar-brand text-brand" @click="routerGoTo('/')">
19
-        <img
20
-          class="img-fluid"
21
-          src="/img/logos/UVProp.png"
22
-          alt="Voasa Logo"
23
-          style="width:90px;height:45px;"
24
-        />
25
         Uni-Vate
19
         Uni-Vate
26
         <span class="color-b">Properties</span>
20
         <span class="color-b">Properties</span>
27
       </a>
21
       </a>
220
         <span class="fa fa-search" aria-hidden="true"></span>
214
         <span class="fa fa-search" aria-hidden="true"></span>
221
       </button>
215
       </button>
222
     </div>
216
     </div>
217
+    <span v-if="showLogout">
218
+      <a @click="logout()">Logout</a>
219
+    </span>
220
+    <span v-else></span>
223
   </nav>
221
   </nav>
224
 </template>
222
 </template>
223
+
225
 <script>
224
 <script>
226
-import { mapGetters } from 'vuex';
225
+import { mapGetters, mapActions } from 'vuex';
227
 
226
 
228
 export default {
227
 export default {
229
-  computed: {},
228
+  data() {
229
+    return {};
230
+  },
231
+  computed: {
232
+    showLogout() {
233
+      return this.$store.state.authentication.status === 'success';
234
+    },
235
+    Logout() {
236
+      return this.$store.state.authentication.methods.logout;
237
+    },
238
+  },
230
 
239
 
231
   methods: {
240
   methods: {
232
     ...mapGetters('authentication', ['isLoggedIn']),
241
     ...mapGetters('authentication', ['isLoggedIn']),
242
+    ...mapActions('authentication', ['logout']),
233
 
243
 
234
     routerGoTo(goTo) {
244
     routerGoTo(goTo) {
235
       console.log(goTo);
245
       console.log(goTo);

+ 0
- 1
src/components/user/loginPage.vue 查看文件

59
           <p v-if="user !== null">{{ user }}</p>
59
           <p v-if="user !== null">{{ user }}</p>
60
         </div>
60
         </div>
61
       </form>
61
       </form>
62
-
63
       <form id="forgot">
62
       <form id="forgot">
64
         <div class="form">
63
         <div class="form">
65
           <h5>Trouble signing in?</h5>
64
           <h5>Trouble signing in?</h5>

+ 2
- 3
src/store/modules/user/authentication.js 查看文件

6
 export default {
6
 export default {
7
   namespaced: true,
7
   namespaced: true,
8
   state: {
8
   state: {
9
-    status: '123',
9
+    status: '',
10
     token: localStorage.getItem('token') || '',
10
     token: localStorage.getItem('token') || '',
11
     user: {},
11
     user: {},
12
   },
12
   },
28
     },
28
     },
29
   },
29
   },
30
   getters: {
30
   getters: {
31
-    isLoggenIn: state => !!state.token,
31
+    isLoggedIn: state => !!state.token,
32
     authStatus: state => state.status,
32
     authStatus: state => state.status,
33
   },
33
   },
34
   actions: {
34
   actions: {
59
     }) {
59
     }) {
60
       return new Promise(() => {
60
       return new Promise(() => {
61
         commit('logout');
61
         commit('logout');
62
-        console.log('What');
63
         localStorage.removeItem('token');
62
         localStorage.removeItem('token');
64
         delete axios.defaults.headers.common.Authorization;
63
         delete axios.defaults.headers.common.Authorization;
65
       });
64
       });

Loading…
取消
儲存