1
- <template >
2
- <div class =" user-wrapper" >
3
- <span class =" action" >
4
- <a-icon type =" question-circle-o" ></a-icon >
5
- </span >
6
- <header-notice class =" action" />
7
- <a-dropdown >
8
- <span class =" action ant-dropdown-link user-dropdown-menu" >
9
- <a-avatar class =" avatar" size =" small" :src =" avatar()" />
10
- <span >{{ nickname() }}</span >
11
- </span >
12
- <a-menu slot =" overlay" class =" user-dropdown-menu-wrapper" >
13
- <a-menu-item key =" 0" >
14
- <router-link :to =" { name: 'center' }" >
15
- <a-icon type =" user" />
16
- <span >个人中心</span >
17
- </router-link >
18
- </a-menu-item >
19
- <a-menu-item key =" 1" >
20
- <router-link :to =" { name: 'settings' }" >
21
- <a-icon type =" setting" />
22
- <span >账户设置</span >
23
- </router-link >
24
- </a-menu-item >
25
- <a-menu-item key =" 2" disabled >
26
- <a-icon type =" setting" />
27
- <span >测试</span >
28
- </a-menu-item >
29
- <a-menu-divider />
30
- <a-menu-item key =" 3" >
31
- <a href =" javascript:;" @click =" handleLogout" >
32
- <a-icon type =" logout" />
33
- <span >退出登录</span >
34
- </a >
35
- </a-menu-item >
36
- </a-menu >
37
- </a-dropdown >
38
- </div >
39
- </template >
40
-
41
- <script >
42
- import HeaderNotice from ' ./HeaderNotice'
43
- import { mapActions , mapGetters } from ' vuex'
44
-
45
- export default {
46
- name: ' UserMenu' ,
47
- components: {
48
- HeaderNotice
49
- },
50
- methods: {
51
- ... mapActions ([' Logout' ]),
52
- ... mapGetters ([' nickname' , ' avatar' ]),
53
- handleLogout () {
54
- const that = this
55
-
56
- this .$confirm ({
57
- title: ' 提示' ,
58
- content: ' 真的要注销登录吗 ?' ,
59
- onOk () {
60
- return that .Logout ({}).then (() => {
61
- window .location .reload ()
62
- }).catch (err => {
63
- that .$message .error ({
64
- title: ' 错误' ,
65
- description: err .message
66
- })
67
- })
68
- },
69
- onCancel () {
70
- },
71
- })
72
- },
73
- }
74
- }
75
- </script >
76
-
77
- <style scoped>
78
-
79
- </style >
1
+ <template >
2
+ <div class =" user-wrapper" >
3
+ <span class =" action" >
4
+ <a-icon type =" question-circle-o" ></a-icon >
5
+ </span >
6
+ <header-notice class =" action" />
7
+ <a-dropdown >
8
+ <span class =" action ant-dropdown-link user-dropdown-menu" >
9
+ <a-avatar class =" avatar" size =" small" :src =" avatar()" />
10
+ <span >{{ nickname() }}</span >
11
+ </span >
12
+ <a-menu slot =" overlay" class =" user-dropdown-menu-wrapper" >
13
+ <a-menu-item key =" 0" >
14
+ <router-link :to =" { name: 'center' }" >
15
+ <a-icon type =" user" />
16
+ <span >个人中心</span >
17
+ </router-link >
18
+ </a-menu-item >
19
+ <a-menu-item key =" 1" >
20
+ <router-link :to =" { name: 'settings' }" >
21
+ <a-icon type =" setting" />
22
+ <span >账户设置</span >
23
+ </router-link >
24
+ </a-menu-item >
25
+ <a-menu-item key =" 2" disabled >
26
+ <a-icon type =" setting" />
27
+ <span >测试</span >
28
+ </a-menu-item >
29
+ <a-menu-divider />
30
+ <a-menu-item key =" 3" >
31
+ <a href =" javascript:;" @click =" handleLogout" >
32
+ <a-icon type =" logout" />
33
+ <span >退出登录</span >
34
+ </a >
35
+ </a-menu-item >
36
+ </a-menu >
37
+ </a-dropdown >
38
+ </div >
39
+ </template >
40
+
41
+ <script >
42
+ import HeaderNotice from ' ./HeaderNotice'
43
+ import { mapActions , mapGetters } from ' vuex'
44
+
45
+ export default {
46
+ name: ' UserMenu' ,
47
+ components: {
48
+ HeaderNotice
49
+ },
50
+ methods: {
51
+ ... mapActions ([' Logout' ]),
52
+ ... mapGetters ([' nickname' , ' avatar' ]),
53
+ handleLogout () {
54
+ const that = this
55
+
56
+ this .$confirm ({
57
+ title: ' 提示' ,
58
+ content: ' 真的要注销登录吗 ?' ,
59
+ onOk () {
60
+ return that .Logout ({}).then (() => {
61
+ window .location .reload ()
62
+ }).catch (err => {
63
+ that .$message .error ({
64
+ title: ' 错误' ,
65
+ description: err .message
66
+ })
67
+ })
68
+ },
69
+ onCancel () {
70
+ },
71
+ })
72
+ },
73
+ }
74
+ }
75
+ </script >
0 commit comments