diff --git a/data-room-ui/packages/BigScreenDesign/OverallSetting/BgImgDialog.vue b/data-room-ui/packages/BigScreenDesign/OverallSetting/BgImgDialog.vue index 8c52919f..4f69a5b7 100644 --- a/data-room-ui/packages/BigScreenDesign/OverallSetting/BgImgDialog.vue +++ b/data-room-ui/packages/BigScreenDesign/OverallSetting/BgImgDialog.vue @@ -82,6 +82,8 @@ @@ -75,6 +92,23 @@ export default { .el-icon-right{ width: 40px; text-align: center; + cursor: pointer; + + } + .el-icon-bottom{ + width: 40px; + text-align: center; + cursor: pointer; + } + .el-icon-back{ + width: 40px; + text-align: center; + cursor: pointer; + } + .el-icon-top { + width: 40px; + text-align: center; + cursor: pointer; } } diff --git a/data-room-ui/packages/BigScreenRun/index.vue b/data-room-ui/packages/BigScreenRun/index.vue index 34afd522..4c601fd1 100644 --- a/data-room-ui/packages/BigScreenRun/index.vue +++ b/data-room-ui/packages/BigScreenRun/index.vue @@ -42,6 +42,7 @@ import { compile } from 'tiny-sass-compiler/dist/tiny-sass-compiler.esm-browser. import NotPermission from 'data-room-ui/NotPermission' import Configuration from 'data-room-ui/Render/Configuration.vue' import DataViewDialog from 'data-room-ui/BigScreenDesign/DataViewDialog/index.vue' +import { getFileUrl } from 'data-room-ui/js/utils/file' export default { name: 'BigScreenRun', components: { @@ -99,7 +100,7 @@ export default { const bg = this.fitMode !== 'none' ? { backgroundColor: this.fitPageConfig.customTheme === 'light' ? this.fitPageConfig.lightBgColor : this.fitPageConfig.bgColor, - backgroundImage: this.fitPageConfig.customTheme === 'light' ? `url(${this.fitPageConfig.lightBg})` : `url(${this.fitPageConfig.bg})`, + backgroundImage: this.fitPageConfig.customTheme === 'light' ? `url(${this.getCoverPicture(this.fitPageConfig.lightBg)})` : `url(${this.getCoverPicture(this.fitPageConfig.bg)})`, backgroundSize: 'cover' } : {} @@ -121,7 +122,7 @@ export default { const bg = this.fitMode === 'none' ? { backgroundColor: this.fitPageConfig.customTheme === 'light' ? this.fitPageConfig.lightBgColor : this.fitPageConfig.bgColor, - backgroundImage: this.fitPageConfig.customTheme === 'light' ? `url(${this.fitPageConfig.lightBg})` : `url(${this.fitPageConfig.bg})`, + backgroundImage: this.fitPageConfig.customTheme === 'light' ? `url(${this.getCoverPicture(this.fitPageConfig.lightBg)})` : `url(${this.getCoverPicture(this.fitPageConfig.bg)})`, backgroundSize: 'cover' } : {} @@ -378,6 +379,14 @@ export default { } return newPageConfig + }, + /** + * 获取图片访问地址,如果是相对路径则拼接上文件访问前缀地址 + * @param url + * @returns {*} + */ + getCoverPicture (url) { + return getFileUrl(url) } } } diff --git a/data-room-ui/packages/Render/index.vue b/data-room-ui/packages/Render/index.vue index b3f72f7f..00a78250 100644 --- a/data-room-ui/packages/Render/index.vue +++ b/data-room-ui/packages/Render/index.vue @@ -7,7 +7,7 @@ width: pageInfo.pageConfig.w + 'px', height: pageInfo.pageConfig.h + 'px', backgroundColor:pageInfo.pageConfig.customTheme ==='light' ? pageInfo.pageConfig.lightBgColor:pageInfo.pageConfig.bgColor , - backgroundImage:pageInfo.pageConfig.customTheme ==='light' ? `url(${pageInfo.pageConfig.lightBg})`:`url(${pageInfo.pageConfig.bg})` + backgroundImage:pageInfo.pageConfig.customTheme ==='light' ? `url(${this.getCoverPicture(pageInfo.pageConfig.lightBg)})`:`url(${this.getCoverPicture(pageInfo.pageConfig.bg)})` }" @drop="drop($event)" @dragover.prevent @@ -92,6 +92,7 @@ import { randomString } from '../js/utils' import { compile } from 'tiny-sass-compiler/dist/tiny-sass-compiler.esm-browser.prod.js' import plotList, { getCustomPlots } from '../G2Plots/plotList' import { settingToTheme } from 'data-room-ui/js/utils/themeFormatting' +import { getFileUrl } from 'data-room-ui/js/utils/file' export default { name: 'BigScreenRender', @@ -455,6 +456,14 @@ export default { }) }) } + }, + /** + * 获取图片访问地址,如果是相对路径则拼接上文件访问前缀地址 + * @param url + * @returns {*} + */ + getCoverPicture (url) { + return getFileUrl(url) } } } diff --git a/data-room-ui/packages/js/store/actions.js b/data-room-ui/packages/js/store/actions.js index f2df60f8..b3b5e70e 100644 --- a/data-room-ui/packages/js/store/actions.js +++ b/data-room-ui/packages/js/store/actions.js @@ -17,32 +17,41 @@ export default { // 配置兼容 const pageInfo = handleResData(data) // 兼容边框配置 - pageInfo.chartList.forEach((item) => { - if (item.dataSource) { - item.dataSource.source = item.dataSource?.source || 'dataset' + pageInfo.chartList.forEach((chart) => { + if (chart.dataSource) { + chart.dataSource.source = chart.dataSource?.source || 'dataset' } - if (!item.border) { - item.border = { type: '', titleHeight: 60, fontSize: 16, isTitle: true, padding: [0, 0, 0, 0] } + if (!chart.border) { + chart.border = { type: '', titleHeight: 60, fontSize: 16, isTitle: true, padding: [0, 0, 0, 0] } } - if (!item.border.padding) { - item.border.padding = [0, 0, 0, 0] + if (!chart.border.padding) { + chart.border.padding = [0, 0, 0, 0] } - if (item.type == 'customComponent') { - plotSettings[Symbol.iterator] = function * () { - const keys = Object.keys(plotSettings) - for (const k of keys) { - yield [k, plotSettings[k]] + let plotSettingsIterator = false + if (chart.type == 'customComponent') { + // 为本地G2组件配置添加迭代器 + if (!plotSettingsIterator) { + plotSettings[Symbol.iterator] = function * () { + const keys = Object.keys(plotSettings) + for (const k of keys) { + yield [k, plotSettings[k]] + } } } - for (const [key, value] of plotSettings) { - if (item.name == value.name) { - const settings = JSON.parse(JSON.stringify(value.setting)) - item.setting = settings.map((x) => { - const index = item.setting.findIndex(y => y.field == x.field) - x.field = item.setting[index].field - x.value = item.setting[index].value - return x + for (const [key, localPlotSetting] of plotSettings) { + if (chart.name == localPlotSetting.name) { + // 本地配置项 + const localSettings = JSON.parse(JSON.stringify(localPlotSetting.setting)) + chart.setting = localSettings.map((localSet) => { + // 在远程组件配置中找到 与 本地组件的配置项 相同的项索引 + const index = chart.setting.findIndex(remoteSet => remoteSet.field == localSet.field) + if (index !== -1) { + // 使用远程的值替换本地值 + localSet.field = chart.setting[index].field + localSet.value = chart.setting[index].value + } + return localSet }) } }