Merge pull request #4797 from dataease/pr@dev@fix_bar_label_content

fix(视图-分组堆叠柱状图): 修复分组堆叠柱状图标签内容只能单选

frontend/src/views/chart/chart/bar/bar_antv.js

@@ -114,7 +114,7 @@ export function baseBarOptionAntV(plot, container, chart, action, isGroup, isSta
   if (chart.senior) {
     let emptyDataStrategy = JSON.parse(chart.senior)?.functionCfg?.emptyDataStrategy
     if (!emptyDataStrategy) {
-      emptyDataStrategy = 'breakLine'
+      emptyDataStrategy = 'ignoreData'
     }
     handleEmptyDataStrategy(emptyDataStrategy, chart, data, options)
   }

frontend/src/views/chart/chart/util.js

@@ -3554,13 +3554,3 @@ export function resetRgbOpacity(sourceColor, times) {
   }
   return sourceColor
 }
-
-export function getDefaultLabelContent(chart) {
-  if (chart?.type?.includes('pie')) {
-    return ['dimension', 'proportion']
-  }
-  if (chart?.type?.includes('bar')) {
-    return ['quota']
-  }
-  return []
-}

frontend/src/views/chart/components/shapeAttr/LabelSelectorAntV.vue

@@ -317,6 +317,25 @@ export default {
       ]
     }
   },
+  computed: {
+    labelContentOptions() {
+      if (this.chart.type.includes('pie')) {
+        return [
+          { name: this.$t('chart.dimension'), value: 'dimension' },
+          { name: this.$t('chart.quota'), value: 'quota' },
+          { name: this.$t('chart.proportion'), value: 'proportion' }
+        ]
+      }
+      if (this.chart.type.includes('bar')) {
+        return [
+          { name: this.$t('chart.chart_group'), value: 'group' },
+          { name: this.$t('chart.stack_item'), value: 'stack' },
+          { name: this.$t('chart.quota'), value: 'quota' }
+        ]
+      }
+      return []
+    }
+  },
   watch: {
     'chart': {
       handler: function() {
@@ -398,25 +417,6 @@ export default {
     showProperty(property) {
       return this.propertyInner.includes(property)
     }
-  },
-  computed: {
-    labelContentOptions() {
-      if (this.chart.type.includes('pie')) {
-        return [
-          { name: this.$t('chart.dimension'), value: 'dimension' },
-          { name: this.$t('chart.quota'), value: 'quota' },
-          { name: this.$t('chart.proportion'), value: 'proportion' }
-        ]
-      }
-      if (this.chart.type.includes('bar')) {
-        return [
-          { name: this.$t('chart.chart_group'), value: 'group' },
-          { name: this.$t('chart.stack_item'), value: 'stack' },
-          { name: this.$t('chart.quota'), value: 'quota' }
-        ]
-      }
-      return []
-    }
   }
 }
 </script>

frontend/src/views/chart/group/Group.vue

@@ -513,7 +513,6 @@ import {
 } from '../chart/chart'
 import { checkViewTitle } from '@/components/canvas/utils/utils'
 import { adaptCurTheme } from '@/components/canvas/utils/style'
-import { getDefaultLabelContent } from '@/views/chart/chart/util'
 
 export default {
   name: 'Group',
@@ -1045,6 +1044,11 @@ export default {
     setChartDefaultOptions(view) {
       const type = view.type
       const attr = JSON.parse(view.customAttr)
+      if (view.render === 'echarts') {
+        attr.label.position = 'inside'
+      } else {
+        attr.label.position = 'middle'
+      }
       if (type.includes('pie')) {
         if (view.render === 'echarts') {
           attr.label.position = 'inside'
@@ -1061,21 +1065,13 @@ export default {
         if (type === 'pie-donut-rose') {
           attr.size.pieInnerRadius = Math.round(attr.size.pieOuterRadius * 0.5)
         }
-        attr.label.labelContent = getDefaultLabelContent(view)
+      } else if (type.includes('bar')) {
+        attr.label.labelContent = ['quota']
+        const senior = JSON.parse(view.senior)
+        senior.functionCfg.emptyDataStrategy = 'ignoreData'
+        view.senior = JSON.stringify(senior)
       } else if (type.includes('line')) {
         attr.label.position = 'top'
-      } else if (type.includes('treemap')) {
-        if (view.render === 'echarts') {
-          attr.label.position = 'inside'
-        } else {
-          attr.label.position = 'middle'
-        }
-      } else {
-        if (view.render === 'echarts') {
-          attr.label.position = 'inside'
-        } else {
-          attr.label.position = 'middle'
-        }
       }
       view.customAttr = JSON.stringify(attr)
     },

frontend/src/views/chart/view/ChartEdit.vue

@@ -1748,7 +1748,6 @@ import CalcChartFieldEdit from '@/views/chart/view/CalcChartFieldEdit'
 import { equalsAny } from '@/utils/StringUtils'
 import PositionAdjust from '@/views/chart/view/PositionAdjust'
 import MarkMapDataEditor from '@/views/chart/components/map/MarkMapDataEditor'
-import { getDefaultLabelContent } from '@/views/chart/chart/util'
 
 export default {
   name: 'ChartEdit',
@@ -3282,6 +3281,11 @@ export default {
       const type = this.view.type
       const customAttr = this.view.customAttr
       const customStyle = this.view.customStyle
+      if (this.view.render === 'echarts') {
+        this.view.customAttr.label.position = 'inside'
+      } else {
+        this.view.customAttr.label.position = 'middle'
+      }
       if (type.includes('pie')) {
         if (this.view.render === 'echarts') {
           customAttr.label.position = 'inside'
@@ -3299,22 +3303,12 @@ export default {
         if (equalsAny(type, 'pie', 'pie-rose')) {
           customAttr.size.pieInnerRadius = 0
         }
+      } else if (type.includes('bar')) {
+        this.view.customAttr.label.labelContent = ['quota']
+        this.view.senior.functionCfg.emptyDataStrategy = 'ignoreData'
       } else if (type.includes('line')) {
         this.view.customAttr.label.position = 'top'
-      } else if (type.includes('treemap')) {
-        if (this.view.render === 'echarts') {
-          this.view.customAttr.label.position = 'inside'
-        } else {
-          this.view.customAttr.label.position = 'middle'
-        }
-      } else {
-        if (this.view.render === 'echarts') {
-          this.view.customAttr.label.position = 'inside'
-        } else {
-          this.view.customAttr.label.position = 'middle'
-        }
       }
-      customAttr.label.labelContent = getDefaultLabelContent(this.view)
       // reset custom colors
       this.view.customAttr.color.seriesColors = []
     },