fix(仪表板): 修复部分仪表板的预览界面如全屏预览,复用预览含有tab组件时,tab内部视图出现错位重叠问题

This commit is contained in:
wangjiahao 2022-11-01 15:41:32 +08:00
parent cf63eb66b1
commit ed13b5bcba
5 changed files with 29 additions and 11 deletions

View File

@ -6,7 +6,7 @@
> >
<Preview <Preview
v-if="!dataLoading" v-if="!dataLoading"
:component-data="componentData" :component-data="mainCanvasComponentData"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:back-screen-shot="backScreenShot" :back-screen-shot="backScreenShot"
:panel-info="panelInfo" :panel-info="panelInfo"
@ -22,11 +22,13 @@ import { queryTargetPanelJumpInfo } from '@/api/panel/linkJump'
import { proxyInitPanelData } from '@/api/panel/shareProxy' import { proxyInitPanelData } from '@/api/panel/shareProxy'
import { getOuterParamsInfo } from '@/api/panel/outerParams' import { getOuterParamsInfo } from '@/api/panel/outerParams'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import { getNowCanvasComponentData } from '@/components/canvas/utils/utils'
export default { export default {
components: { Preview }, components: { Preview },
data() { data() {
return { return {
canvasId: 'canvas-main',
dataLoading: false, dataLoading: false,
backScreenShot: false, backScreenShot: false,
mainHeight: '100vh!important', mainHeight: '100vh!important',
@ -34,6 +36,9 @@ export default {
} }
}, },
computed: { computed: {
mainCanvasComponentData() {
return getNowCanvasComponentData(this.canvasId)
},
bgStyle() { bgStyle() {
if (this.backScreenShot) { if (this.backScreenShot) {
return { height: this.mainHeight } return { height: this.mainHeight }

View File

@ -7,7 +7,7 @@
> >
<Preview <Preview
v-if="fullscreen" v-if="fullscreen"
:component-data="componentData" :component-data="mainCanvasComponentData"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:panel-info="panelInfo" :panel-info="panelInfo"
:in-screen="!fullscreen" :in-screen="!fullscreen"
@ -21,21 +21,25 @@
import Preview from './Preview' import Preview from './Preview'
import bus from '@/utils/bus' import bus from '@/utils/bus'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import { getNowCanvasComponentData } from '@/components/canvas/utils/utils'
export default { export default {
components: { Preview }, components: { Preview },
data() { data() {
return { return {
canvasId: 'canvas-main',
fullscreen: false fullscreen: false
} }
}, },
computed: { computed: {
mainCanvasComponentData() {
return getNowCanvasComponentData(this.canvasId)
},
panelInfo() { panelInfo() {
return this.$store.state.panel.panelInfo return this.$store.state.panel.panelInfo
}, },
...mapState([ ...mapState([
'canvasStyleData', 'canvasStyleData'
'componentData'
]) ])
}, },
mounted() { mounted() {

View File

@ -2,7 +2,7 @@
<div style="width: 100%;height: 100vh;background-color: #f7f8fa"> <div style="width: 100%;height: 100vh;background-color: #f7f8fa">
<Preview <Preview
v-if="show" v-if="show"
:component-data="componentData" :component-data="mainCanvasComponentData"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:panel-info="panelInfo" :panel-info="panelInfo"
/> />
@ -15,7 +15,7 @@ import { uuid } from 'vue-uuid'
import Preview from '@/components/canvas/components/Editor/Preview' import Preview from '@/components/canvas/components/Editor/Preview'
import { getPanelAllLinkageInfo } from '@/api/panel/linkage' import { getPanelAllLinkageInfo } from '@/api/panel/linkage'
import { queryPanelJumpInfo, queryTargetPanelJumpInfo } from '@/api/panel/linkJump' import { queryPanelJumpInfo, queryTargetPanelJumpInfo } from '@/api/panel/linkJump'
import { panelInit } from '@/components/canvas/utils/utils' import { getNowCanvasComponentData, panelInit } from '@/components/canvas/utils/utils'
import { getOuterParamsInfo } from '@/api/panel/outerParams' import { getOuterParamsInfo } from '@/api/panel/outerParams'
import { mapState } from 'vuex' import { mapState } from 'vuex'
@ -34,14 +34,17 @@ export default {
}, },
data() { data() {
return { return {
canvasId: 'canvas-main',
show: false, show: false,
panelInfo: {} panelInfo: {}
} }
}, },
computed: { computed: {
mainCanvasComponentData() {
return getNowCanvasComponentData(this.canvasId)
},
...mapState([ ...mapState([
'canvasStyleData', 'canvasStyleData'
'componentData'
]) ])
}, },
created() { created() {

View File

@ -16,7 +16,7 @@
<de-main-container> <de-main-container>
<Preview <Preview
v-if="selectedPanel" v-if="selectedPanel"
:component-data="componentData" :component-data="mainCanvasComponentData"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:panel-info="panelInfo" :panel-info="panelInfo"
:show-position="showPosition" :show-position="showPosition"
@ -41,7 +41,7 @@ import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer' import DeContainer from '@/components/dataease/DeContainer'
import DeAsideContainer from '@/components/dataease/DeAsideContainer' import DeAsideContainer from '@/components/dataease/DeAsideContainer'
import { findOne } from '@/api/panel/panel' import { findOne } from '@/api/panel/panel'
import { deepCopy, panelDataPrepare } from '@/components/canvas/utils/utils' import { deepCopy, getNowCanvasComponentData, panelDataPrepare } from '@/components/canvas/utils/utils'
import Preview from '@/components/canvas/components/Editor/Preview' import Preview from '@/components/canvas/components/Editor/Preview'
import MultiplexingView from '@/views/panel/ViewSelect/multiplexingView' import MultiplexingView from '@/views/panel/ViewSelect/multiplexingView'
import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel' import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel'
@ -59,6 +59,7 @@ export default {
}, },
data() { data() {
return { return {
canvasId: 'canvas-main',
showPosition: 'multiplexing', showPosition: 'multiplexing',
activeName: 'PanelList', activeName: 'PanelList',
viewLoading: false, viewLoading: false,
@ -72,6 +73,11 @@ export default {
panelInfo: {} panelInfo: {}
} }
}, },
computed: {
mainCanvasComponentData() {
return getNowCanvasComponentData(this.canvasId)
}
},
watch: { watch: {
}, },

View File

@ -362,7 +362,7 @@
:panel-info="panelInfo" :panel-info="panelInfo"
:show-type="canvasStyleData.selfAdaption?'full':'width'" :show-type="canvasStyleData.selfAdaption?'full':'width'"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:component-data="componentData" :component-data="mainCanvasComponentData"
show-position="edit" show-position="edit"
/> />
</fullscreen> </fullscreen>