refactor:仪表板视图详情背景优化,跟随仪表板背景

This commit is contained in:
wangjiahao 2021-10-18 13:46:43 +08:00
parent df2e1f0800
commit 5acbbc31e5
2 changed files with 42 additions and 2 deletions

View File

@ -17,7 +17,6 @@
</el-radio-group>
</div>
<el-tooltip :content="$t('panel.fontSize')">
<i style="float: left;margin-top: 3px;margin-left: 2px;" class="iconfont icon-font_size" />
</el-tooltip>
@ -123,6 +122,17 @@ export default {
tooltip: this.$t('panel.text_align_right'),
label: 'right'
}
],
'v-text': [
'textAlign',
'fontSize',
'fontWeight',
'letterSpacing',
'opacity',
'borderRadius',
'color',
'backgroundColor',
'hyperlinks'
] }
},
watch: {
@ -140,6 +150,9 @@ export default {
// console.log('mainWidthOffset:' + this.mainWidthOffset)
},
computed: {
attrShow(attr) {
return style
},
letterDivColor() {
const style = {
height: '2px',

View File

@ -1,6 +1,6 @@
<template>
<de-container>
<de-aside-container v-if="!chart.type.includes('table')">
<de-aside-container v-if="!chart.type.includes('table')" :style="customStyle">
<chart-component v-if="!chart.type.includes('text')" class="chart-class" :chart="chart" />
<label-normal v-if="chart.type.includes('text')" :chart="chart" class="table-class" />
</de-aside-container>
@ -19,6 +19,7 @@ import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer'
import DeAsideContainer from '@/components/dataease/DeAsideContainer'
import { export_json_to_excel } from '@/plugins/Export2Excel'
import { mapState } from 'vuex'
export default {
name: 'UserView',
@ -38,6 +39,32 @@ export default {
refId: null
}
},
computed: {
customStyle() {
let style = {
}
if (this.canvasStyleData.openCommonStyle) {
if (this.canvasStyleData.panel.backgroundType === 'image' && this.canvasStyleData.panel.imageUrl) {
style = {
background: `url(${this.canvasStyleData.panel.imageUrl}) no-repeat`,
...style
}
} else if (this.canvasStyleData.panel.backgroundType === 'color') {
style = {
background: this.canvasStyleData.panel.color,
...style
}
}
}
return style
},
...mapState([
'isClickComponent',
'curComponent',
'componentData',
'canvasStyleData'
])
},
methods: {
exportExcel() {
const excelHeader = JSON.parse(JSON.stringify(this.chart.data.fields)).map(item => item.name)