center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

refactor(仪表板): 移动端设计新画布适配

Browse Source
This commit is contained in:
wangjiahao 2022-10-27 16:00:45 +08:00
parent 0b8b542244
commit 1c64abd5d1
4 changed files with 16 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/canvas/components/Editor/ComponentWrapper.vue
View File

@ -195,7 +195,7 @@ export default {
return style return style
}, },
componentActiveFlag() { componentActiveFlag() {
return (this.curComponent && this.config === this.curComponent && !this.previewVisible && !this.showPosition.includes('email-task')) || this.showPosition.includes('multiplexing') return !this.mobileLayoutStatus && ((this.curComponent && this.config === this.curComponent && !this.previewVisible && !this.showPosition.includes('email-task')) || this.showPosition.includes('multiplexing'))
}, },
curGap() { curGap() {
return (this.canvasStyleData.panel.gap === 'yes' && this.config.auxiliaryMatrix) ? this.componentGap : 0 return (this.canvasStyleData.panel.gap === 'yes' && this.config.auxiliaryMatrix) ? this.componentGap : 0

19
frontend/src/components/widget/DeWidget/DeTabs.vue
View File

@ -56,7 +56,7 @@
</el-dropdown> </el-dropdown>
</span> </span>
<de-canvas-tab <de-canvas-tab
v-if="item.content && item.content.type==='canvas' && isEdit" v-if="item.content && item.content.type==='canvas' && isEdit && !mobileLayoutStatus"
:ref="'canvasTabRef-'+item.name" :ref="'canvasTabRef-'+item.name"
:parent-forbid="true" :parent-forbid="true"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
@ -66,9 +66,11 @@
:class="moveActive ? 'canvas_move_in':''" :class="moveActive ? 'canvas_move_in':''"
@canvasScroll="canvasScroll" @canvasScroll="canvasScroll"
/> />
<div style="width: 100%;height:100%"> <div
v-if="item.content && item.content.type==='canvas' && (!isEdit || mobileLayoutStatus)"
style="width: 100%;height:100%"
>
<Preview <Preview
v-if="item.content && item.content.type==='canvas' && !isEdit"
:component-data="tabCanvasComponentData(item.name)" :component-data="tabCanvasComponentData(item.name)"
:canvas-style-data="canvasStyleData" :canvas-style-data="canvasStyleData"
:canvas-id="element.id+'-'+item.name" :canvas-id="element.id+'-'+item.name"
@ -330,7 +332,8 @@ export default {
'mobileLayoutStatus', 'mobileLayoutStatus',
'canvasStyleData', 'canvasStyleData',
'tabMoveInActiveId', 'tabMoveInActiveId',
'curCanvasScaleMap' 'curCanvasScaleMap',
'pcComponentData'
]), ]),
fontColor() { fontColor() {
return this.element && this.element.style && this.element.style.headFontColor || 'none' return this.element && this.element.style && this.element.style.headFontColor || 'none'
@ -416,8 +419,12 @@ export default {
bus.$emit('onScroll') bus.$emit('onScroll')
}, },
tabCanvasComponentData(tabName) { tabCanvasComponentData(tabName) {
const result = getNowCanvasComponentData(this.element.id + '-' + tabName) const tabCanvasId = this.element.id + '-' + tabName
return result if (this.mobileLayoutStatus) {
return this.pcComponentData.filter(item => item.canvasId === tabCanvasId)
} else {
return getNowCanvasComponentData(tabCanvasId)
}
}, },
setContentThemeStyle() { setContentThemeStyle() {
this.element.options.tabList.forEach(tab => { this.element.options.tabList.forEach(tab => {

2
frontend/src/views/panel/edit/ComponentWait.vue
View File

@ -6,7 +6,7 @@
<el-row class="component-wait-main"> <el-row class="component-wait-main">
<el-col <el-col
v-for="(config) in pcComponentData" v-for="(config) in pcComponentData"
v-if="!config.mobileSelected" v-if="!config.mobileSelected && config.canvasId === 'canvas-main'"
:id="'wait' + config.id" :id="'wait' + config.id"
:key="config.id" :key="config.id"
:span="8" :span="8"

1
frontend/src/views/panel/edit/index.vue
View File

@ -1511,6 +1511,7 @@ export default {
color: gray; color: gray;
height: 30px; height: 30px;
width: 100%; width: 100%;
text-align: center;
} }
.this_mobile_canvas_bottom { .this_mobile_canvas_bottom {