diff --git a/core/core-frontend/src/utils/canvasUtils.ts b/core/core-frontend/src/utils/canvasUtils.ts index 9aa19c96eb..e85086621a 100644 --- a/core/core-frontend/src/utils/canvasUtils.ts +++ b/core/core-frontend/src/utils/canvasUtils.ts @@ -351,7 +351,7 @@ export async function initCanvasData(dvId, busiFlag, callBack) { ) } -export async function backCanvasData(dvId, busiFlag, callBack) { +export async function backCanvasData(dvId, mobileViewInfo, busiFlag, callBack) { initCanvasDataPrepare( dvId, busiFlag, @@ -361,11 +361,15 @@ export async function backCanvasData(dvId, busiFlag, callBack) { componentData.value.forEach(ele => { ele.inMobile = componentDataId.includes(ele.id) if (ele.inMobile) { - const { mx, my, mSizeX, mSizeY } = componentDataCopy.find(itx => itx.id === ele.id) + const { mx, my, mSizeX, mSizeY, mPropValue, mEvents, mCommonBackground } = + componentDataCopy.find(itx => itx.id === ele.id) ele.mx = mx ele.my = my ele.mSizeX = mSizeX ele.mSizeY = mSizeY + ele.mPropValue = mPropValue + ele.mEvents = mEvents + ele.mCommonBackground = mCommonBackground if (ele.component === 'DeTabs') { ele.propValue.forEach(tabItem => { tabItem.componentData.forEach(tabComponent => { @@ -373,13 +377,23 @@ export async function backCanvasData(dvId, busiFlag, callBack) { tabComponent.my = tabComponent.my tabComponent.mSizeX = tabComponent.mSizeX tabComponent.mSizeY = tabComponent.mSizeY + tabComponent.mPropValue = tPropValue + tabComponent.mEvents = tEvents + tabComponent.mCommonBackground = tCommonBackground }) }) } } }) + Object.keys(mobileViewInfo).forEach(key => { + if (canvasViewInfo.value[key] && mobileViewInfo[key]) { + const { customAttrMobile, customStyleMobile } = mobileViewInfo[key] + // 此处作为还原移动设计使用 + canvasViewInfo.value[key]['customStyleMobile'] = customStyleMobile + canvasViewInfo.value[key]['customAttrMobile'] = customAttrMobile + } + }) dvMainStore.setComponentData(componentData.value) - dvMainStore.setCanvasViewInfo(canvasViewInfoPreview) const canvasStyleDataCopy = cloneDeep(canvasStyleData.value) if (!canvasStyleDataCopy.mobileSetting) { canvasStyleDataCopy.mobileSetting = { diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/ChartStyle.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/ChartStyle.vue index 8941c7be85..abe39b98e2 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/ChartStyle.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/ChartStyle.vue @@ -144,10 +144,6 @@ const eventsShow = computed(() => { ) }) -const pictureGroupShow = computed(() => { - return curComponent.value?.innerType === 'picture-group' -}) - const showProperties = (property: EditorProperty) => properties.value?.includes(property) const onMiscChange = (val, prop) => { diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/TitleSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/TitleSelector.vue index c7da2f2fa0..c4a22b46ee 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/TitleSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/TitleSelector.vue @@ -21,7 +21,7 @@ import { cloneDeep, defaultsDeep } from 'lodash-es' import { ElButton, ElIcon } from 'element-plus-secondary' import Icon from '@/components/icon-custom/src/Icon.vue' const dvMainStore = dvMainStoreWithOut() -const { batchOptStatus } = storeToRefs(dvMainStore) +const { batchOptStatus, mobileInPc } = storeToRefs(dvMainStore) const { t } = useI18n() @@ -131,7 +131,7 @@ watch( :label="t('chart.title')" class="form-item" :class="'form-item-' + themes" - v-if="!batchOptStatus" + v-if="!batchOptStatus && !mobileInPc" > { - + { padding: 0; } } + +.mobile-style { + margin-top: 25px; +} diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/table/TableHeaderSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/table/TableHeaderSelector.vue index b815e5a57f..08f157afab 100644 --- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/table/TableHeaderSelector.vue +++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/table/TableHeaderSelector.vue @@ -10,7 +10,10 @@ import { COLOR_PANEL, DEFAULT_TABLE_HEADER } from '@/views/chart/components/edit import { ElSpace } from 'element-plus-secondary' import { cloneDeep, defaultsDeep } from 'lodash-es' import { convertToAlphaColor, isAlphaColor } from '@/views/chart/components/js/util' - +import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain' +import { storeToRefs } from 'pinia' +const dvMainStore = dvMainStoreWithOut() +const { mobileInPc } = storeToRefs(dvMainStore) const { t } = useI18n() const props = defineProps({ @@ -138,7 +141,7 @@ onMounted(() => { - + { padding: 0; } } +.mobile-style { + margin-top: 25px; +} diff --git a/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue b/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue index cdb68ab348..2321fe8294 100644 --- a/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue +++ b/core/core-frontend/src/views/dashboard/MobileConfigPanel.vue @@ -15,6 +15,7 @@ import { storeToRefs } from 'pinia' import { debounce } from 'lodash-es' import mobileHeader from '@/assets/img/mobile-header.png' import ComponentStyleEditor from '@/views/common/ComponentStyleEditor.vue' +import { deepCopy } from '@/utils/utils' const dvMainStore = dvMainStoreWithOut() const { componentData, canvasStyleData, canvasViewInfo, dvInfo } = storeToRefs(dvMainStore) @@ -59,8 +60,7 @@ const handleLoad = () => { // 移动端初始化话 if (!!mobileViewInfo) { Object.keys(mobileViewInfo).forEach(key => { - const { customAttrMobile, customStyleMobile, customAttr, customStyle } = - canvasViewInfo.value[key] + const { customAttrMobile, customStyleMobile, customAttr, customStyle } = mobileViewInfo[key] mobileViewInfo[key]['customAttr'] = customAttrMobile || customAttr mobileViewInfo[key]['customStyle'] = customStyleMobile || customStyle }) @@ -74,7 +74,7 @@ const handleLoad = () => { JSON.stringify(unref(componentData.value.filter(ele => !!ele.inMobile))) ), canvasStyleData: JSON.parse(JSON.stringify(unref(canvasStyleData))), - canvasViewInfo: mobileViewInfo, + canvasViewInfo: deepCopy(mobileViewInfo), dvInfo: JSON.parse(JSON.stringify(unref(dvInfo))), isEmbedded: !!embeddedStore.baseUrl }) @@ -258,7 +258,7 @@ const handleBack = () => { showClose: false }).then(() => { setTimeout(() => { - backCanvasData(dvInfo.value.id, 'dashboard', () => { + backCanvasData(dvInfo.value.id, canvasViewInfoMobile.value, 'dashboard', () => { changeTimes.value = 0 emits('pcMode') })