Merge pull request #3642 from dataease/pr@dev@fix_batch_operation

Merge branch 'dev' into pr@dev@fix_batch_operation

frontend/src/components/canvas/custom-component/UserView.vue

@@ -553,12 +553,22 @@ export default {
         sourceCustomAttr[param.property][param.value.modifyName] = param.value[param.value.modifyName]
         this.sourceCustomAttrStr = JSON.stringify(sourceCustomAttr)
         this.chart.customAttr = this.sourceCustomAttrStr
+        this.$store.commit('updateComponentViewsData', {
+          viewId: this.chart.id,
+          propertyKey: 'customAttr',
+          propertyValue: this.sourceCustomAttrStr
+        })
         updateParams['customAttr'] = this.sourceCustomAttrStr
       } else if (param.custom === 'customStyle') {
         const sourceCustomStyle = JSON.parse(this.sourceCustomStyleStr)
         sourceCustomStyle[param.property][param.value.modifyName] = param.value[param.value.modifyName]
         this.sourceCustomStyleStr = JSON.stringify(sourceCustomStyle)
         this.chart.customStyle = this.sourceCustomStyleStr
+        this.$store.commit('updateComponentViewsData', {
+          viewId: this.chart.id,
+          propertyKey: 'customStyle',
+          propertyValue: this.sourceCustomStyleStr
+        })
         updateParams['customStyle'] = this.sourceCustomStyleStr
       }
       viewPropsSave(this.panelInfo.id, updateParams).then(rsp => {

frontend/src/store/index.js

@@ -608,10 +608,22 @@ const data = {
         if (element === id) {
           delete state.batchOptViews[id]
           state.curBatchOptComponents.splice(index, 1)
-          this.commit('setBatchOptChartInfo')
           break
         }
       }
+      if (state.curBatchOptComponents.length === 1) {
+        const lastViewId = state.curBatchOptComponents[0]
+        const viewBaseInfo = state.componentViewsData[lastViewId]
+        state.changeProperties.customAttr = JSON.parse(viewBaseInfo.customAttr)
+        state.changeProperties.customStyle = JSON.parse(viewBaseInfo.customStyle)
+      }
+      if (state.curBatchOptComponents.length === 0) {
+        state.changeProperties = {
+          customStyle: {},
+          customAttr: {}
+        }
+      }
+      this.commit('setBatchOptChartInfo')
     },
     addCurBatchComponent(state, id) {
       if (id) {
@@ -621,11 +633,18 @@ const data = {
         // get properties
         const viewConfig = state.allViewRender.filter(item => item.render === viewBaseInfo.render && item.value === viewBaseInfo.type)
         if (viewConfig && viewConfig.length > 0) {
+          if (state.curBatchOptComponents.length === 1) {
+            state.changeProperties.customAttr = JSON.parse(viewBaseInfo.customAttr)
+            state.changeProperties.customStyle = JSON.parse(viewBaseInfo.customStyle)
+          }
           state.batchOptViews[id] = viewConfig[0]
           this.commit('setBatchOptChartInfo')
         }
       }
     },
+    updateComponentViewsData(state, { viewId, propertyKey, propertyValue }) {
+      state.componentViewsData[viewId][propertyKey] = propertyValue
+    },
     removeCurMultiplexingComponentWithId(state, id) {
       delete state.curMultiplexingComponents[id]
     },

frontend/src/views/chart/components/shape-attr/LabelSelectorAntV.vue

@@ -155,7 +155,7 @@
         >
           <el-checkbox
             v-model="labelForm.show"
-            @change="changeLabelAttr"
+            @change="changeLabelAttr('show')"
           >{{ $t('chart.show') }}</el-checkbox>
         </el-form-item>
         <div v-show="labelForm.show">
@@ -167,7 +167,7 @@
               v-model="labelForm.fontSize"
               :placeholder="$t('chart.text_fontsize')"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('fontSize')"
             >
               <el-option
                 v-for="option in fontSize"
@@ -185,7 +185,7 @@
               v-model="labelForm.color"
               class="color-picker-style"
               :predefine="predefineColors"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('color')"
             />
           </el-form-item>
           <el-form-item
@@ -194,7 +194,7 @@
           >
             <el-select
               v-model="labelForm.gaugeLabelFormatter.type"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             >
               <el-option
                 v-for="type in typeList"
@@ -215,7 +215,7 @@
               :min="0"
               :max="10"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
           <el-form-item
@@ -227,7 +227,7 @@
               v-model="labelForm.gaugeLabelFormatter.unit"
               :placeholder="$t('chart.pls_select_field')"
               size="mini"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             >
               <el-option
                 v-for="item in unitList"
@@ -246,7 +246,7 @@
               size="mini"
               clearable
               :placeholder="$t('commons.input_content')"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
           <el-form-item
@@ -255,7 +255,7 @@
           >
             <el-checkbox
               v-model="labelForm.gaugeLabelFormatter.thousandSeparator"
-              @change="changeLabelAttr"
+              @change="changeLabelAttr('gaugeLabelFormatter')"
             />
           </el-form-item>
         </div>