1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
| <template>
| <div>
| <el-drawer size="250px" title="系统设置" :visible.sync="show" direction="rtl" :before-close="handleClose">
| <div class="drawer-container">
| <div class="drawer-item">
| <span>开启 Tags-Views</span>
| <el-switch v-model="tagsView" class="drawer-switch" />
| </div>
|
| </div>
| </el-drawer>
| </div>
| </template>
|
| <script>
| export default {
| props: {
| show: {
| type: Boolean,
| default: false
| },
| },
| computed: {
| tagsView: {
| get() {
| return this.$store.getters.tagsView
| },
| set(val) {
| this.$store.dispatch('changeSetting', {
| key: 'tagsView',
| value: val
| })
| }
| },
| },
| methods: {
| handleClose(){
| this.$emit('update:show', false)
| },
| saveSetting() {
| const loading = this.$loading({
| lock: true,
| fullscreen: false,
| text: "正在保存到本地,请稍后...",
| spinner: "el-icon-loading",
| background: "rgba(0, 0, 0, 0.7)"
| });
| localStorage.setItem(
| "layout-setting",
| `{
| "tagsView":${this.tagsView},
| }`
| );
| setTimeout(loading.close(), 1000)
| },
| resetSetting() {
| this.$loading({
| lock: true,
| fullscreen: false,
| text: "正在清除设置缓存并刷新,请稍后...",
| spinner: "el-icon-loading",
| background: "rgba(0, 0, 0, 0.7)"
| });
| localStorage.removeItem("layout-setting")
| setTimeout("window.location.reload()", 1000)
| }
| },
| }
| </script>
|
| <style lang="scss" scoped>
| .drawer-container {
| padding: 0 24px;
| font-size: 14px;
| line-height: 1.5;
| word-wrap: break-word;
|
| .drawer-title {
| margin-bottom: 12px;
| color: rgba(0, 0, 0, .85);
| font-size: 14px;
| line-height: 22px;
| }
|
| .drawer-item {
| color: rgba(0, 0, 0, .65);
| font-size: 14px;
| }
|
| .drawer-switch {
| float: right
| }
| }
| </style>
|
|