提交 | 用户 | 时间
|
fd2207
|
1 |
<template> |
懒 |
2 |
<el-dropdown trigger="click" @command="handleSetSize"> |
|
3 |
<div> |
|
4 |
<svg-icon class-name="size-icon" icon-class="size" /> |
|
5 |
</div> |
|
6 |
<el-dropdown-menu slot="dropdown"> |
|
7 |
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value"> |
|
8 |
{{ item.label }} |
|
9 |
</el-dropdown-item> |
|
10 |
</el-dropdown-menu> |
|
11 |
</el-dropdown> |
|
12 |
</template> |
|
13 |
|
|
14 |
<script> |
|
15 |
export default { |
|
16 |
data() { |
|
17 |
return { |
|
18 |
sizeOptions: [ |
|
19 |
{ label: 'Default', value: 'default' }, |
|
20 |
{ label: 'Medium', value: 'medium' }, |
|
21 |
{ label: 'Small', value: 'small' }, |
|
22 |
{ label: 'Mini', value: 'mini' } |
|
23 |
] |
|
24 |
} |
|
25 |
}, |
|
26 |
computed: { |
|
27 |
size() { |
|
28 |
return this.$store.getters.size |
|
29 |
} |
|
30 |
}, |
|
31 |
methods: { |
|
32 |
handleSetSize(size) { |
|
33 |
this.$ELEMENT.size = size |
|
34 |
this.$store.dispatch('app/setSize', size) |
|
35 |
this.refreshView() |
|
36 |
this.$message({ |
|
37 |
message: 'Switch Size Success', |
|
38 |
type: 'success' |
|
39 |
}) |
|
40 |
}, |
|
41 |
refreshView() { |
|
42 |
// In order to make the cached page re-rendered |
|
43 |
this.$store.dispatch('tagsView/delAllCachedViews', this.$route) |
|
44 |
|
|
45 |
const { fullPath } = this.$route |
|
46 |
|
|
47 |
this.$nextTick(() => { |
|
48 |
this.$router.replace({ |
|
49 |
path: '/redirect' + fullPath |
|
50 |
}) |
|
51 |
}) |
|
52 |
} |
|
53 |
} |
|
54 |
|
|
55 |
} |
|
56 |
</script> |