From 44f8bfec6e53780f30837f72da7d030ab5f4c6bd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E5=98=89=E8=B1=AA?= <42510293+ziyujiahao@users.noreply.github.com> Date: Thu, 7 Aug 2025 10:28:24 +0800 Subject: [PATCH] Pr@dev v2@feat new adaptor (#16631) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(数据大屏): 修复图层名称长度为交易问题 * feat(数据大屏): 增加大屏屏幕适配方式 --- .../src/components/data-visualization/CanvasAttr.vue | 3 ++- .../components/data-visualization/canvas/DePreview.vue | 5 +++++ core/core-frontend/src/locales/en.ts | 1 + core/core-frontend/src/locales/tw.ts | 1 + core/core-frontend/src/locales/zh-CN.ts | 1 + core/core-frontend/src/style/index.less | 8 ++++++++ .../src/views/data-visualization/DvPreview.vue | 2 ++ 7 files changed, 20 insertions(+), 1 deletion(-) diff --git a/core/core-frontend/src/components/data-visualization/CanvasAttr.vue b/core/core-frontend/src/components/data-visualization/CanvasAttr.vue index 009aea455f..02e176e9d5 100644 --- a/core/core-frontend/src/components/data-visualization/CanvasAttr.vue +++ b/core/core-frontend/src/components/data-visualization/CanvasAttr.vue @@ -26,7 +26,8 @@ const screenAdaptorList = [ { label: t('visualization.screen_adaptor_width_first'), value: 'widthFirst' }, { label: t('visualization.screen_adaptor_height_first'), value: 'heightFirst' }, { label: t('visualization.screen_adaptor_full'), value: 'full' }, - { label: t('visualization.screen_adaptor_keep'), value: 'keep' } + { label: t('visualization.screen_adaptor_keep'), value: 'keep' }, + { label: t('visualization.screen_adaptor_keep_proportion'), value: 'keepProportion' } ] const init = () => { nextTick(() => { diff --git a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue index 6952f7eac2..856f2effd7 100644 --- a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue +++ b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue @@ -180,6 +180,11 @@ const canvasStyle = computed(() => { style['height'] = canvasStyleData.value?.height + 'px' style['width'] = canvasStyleData.value?.width + 'px' style['margin'] = 'auto' + } else if (canvasStyleData.value?.screenAdaptor === 'keepProportion') { + style['aspect-ratio'] = canvasStyleData.value?.width / canvasStyleData.value?.height + style['height'] = canvasStyleData.value?.height + 'px' + style['width'] = canvasStyleData.value?.width + 'px' + style['margin'] = 'auto' } else { style['height'] = dashboardActive.value ? downloadStatus.value diff --git a/core/core-frontend/src/locales/en.ts b/core/core-frontend/src/locales/en.ts index b2d0a9b23b..4bd50821f5 100644 --- a/core/core-frontend/src/locales/en.ts +++ b/core/core-frontend/src/locales/en.ts @@ -3131,6 +3131,7 @@ export default { screen_adaptor_width_first: 'Width First', screen_adaptor_height_first: 'Height First', screen_adaptor_full: 'Full Screen', + screen_adaptor_keep_proportion: 'Keep Proportion:', screen_adaptor_keep: 'No Scaling', effective_during_preview: 'Effective during preview', base_config: 'Base Configuration', diff --git a/core/core-frontend/src/locales/tw.ts b/core/core-frontend/src/locales/tw.ts index a8560b9106..00776e833b 100644 --- a/core/core-frontend/src/locales/tw.ts +++ b/core/core-frontend/src/locales/tw.ts @@ -3045,6 +3045,7 @@ export default { screen_adaptor_width_first: '寬度優先', screen_adaptor_height_first: '高度優先', screen_adaptor_full: '鋪滿全屏', + screen_adaptor_keep_proportion: '保持比例填充', screen_adaptor_keep: '不縮放', effective_during_preview: '預覽時生效', base_config: '基礎配置', diff --git a/core/core-frontend/src/locales/zh-CN.ts b/core/core-frontend/src/locales/zh-CN.ts index 0f2251b825..e3fc49d34e 100644 --- a/core/core-frontend/src/locales/zh-CN.ts +++ b/core/core-frontend/src/locales/zh-CN.ts @@ -3048,6 +3048,7 @@ export default { external_parameter_settings: '外部参数设置', screen_config: '大屏配置', screen_adaptor: '缩放方式', + screen_adaptor_keep_proportion: '保持比例填充', screen_adaptor_width_first: '宽度优先', screen_adaptor_height_first: '高度优先', screen_adaptor_full: '铺满全屏', diff --git a/core/core-frontend/src/style/index.less b/core/core-frontend/src/style/index.less index 34c80a35ea..84282b35e2 100644 --- a/core/core-frontend/src/style/index.less +++ b/core/core-frontend/src/style/index.less @@ -600,6 +600,14 @@ strong { overflow-y: auto; } +.preview-content-inner-keep-proportion { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + .preview-content-inner-height-first { width: auto; height: 100%; diff --git a/core/core-frontend/src/views/data-visualization/DvPreview.vue b/core/core-frontend/src/views/data-visualization/DvPreview.vue index b0c4edabd3..e6066e4852 100644 --- a/core/core-frontend/src/views/data-visualization/DvPreview.vue +++ b/core/core-frontend/src/views/data-visualization/DvPreview.vue @@ -54,6 +54,8 @@ const contentInnerClass = computed(() => { return 'preview-content-inner-full' } else if (props.canvasStylePreview.screenAdaptor === 'keep') { return 'preview-content-inner-size-keep' + } else if (props.canvasStylePreview.screenAdaptor === 'keepProportion') { + return 'preview-content-inner-keep-proportion' } else { return 'preview-content-inner-width-first' }