Merge pull request #9341 from dataease/pr@dev@feat_top_n_label

Pr@dev@feat top n label

core/frontend/src/components/elVisualSelect/index.vue

@@ -19,8 +19,8 @@
     >
       <el-checkbox
         v-model="selectAll"
-        class="is-tree-select"
         v-customStyle="customStyle"
+        class="is-tree-select"
         :indeterminate="isIndeterminate"
         @change="selectAllChange"
       >

core/frontend/src/lang/en.js

@@ -1237,6 +1237,7 @@ export default {
     top_n_desc: 'Merge data into other',
     top_n_input_1: 'Show Top',
     top_n_input_2: ',the rest merged to other',
+    top_n_label: 'Label of the merged',
     area_border_color: 'Map border',
     area_base_color: 'Base map',
     size: 'Size',

core/frontend/src/lang/tw.js

@@ -1238,6 +1238,7 @@ export default {
     top_n_desc: '合併數據',
     top_n_input_1: '顯示 Top',
     top_n_input_2: ', 其餘合併至其他',
+    top_n_label: '其他項標籤',
     area_border_color: '地圖邊線',
     area_base_color: '底圖',
     size: '大小',

core/frontend/src/lang/zh.js

@@ -1234,6 +1234,7 @@ export default {
     top_n_desc: '合并数据',
     top_n_input_1: '显示 Top',
     top_n_input_2: ', 其余合并至其他',
+    top_n_label: '其他项标签',
     area_border_color: '地图边线',
     area_base_color: '底图',
     size: '大小',

core/frontend/src/views/chart/chart/chart.js

@@ -42,7 +42,8 @@ export const DEFAULT_COLOR_CASE = {
   mapLineTargetColor: '#576CBC',
   quotaSuffixColor: '#5470c6',
   calcTopN: false,
-  topN: 5
+  topN: 5,
+  topNLabel: '其他'
 }
 
 export const DEFAULT_COLOR_CASE_DARK = {
@@ -69,7 +70,8 @@ export const DEFAULT_COLOR_CASE_DARK = {
   mapLineTargetColor: '#3795BD',
   quotaSuffixColor: '#5470c6',
   calcTopN: false,
-  topN: 5
+  topN: 5,
+  topNLabel: '其他'
 }
 export const DEFAULT_SIZE = {
   barDefault: true,

core/frontend/src/views/chart/chart/common/common.js

@@ -1,5 +1,10 @@
 import { hexColorToRGBA } from '@/views/chart/chart/util'
-import { DEFAULT_XAXIS_STYLE, DEFAULT_YAXIS_EXT_STYLE, DEFAULT_YAXIS_STYLE } from '@/views/chart/chart/chart'
+import {
+  DEFAULT_COLOR_CASE,
+  DEFAULT_XAXIS_STYLE,
+  DEFAULT_YAXIS_EXT_STYLE,
+  DEFAULT_YAXIS_STYLE
+} from '@/views/chart/chart/chart'
 import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
 import { $success } from '@/utils/message'
 import i18n from '@/lang'
@@ -437,7 +442,7 @@ export const configTopN = (data, chart) => {
   const otherItems = data.splice(color.topN)
   const initOtherItem = {
     ...cloneDeep(data[0]),
-    name: i18n.t('datasource.other'),
+    name: color.topNLabel ?? DEFAULT_COLOR_CASE.topNLabel,
     value: 0
   }
   otherItems.reduce((p, n) => {

core/frontend/src/views/chart/chart/common/common_antv.js

@@ -1,8 +1,12 @@
 import { hexColorToRGBA } from '@/views/chart/chart/util'
 import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
-import { DEFAULT_XAXIS_STYLE, DEFAULT_YAXIS_EXT_STYLE, DEFAULT_YAXIS_STYLE } from '@/views/chart/chart/chart'
+import {
+  DEFAULT_COLOR_CASE,
+  DEFAULT_XAXIS_STYLE,
+  DEFAULT_YAXIS_EXT_STYLE,
+  DEFAULT_YAXIS_STYLE
+} from '@/views/chart/chart/chart'
 import { equalsAny, includesAny } from '@/utils/StringUtils'
-import i18n from '@/lang'
 import {
   regressionExp,
   regressionPoly,
@@ -1279,8 +1283,8 @@ export const configTopN = (data, chart) => {
   const otherItems = data.splice(color.topN)
   const initOtherItem = {
     ...data[0],
-    field: i18n.t('datasource.other'),
-    name: i18n.t('datasource.other'),
+    field: color.topNLabel ?? DEFAULT_COLOR_CASE.topNLabel,
+    name: color.topNLabel ?? DEFAULT_COLOR_CASE.topNLabel,
     value: 0
   }
   otherItems.reduce((p, n) => {

core/frontend/src/views/chart/components/shapeAttr/ColorSelector.vue

@@ -352,6 +352,18 @@
           />
           <span>{{ $t('chart.top_n_input_2') }}</span>
         </el-form-item>
+        <el-form-item
+          v-show="showProperty('topN') && colorForm.calcTopN"
+          class="form-item"
+          :label="$t('chart.top_n_label')"
+        >
+          <el-input
+            v-model="colorForm.topNLabel"
+            size="mini"
+            :maxlength="50"
+            @change="changeColorCase('topNLabel')"
+          />
+        </el-form-item>
         <el-form-item
           v-show="showProperty('mapLineGradient')"
           :label="$t('chart.gradient')"
@@ -639,6 +651,7 @@ export default {
           this.colorForm.mapLineTargetColor = this.colorForm.mapLineTargetColor ? this.colorForm.mapLineTargetColor : DEFAULT_COLOR_CASE.mapLineTargetColor
           this.colorForm.calcTopN = this.colorForm.calcTopN === undefined ? false : this.colorForm.calcTopN
           this.colorForm.topN = this.colorForm.topN ?? DEFAULT_COLOR_CASE.topN
+          this.colorForm.topNLabel = this.colorForm.topNLabel ?? DEFAULT_COLOR_CASE.topNLabel
           this.initCustomColor()
         }
       }

core/frontend/src/views/dataFilling/form/create.vue

@@ -701,7 +701,8 @@ export default {
               ref="mRightForm"
               :model="selectedComponentItem.settings"
               label-position="top"
-              hide-required-asterisk>
+              hide-required-asterisk
+            >
 
               <el-form-item
                 prop="name"

core/frontend/src/views/panel/filter/filterMain/FilterSort.vue

@@ -1,6 +1,6 @@
 <template>
   <div style="display: flex;align-items: center;">
-    <span class="filter-line"></span>
+    <span class="filter-line" />
     <el-dropdown
       trigger="click"
       size="mini"