47 lines
1.3 KiB
Vue
47 lines
1.3 KiB
Vue
<template>
|
|
<div>
|
|
<el-select style="width:120px" size="small"
|
|
v-model="themeType"
|
|
:placeholder="
|
|
$t('message.lifter.pleaseSelect')
|
|
" @change="changeTheme"
|
|
>
|
|
<el-option
|
|
v-for="(item, index) in themeArr"
|
|
:key="index"
|
|
:label="'主题：'+item.name"
|
|
:value="item.type"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data(){
|
|
return{
|
|
themeArr:[
|
|
{name:'白色',type:'white'},
|
|
{name:'深色',type:'grey'}
|
|
],
|
|
themeType:'white'
|
|
}
|
|
},
|
|
mounted(){
|
|
this.themeType = this.$store.state.themeType
|
|
},
|
|
methods:{
|
|
changeTheme(){
|
|
console.log(this.themeType)
|
|
document.getElementsByTagName('html')[0].className = 'theme-'+this.themeType;
|
|
|
|
this.$store.commit('setThemeType', this.themeType)
|
|
if(this.themeType=='white'){
|
|
this.$store.commit('setChartOptions', {labelColor:'rgba(38, 45, 72, 0.8)'})
|
|
}else{
|
|
this.$store.commit('setChartOptions', {labelColor:'rgba(255, 255, 255, 0.8)'})
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script> |