99e602a2fc
Former-commit-id: a40d521a5e6b4bacc1104087236eba111745b341 [formerly a40d521a5e6b4bacc1104087236eba111745b341 [formerly a40d521a5e6b4bacc1104087236eba111745b341 [formerly a40d521a5e6b4bacc1104087236eba111745b341 [formerly d54b29deaefca00f1d9104927aa2338f97a2c2e3 [formerly d8035dd97c5e4861c04bba643b4e2cd63fb1c6a1]]]]] Former-commit-id: 256e15767e7c232c0a8c95ab2136d3a098e8c73b Former-commit-id: 3d9a70257b2cc65985e6caafbf11f4dfc722b60c Former-commit-id: 145bf9c7be9808aa4c01b9ce539da08cf6e5eae1 [formerly 2a28ebf86e795e7184ccb7c7572b26e01c6020ef] Former-commit-id: 451ed69e42b9896a2ea02b438e69864febc12d2b Former-commit-id: 3352c1c1d0edc2ce0134661e91b773090c387153 Former-commit-id: 6f36f0e3f8ec3f626f11a62ab4ee7b0df09a7649 Former-commit-id: e7675d80e742f817df2e93919c23d9e3d80750a8 Former-commit-id: 217b9e30d0b308cfaf8cb343df8949d28a1e389b
69 lines
2.0 KiB
Vue
69 lines
2.0 KiB
Vue
<template>
|
|
<el-dropdown placement="bottom" size="small" @command="handleChange">
|
|
<el-button class="d2-mr btn-text can-hover" type="text">
|
|
<d2-icon name="font" style="font-size: 16px;"/>
|
|
</el-button>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item command="default">
|
|
<d2-icon :name="iconName('default')" class="d2-mr-5"/>默认
|
|
</el-dropdown-item>
|
|
<el-dropdown-item command="medium">
|
|
<d2-icon :name="iconName('medium')" class="d2-mr-5"/>中
|
|
</el-dropdown-item>
|
|
<el-dropdown-item command="small">
|
|
<d2-icon :name="iconName('small')" class="d2-mr-5"/>小
|
|
</el-dropdown-item>
|
|
<el-dropdown-item command="mini">
|
|
<d2-icon :name="iconName('mini')" class="d2-mr-5"/>最小
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState, mapMutations, mapActions } from 'vuex'
|
|
export default {
|
|
name: 'd2-header-size',
|
|
computed: {
|
|
...mapState('d2admin/size', [
|
|
'value'
|
|
])
|
|
},
|
|
watch: {
|
|
// 注意 这里是关键
|
|
// 因为需要访问 this.$ELEMENT 所以只能在这里使用这种方式
|
|
value: {
|
|
handler (val, oldVal) {
|
|
// https://github.com/d2-projects/d2-admin/pull/129
|
|
if (oldVal) {
|
|
// 这个情况在已经加载完页面 用户改变了尺寸时触发
|
|
this.$ELEMENT.size = val
|
|
// 由于已经加载过设置 需要清空缓存设置
|
|
this.pageKeepAliveClean()
|
|
// 由于已经加载过设置 需要刷新此页面
|
|
this.$router.replace('/refresh')
|
|
} else {
|
|
// 这个情况在刷新页面时触发
|
|
this.$ELEMENT.size = val
|
|
}
|
|
},
|
|
immediate: true
|
|
}
|
|
},
|
|
methods: {
|
|
...mapMutations({
|
|
pageKeepAliveClean: 'd2admin/page/keepAliveClean'
|
|
}),
|
|
...mapActions({
|
|
sizeSet: 'd2admin/size/set'
|
|
}),
|
|
handleChange (value) {
|
|
this.sizeSet(value)
|
|
},
|
|
iconName (name) {
|
|
return name === this.value ? 'dot-circle-o' : 'circle-o'
|
|
}
|
|
}
|
|
}
|
|
</script>
|