You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
108 lines
2.3 KiB
108 lines
2.3 KiB
<template> |
|
<div class="drawer-container"> |
|
<div> |
|
<h3 class="drawer-title">系统布局配置</h3> |
|
|
|
<div class="drawer-item"> |
|
<span>主题颜色</span> |
|
<theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" /> |
|
</div> |
|
|
|
<div class="drawer-item"> |
|
<span>开启 Tags-Views</span> |
|
<el-switch v-model="tagsView" class="drawer-switch" /> |
|
</div> |
|
|
|
<div class="drawer-item"> |
|
<span>固定 Header</span> |
|
<el-switch v-model="fixedHeader" class="drawer-switch" /> |
|
</div> |
|
|
|
<div class="drawer-item"> |
|
<span>显示 Logo</span> |
|
<el-switch v-model="sidebarLogo" class="drawer-switch" /> |
|
</div> |
|
|
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import ThemePicker from '@/components/ThemePicker' |
|
|
|
export default { |
|
components: { ThemePicker }, |
|
data() { |
|
return {} |
|
}, |
|
computed: { |
|
fixedHeader: { |
|
get() { |
|
return this.$store.state.settings.fixedHeader |
|
}, |
|
set(val) { |
|
this.$store.dispatch('settings/changeSetting', { |
|
key: 'fixedHeader', |
|
value: val |
|
}) |
|
} |
|
}, |
|
tagsView: { |
|
get() { |
|
return this.$store.state.settings.tagsView |
|
}, |
|
set(val) { |
|
this.$store.dispatch('settings/changeSetting', { |
|
key: 'tagsView', |
|
value: val |
|
}) |
|
} |
|
}, |
|
sidebarLogo: { |
|
get() { |
|
return this.$store.state.settings.sidebarLogo |
|
}, |
|
set(val) { |
|
this.$store.dispatch('settings/changeSetting', { |
|
key: 'sidebarLogo', |
|
value: val |
|
}) |
|
} |
|
}, |
|
}, |
|
methods: { |
|
themeChange(val) { |
|
this.$store.dispatch('settings/changeSetting', { |
|
key: 'theme', |
|
value: val |
|
}) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.drawer-container { |
|
padding: 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; |
|
padding: 12px 0; |
|
} |
|
|
|
.drawer-switch { |
|
float: right |
|
} |
|
} |
|
</style>
|
|
|