feat(仪表板): 增加组件内部样式是否自适应仪表板缩放功能 #5793
This commit is contained in:
wangjiahao
parent
630f7704f1
commit
ca51c15eda
@ -264,6 +264,7 @@ import { getPanelAllLinkageInfo, saveLinkage } from '@/api/panel/linkage'
|
||||
import bus from '@/utils/bus'
|
||||
import {queryPanelJumpInfo} from '@/api/panel/linkJump'
|
||||
import {inOtherPlatform} from '@/utils/index'
|
||||
|
||||
export default {
|
||||
name: 'Toolbar',
|
||||
props: {
|
||||
@ -274,6 +275,7 @@ export default {
|
||||
return {
|
||||
showPageLine: false,
|
||||
showGridSwitch: false,
|
||||
autoSizeAdaptorSwitch: true,
|
||||
mobileLayoutInitStatus: false,
|
||||
isShowPreview: false,
|
||||
needToChange: [
|
||||
@ -333,6 +335,7 @@ export default {
|
||||
this.scale = this.canvasStyleData.scale
|
||||
this.mobileLayoutInitStatus = this.mobileLayoutStatus
|
||||
this.showGridSwitch = this.canvasStyleData.aidedDesign.showGrid
|
||||
this.autoSizeAdaptorSwitch = this.canvasStyleData.autoSizeAdaptor || true
|
||||
this.showPageLine = this.canvasStyleData.pdfPageLine?.showPageLine
|
||||
this.autoCache()
|
||||
},
|
||||
@ -623,6 +626,10 @@ export default {
|
||||
this.$store.commit('canvasChange')
|
||||
this.canvasStyleData.aidedDesign.showGrid = !this.canvasStyleData.aidedDesign.showGrid
|
||||
},
|
||||
showSizeAdaptorSwitchChange() {
|
||||
this.$store.commit('canvasChange')
|
||||
this.canvasStyleData.autoSizeAdaptor = !this.canvasStyleData.autoSizeAdaptor
|
||||
},
|
||||
showPageLineChange() {
|
||||
this.$store.commit('canvasChange')
|
||||
this.canvasStyleData.pdfPageLine.showPageLine = !this.canvasStyleData.pdfPageLine.showPageLine
|
||||
|
||||
@ -1004,6 +1004,7 @@ export default {
|
||||
return this.curCanvasScaleMap[this.canvasId]
|
||||
},
|
||||
...mapState([
|
||||
'canvasStyleData',
|
||||
'curComponent',
|
||||
'editor',
|
||||
'linkageSettingStatus',
|
||||
@ -1523,8 +1524,8 @@ export default {
|
||||
})
|
||||
if (this.canvasId === 'canvas-main') {
|
||||
this.$store.commit('setPreviewCanvasScale', {
|
||||
scaleWidth: this.scalePointWidth,
|
||||
scaleHeight: this.scalePointHeight
|
||||
scaleWidth: this.canvasStyleData.autoSizeAdaptor ? this.scalePointWidth : 1,
|
||||
scaleHeight: this.canvasStyleData.autoSizeAdaptor ? this.scalePointHeight : 1
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@ -664,8 +664,8 @@ export default {
|
||||
}
|
||||
if (this.isMainCanvas()) {
|
||||
this.$store.commit('setPreviewCanvasScale', {
|
||||
scaleWidth: (this.scaleWidth / 100),
|
||||
scaleHeight: (this.scaleHeight / 100)
|
||||
scaleWidth: this.canvasStyleData.autoSizeAdaptor ? (this.scaleWidth / 100) : 1,
|
||||
scaleHeight: this.canvasStyleData.autoSizeAdaptor ? (this.scaleHeight / 100) : 1
|
||||
})
|
||||
}
|
||||
this.handleScaleChange()
|
||||
|
||||
@ -86,6 +86,7 @@ export function panelInit(componentData, componentStyle) {
|
||||
|
||||
export function panelDataPrepare(componentData, componentStyle, callback) {
|
||||
// style初始化
|
||||
componentStyle.autoSizeAdaptor = (componentStyle.autoSizeAdaptor || true)
|
||||
componentStyle.refreshTime = (componentStyle.refreshTime || 5)
|
||||
componentStyle.refreshViewLoading = (componentStyle.refreshViewLoading || false)
|
||||
componentStyle.refreshUnit = (componentStyle.refreshUnit || 'minute')
|
||||
|
||||
1
core/frontend/src/icons/svg/icon_auto-adaptor.svg
Normal file
1
core/frontend/src/icons/svg/icon_auto-adaptor.svg
Normal file
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1698901715032" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4099" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M960.605 932.345v-240.231c0.045-7.2-2.723-14.445-8.213-19.98-11.115-11.047-29.002-11.047-40.071 0-5.535 5.535-8.303 12.757-8.303 19.98v171.923l-351.99-352.035 351.99-352.013v171.855c0 7.245 2.767 14.49 8.303 20.002 11.070 11.070 28.957 11.070 40.071 0 5.49-5.511 8.257-12.78 8.213-20.002v-240.187c0.045-7.223-2.723-14.468-8.213-20.003-5.58-5.511-12.803-8.279-20.025-8.302h-240.233c-7.222 0-14.467 2.79-19.98 8.302-11.115 11.049-11.115 28.957 0 40.050 5.511 5.535 12.735 8.302 19.98 8.279h171.9l-352.013 352.013-352.012-352.035h171.855c7.268 0.022 14.49-2.745 20.025-8.279 11.070-11.047 11.070-29.002 0-40.050-5.49-5.511-12.758-8.279-20.025-8.303h-240.187c-7.268 0-14.513 2.79-20.025 8.303-5.513 5.558-8.279 12.803-8.279 20.048v240.165c0 7.245 2.79 14.512 8.279 20.002 11.070 11.070 28.98 11.070 40.028 0 5.513-5.511 8.279-12.713 8.279-20.002v-171.855l352.058 352.012-352.035 352.035v-171.922c0-7.2-2.745-14.445-8.279-19.98-11.070-11.047-29.002-11.047-40.028 0-5.558 5.535-8.279 12.757-8.279 19.98v240.231c0 7.223 2.79 14.468 8.279 20.048 5.535 5.468 12.757 8.279 20.025 8.279h240.188c7.268 0 14.49-2.745 20.025-8.279 11.070-11.047 11.070-29.002 0-40.050-5.535-5.535-12.78-8.257-20.025-8.257h-171.877l352.012-352.035 352.013 352.035h-171.9c-7.222 0-14.467 2.768-19.98 8.257-11.115 11.049-11.115 29.002 0 40.050 5.511 5.468 12.735 8.279 19.98 8.279h240.255c7.2 0 14.445-2.813 20.025-8.279 5.467-5.602 8.19-12.825 8.19-20.048z" p-id="4100" fill="#646A73"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
@ -2313,6 +2313,7 @@ export default {
|
||||
suspension: 'suspension',
|
||||
new_element_distribution: 'Element Distribution',
|
||||
aided_grid: 'Aided Grid',
|
||||
auto_size_adaptor: 'Component Adaptor',
|
||||
aided_grid_open: 'Open',
|
||||
aided_grid_close: 'Close',
|
||||
export_pdf_page: 'Pagination Line',
|
||||
|
||||
@ -2307,6 +2307,7 @@ export default {
|
||||
suspension: '懸浮',
|
||||
new_element_distribution: '元素移入分佈方式',
|
||||
aided_grid: '輔助設計網格',
|
||||
auto_size_adaptor: '組件自適應',
|
||||
aided_grid_open: '打開',
|
||||
aided_grid_close: '關閉',
|
||||
export_pdf_page: '分頁線',
|
||||
|
||||
@ -2307,6 +2307,7 @@ export default {
|
||||
suspension: '悬浮',
|
||||
new_element_distribution: '元素移入分布方式',
|
||||
aided_grid: '辅助设计网格',
|
||||
auto_size_adaptor: '组件自适应',
|
||||
aided_grid_open: '打开',
|
||||
aided_grid_close: '关闭',
|
||||
export_pdf_page: '分页线',
|
||||
|
||||
@ -75,6 +75,7 @@ export const CANVAS_STYLE = {
|
||||
showPageLine: false,
|
||||
proportion: null
|
||||
},
|
||||
autoSizeAdaptor: true, // 组件内容大小自适应(自适应时会根据画布缩放比例对内容进行缩放，关闭则显示内部文本实际大小)
|
||||
refreshViewEnable: false, // 开启视图刷新（默认关闭）
|
||||
refreshViewLoading: true, // 仪表板视图loading提示
|
||||
refreshUnit: 'minute', // 仪表板刷新时间带外 默认 分钟
|
||||
|
||||
Loading…
Reference in New Issue
Block a user