fix: 修复设计组件时，操作的历史记录回退后，配置面板的数据没有进行同步回退，数据没有及时更新

1 year ago · e94ae099d0
parent d361626483
commit e94ae099d0
10 changed files with 4560 additions and 3086 deletions
--- a/data-room-ui/package-lock.json
+++ b/data-room-ui/package-lock.json
--- a/data-room-ui/package.json
+++ b/data-room-ui/package.json
@ -1,6 +1,6 @@
 {
  "name": "@gcpaas/data-room-ui",
-  "version": "2.0.1-2023111301-Alpha",
+  "version": "2.0.1-2023112901-Alpha",
  "description": "自定义大屏",
  "author": "gcpaas",
  "license": "MIT",
@ -85,7 +85,8 @@
    "vue-video-player": "^5.0.1",
    "vuedraggable": "^2.24.3",
    "vuex": "3.1.0",
-    "ztree": "3.5.24"
+    "node-sass": "4.14.1",
+    "sass-loader": "7.1.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
@ -122,9 +123,7 @@
    "husky": "^4.2.5",
    "jest": "^27.1.0",
    "lint-staged": "^10.2.11",
-    "node-sass": "4.14.1",
    "runjs": "^4.3.2",
-    "sass-loader": "7.1.0",
    "script-ext-html-webpack-plugin": "2.1.3",
    "script-loader": "0.7.2",
    "serve-static": "^1.13.2",
@ -136,7 +135,8 @@
    "vue": "2.6.10",
    "babel-polyfill": "6.26.0",
    "increase-memory-limit": "^1.0.7",
-    "tiny-sass-compiler": "^0.12.2"
+    "tiny-sass-compiler": "^0.12.2",
+    "ztree": "3.5.24"
  },
  "engines": {
    "node": ">=8.9",
--- a/data-room-ui/packages/BasicComponents/Marquee/setting.vue
+++ b/data-room-ui/packages/BasicComponents/Marquee/setting.vue
@ -334,7 +334,7 @@ import RotateSetting from 'data-room-ui/BigScreenDesign/RightSetting/RotateSetti
 import IconSvg from 'data-room-ui/SvgIcon'
 import {predefineColors} from "data-room-ui/js/utils/colorList";
 export default {
-  name: 'TextSetting',
+  name: 'MarqueeSetting',
  components: {
    PosWhSetting,
    ColorPicker,
--- a/data-room-ui/packages/BasicComponents/Numbers/setting.vue
+++ b/data-room-ui/packages/BasicComponents/Numbers/setting.vue
@ -149,7 +149,7 @@ import RotateSetting from 'data-room-ui/BigScreenDesign/RightSetting/RotateSetti
 import fontList from 'data-room-ui/js/utils/fontList'
 import { mapMutations } from 'vuex'
 export default {
-  name: 'TextSetting',
+  name: 'NumberSetting',
  components: {
    TextGradient,
    PosWhSetting,
--- a/data-room-ui/packages/BasicComponents/ThemeSelect/setting.vue
+++ b/data-room-ui/packages/BasicComponents/ThemeSelect/setting.vue
@ -82,7 +82,7 @@ import TextGradient from 'data-room-ui/BigScreenDesign/RightSetting/TextGradient
 import PosWhSetting from 'data-room-ui/BigScreenDesign/RightSetting/PosWhSetting.vue'
 import RotateSetting from 'data-room-ui/BigScreenDesign/RightSetting/RotateSetting.vue'
 export default {
-  name: 'TextSetting',
+  name: 'ThemeSelect',
  components: {
    TextGradient,
    PosWhSetting,
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/MoveDialog/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/MoveDialog/index.vue
@ -237,7 +237,6 @@ export default {
      // if(this.isDown==false){
      //   return
      // }
-      // console.log(e)
      // let ny=e.clientY-194;
      // let nt=ny-(this.y-this.t);
      // a.style.top=nt+"px"
@ -247,7 +246,6 @@ export default {
      // this.y=e.layerY
      // this.t=this.top;
      // this.isDown=true
-      // console.log(this.x,this.l)
    },
    changeSymbol (val) {
      this.symbol = val
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/TextGradient/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/TextGradient/index.vue
@ -40,7 +40,6 @@

 <script>
 // import _ from 'lodash'
-import cloneDeep from 'lodash/cloneDeep'
 export default {
  name: 'TextGradient',
  model: {
@ -50,7 +49,8 @@ export default {
  props: {
    colors: {
      type: String,
-      default: ''
+      default: '',
+      required: true
    },
    label: {
      type: String,
@ -67,14 +67,26 @@ export default {
    }
  },
  computed: {
-    newColors () {
-      return cloneDeep(this.colors)
-    },
+  //   newColors:
+  //     {
+  //       get () {
+  //         return this.colors
+  //       },
+  //       set (val) {
+  //         this.$emit('change', val)
+  //       }
+  //     },
    customLabel () {
      return this.label || '文字'
    }
  },
  watch: {
+    colors: {
+      handler (val) {
+        this.init()
+      },
+      immediate: true
+    },
    position () {
      this.colorChange()
    },
@ -90,7 +102,7 @@ export default {
  },
  methods: {
    init () {
-      const arr = this.newColors.split(',').map(data => data.trim()) || []
+      const arr = this.colors.split(',').map(data => data.trim()) || []
      this.position = arr[0] || 'left'
      const s = arr[1] || '#ffffff'
      const e = arr[2] || '#ffffff'
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue
@ -62,6 +62,7 @@ import { mapState, mapMutations } from 'vuex'
 // import _ from 'lodash'
 import isEqual from 'lodash/isEqual'
 import cloneDeep from 'lodash/cloneDeep'
+import { EventBus } from 'data-room-ui/js/utils/eventBus'
 // 整体动态导入右侧设置组件，不用手动注册
 const components = {}
 for (const key in rightSetting) {
@ -83,7 +84,8 @@ export default {
  },
  data () {
    return {
-      activeName: 'data'
+      activeName: 'data',
+      isOperationRollback: false
    }
  },
  computed: {
@ -145,7 +147,14 @@ export default {
      deep: true
    }
  },
-  mounted () {},
+  mounted () {
+    EventBus.$on('operationRollback', val => {
+      this.isOperationRollback = val
+    })
+  },
+  beforeDestroy () {
+    EventBus.$off('operationRollback')
+  },
  methods: {
    ...mapMutations('bigScreen', [
      'saveTimeLine'
@ -170,7 +179,10 @@ export default {
          } else {
            this.$emit('updateDataSetting', this.config)
          }
+          if (!this.isOperationRollback) {
            this.saveTimeLine(`更新${val?.title ?? this.config.title}组件属性`)
+            this.isOperationRollback = false
+          }
        }
      }
    },
--- a/data-room-ui/packages/PlotRender/index.vue
+++ b/data-room-ui/packages/PlotRender/index.vue
@ -191,7 +191,6 @@ export default {
            return item
          })
          config.option.data = { name: 'root', children: [...listData] }
-          // console.log(config.option.data)
        } else {
          // 如果维度为数字类型则转化为字符串，否则在不增加其他配置的情况下会导致图标最后一项不显示（g2plot官网已说明）
          const xAxis = config.setting.find(item => item.field === 'xField')?.value
--- a/data-room-ui/packages/js/store/mutations.js
+++ b/data-room-ui/packages/js/store/mutations.js
@ -327,6 +327,8 @@ export default {
        currentStore = state.timelineStore[state.currentTimeLine - 1]
        if (currentStore?.chartList) {
          state.pageInfo.chartList = cloneDeep(currentStore?.chartList)
+          state.activeItemConfig = cloneDeep(currentStore?.chartList?.find(item => item.code === state.activeCode) || {})
+          EventBus.$emit('operationRollback', true)
        }
      }
    }
@ -429,7 +431,6 @@ export default {
  }
 }
 function deldataset (state, type, codes) {
-  console.log('del', codes)
  const datasets = state[type]
  for (const code of codes) {
    for (const key in datasets) {