Former-commit-id: bbfa8c1f1912a953f083c43e3dfc66cbb8a94c38 [formerly bbfa8c1f1912a953f083c43e3dfc66cbb8a94c38 [formerly bbfa8c1f1912a953f083c43e3dfc66cbb8a94c38 [formerly bbfa8c1f1912a953f083c43e3dfc66cbb8a94c38 [formerly b0471716a10855a99f9eeec56c5d90466ca78984 [formerly 615abfaf14069173e666265406d43b7c001cbc6b]]]]] Former-commit-id: 218d3d292b96ace88068c5151de0e4db31ec0045 Former-commit-id: 83f58431c1fe8d0e505c1b529971a3532eacec74 Former-commit-id: 9a6dd3e351174e96efc38db9815056aa3e37c68a [formerly d122a952d4566d7c512488ddb419706aa7a5e218] Former-commit-id: d7cee2c9d8f6d46e0218662a8c62589c49f5406f Former-commit-id: 393f897a4b405e4d182f0a1d590634d65aede702 Former-commit-id: 77c05c97905e96a99f1b5ec358b432052e5edd55 Former-commit-id: b7fb5d555038f979df68dd44ea976710a5ae689c Former-commit-id: f572f37e0a9fb37edd68ad3c48266b2eb0d1444c
59 lines
1.5 KiB
Vue
59 lines
1.5 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="">
|
|
<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 } from 'vuex'
|
|
export default {
|
|
name: 'd2-header-size',
|
|
computed: {
|
|
...mapState('d2admin/size', [
|
|
'value'
|
|
])
|
|
},
|
|
watch: {
|
|
// 注意 这里是关键
|
|
// 因为需要访问 this.$ELEMENT 所以只能在这里使用这种方式
|
|
value: {
|
|
handler (val) {
|
|
this.$ELEMENT.size = val
|
|
},
|
|
immediate: true
|
|
}
|
|
},
|
|
methods: {
|
|
...mapMutations('d2admin/size', [
|
|
'set'
|
|
]),
|
|
handleChange (value) {
|
|
this.set(value)
|
|
this.$message({
|
|
message: `设置尺寸成功 ${value}`,
|
|
type: 'success'
|
|
})
|
|
},
|
|
iconName (name) {
|
|
return name === this.value ? 'dot-circle-o' : 'circle-o'
|
|
}
|
|
}
|
|
}
|
|
</script>
|