Bladeren bron

fix:修复option中无法配置函数类型问题

zhu.yawen 1 jaar geleden
bovenliggende
commit
7fc20ca21b

+ 2 - 1
data-room-ui/packages/BigScreenDesign/LeftPanel.vue

@@ -155,6 +155,7 @@ import decorationComponents from 'data-room-ui/js/config/decorationComponentsCon
 import LayerList from './LayerList/index.vue'
 import { mapMutations } from 'vuex'
 import IconSvg from 'data-room-ui/SvgIcon'
+import { customSerialize } from 'data-room-ui/js/utils/jsonSerialize.js'
 export default {
   name: 'PageLeftPanel',
   components: {
@@ -275,7 +276,7 @@ export default {
             /* 设置拖拽传输数据 */
             event.dataTransfer.setData(
               'dragComponent',
-              JSON.stringify({
+              customSerialize({
                 ...element,
                 offsetX: event.offsetX,
                 offsetY: event.offsetY

+ 8 - 3
data-room-ui/packages/EchartsRender/index.vue

@@ -75,9 +75,11 @@ export default {
     const resizeObserver = new ResizeObserver(entries => {
       if (this.chart) {
         this.chart.resize()
-        let config = this.observeChart(entries)
-        config = this.seriesStyle(config)
-        config.option && this.chart.setOption(config.option)
+        if(this.config.name.includes('3D')){
+          let config = this.observeChart(entries)
+          config = this.seriesStyle(config)
+          config.option && this.chart.setOption(config.option)
+        }
       }
     })
     resizeObserver.observe(dragSelect)
@@ -424,6 +426,9 @@ export default {
     },
     // 对series里面的样式进行配置
     seriesStyle (config) {
+      if(!config.name.includes('3D')){
+        return config
+      }
       const _config = CloneDeep(config)
       const seriesCustom = _config.option.seriesCustom
       const ids = Object.keys(config.option.seriesCustom)

+ 2 - 1
data-room-ui/packages/Render/index.vue

@@ -93,6 +93,7 @@ import { compile } from 'tiny-sass-compiler/dist/tiny-sass-compiler.esm-browser.
 import plotList, { getCustomPlots } from '../G2Plots/plotList'
 import { settingToTheme } from 'data-room-ui/js/utils/themeFormatting'
 import { getFileUrl } from 'data-room-ui/js/utils/file'
+import { customDeserialize } from 'data-room-ui/js/utils/jsonSerialize.js'
 
 export default {
   name: 'BigScreenRender',
@@ -351,7 +352,7 @@ export default {
     // 新增元素
     addChart (chart, position, isComponent) {
       const { left, top } = this.$el.getBoundingClientRect()
-      const _chart = !chart.code ? JSON.parse(chart) : chart
+      const _chart = !chart.code ? customDeserialize(chart) : chart
       let option = _chart.option
       if (_chart.type === 'customComponent') {
         option = {

+ 23 - 0
data-room-ui/packages/js/utils/jsonSerialize.js

@@ -0,0 +1,23 @@
+// 自定义序列化方法:解决JSON.stringify方法忽略函数属性的问题
+export function customSerialize (obj) {
+  // 将对象属性和函数转换为字符串形式
+  const serializedObj = JSON.stringify(obj, function(key, value) {
+    if (typeof value === 'function') {
+      return value.toString() // 将函数转换为字符串
+    }
+    return value // 保持其他属性不变
+  })
+
+  return serializedObj
+}
+// 自定义反序列化方法
+export function customDeserialize(serializedObj){
+  const parsedObject = JSON.parse(serializedObj, function(key, value) {
+    if (typeof value === 'string' && value.indexOf('function') === 0) {
+      // 将字符串还原为函数
+      return new Function('return ' + value)()
+    }
+    return value // 保持其他属性不变
+  })
+  return parsedObject
+}