feat(视图): 子维度支持自定义排序。#5977

core/backend/src/main/java/io/dataease/service/chart/ChartViewService.java

@@ -58,6 +58,7 @@ import io.dataease.service.datasource.DatasourceService;
 import io.dataease.service.engine.EngineService;
 import io.dataease.service.panel.PanelGroupExtendDataService;
 import org.apache.commons.collections4.CollectionUtils;
+import org.apache.commons.collections4.ListUtils;
 import org.apache.commons.lang3.ObjectUtils;
 import org.apache.commons.lang3.StringUtils;
 import org.pentaho.di.core.util.UUIDUtil;
@@ -343,7 +344,9 @@ public class ChartViewService {
         }
         List<ChartViewFieldDTO> xAxis = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
         }.getType());
-        if (StringUtils.equalsIgnoreCase(view.getType(), "table-pivot")) {
+        if (StringUtils.equalsIgnoreCase(view.getType(), "table-pivot")
+                || StringUtils.containsIgnoreCase(view.getType(), "group")
+                || ("antv".equalsIgnoreCase(view.getRender()) && "line".equalsIgnoreCase(view.getType()))) {
             List<ChartViewFieldDTO> xAxisExt = gson.fromJson(view.getXAxisExt(), new TypeToken<List<ChartViewFieldDTO>>() {
             }.getType());
             xAxis.addAll(xAxisExt);
@@ -384,10 +387,10 @@ public class ChartViewService {
         //将没有权限的列删掉
         List<String> dataeaseNames = columnPermissionFields.stream().map(DatasetTableField::getDataeaseName).collect(Collectors.toList());
         dataeaseNames.add("*");
-        fieldCustomFilter = fieldCustomFilter.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
-        extStack = extStack.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
-        extBubble = extBubble.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
-        drill = drill.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+        fieldCustomFilter = fieldCustomFilter.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+        extStack = extStack.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+        extBubble = extBubble.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+        drill = drill.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
 
 
         //行权限
@@ -403,7 +406,7 @@ public class ChartViewService {
 
         switch (view.getType()) {
             case "label":
-                xAxis = xAxis.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+                xAxis = xAxis.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
                 yAxis = new ArrayList<>();
                 if (CollectionUtils.isEmpty(xAxis)) {
                     return new ArrayList<String[]>();
@@ -413,7 +416,7 @@ public class ChartViewService {
             case "gauge":
             case "liquid":
                 xAxis = new ArrayList<>();
-                yAxis = yAxis.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+                yAxis = yAxis.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
                 if (CollectionUtils.isEmpty(yAxis)) {
                     return new ArrayList<String[]>();
                 }
@@ -430,8 +433,8 @@ public class ChartViewService {
                 yAxis = yAxis.stream().filter(item -> dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
                 break;
             default:
-                xAxis = xAxis.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
-                yAxis = yAxis.stream().filter(item -> !desensitizationList.keySet().contains(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+                xAxis = xAxis.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
+                yAxis = yAxis.stream().filter(item -> !desensitizationList.containsKey(item.getDataeaseName()) && dataeaseNames.contains(item.getDataeaseName())).collect(Collectors.toList());
         }
 
         List<ChartExtFilterRequest> extFilterList = new ArrayList<>();
@@ -1870,17 +1873,29 @@ public class ChartViewService {
         ChartViewDTO view = getOne(id, requestList.getQueryFrom());
         List<String[]> sqlData = sqlData(view, requestList, cache, fieldId);
         List<ChartViewFieldDTO> fieldList = new ArrayList<>();
-        if (StringUtils.equalsIgnoreCase(fieldType, "xAxis")) {
-            fieldList = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
-            }.getType());
-        } else if (StringUtils.equalsIgnoreCase(fieldType, "extStack")) {
-            fieldList = gson.fromJson(view.getExtStack(), new TypeToken<List<ChartViewFieldDTO>>() {
-            }.getType());
+        switch (fieldType) {
+            case "xaxis": {
+                fieldList = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
+                }.getType());
+                break;
+            }
+            case "extStack": {
+                fieldList = gson.fromJson(view.getExtStack(), new TypeToken<List<ChartViewFieldDTO>>() {
+                }.getType());
+                break;
+            }
+            case "xaxisExt": {
+                fieldList = gson.fromJson(view.getXAxisExt(), new TypeToken<List<ChartViewFieldDTO>>() {
+                }.getType());
+                break;
+            }
+            default:
+                return Collections.emptyList();
         }
         DatasetTableField field = dataSetTableFieldsService.get(fieldId);
 
         List<String> res = new ArrayList<>();
-        if (ObjectUtils.isNotEmpty(field) && fieldList.size() > 0) {
+        if (ObjectUtils.isNotEmpty(field) && !fieldList.isEmpty()) {
             // 找到对应维度
             ChartViewFieldDTO chartViewFieldDTO = null;
             int index = 0;
@@ -1904,10 +1919,22 @@ public class ChartViewService {
                 }
             }
             if (StringUtils.equalsIgnoreCase(fieldType, "extStack") && !skipAddIndex) {
-                List<ChartViewFieldDTO> stack = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
+                List<ChartViewFieldDTO> xaxis = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
                 }.getType());
-                index += stack.size();
-                getIndex += stack.size();
+                index += xaxis.size();
+                getIndex += xaxis.size();
+                if (StringUtils.containsIgnoreCase(view.getType(), "group")) {
+                    List<ChartViewFieldDTO> ext = gson.fromJson(view.getXAxisExt(), new TypeToken<List<ChartViewFieldDTO>>() {
+                    }.getType());
+                    index += ext.size();
+                    getIndex += ext.size();
+                }
+            }
+            if (StringUtils.equalsIgnoreCase(fieldType, "xaxisExt") && !skipAddIndex) {
+                List<ChartViewFieldDTO> xaxis = gson.fromJson(view.getXAxis(), new TypeToken<List<ChartViewFieldDTO>>() {
+                }.getType());
+                index += xaxis.size();
+                getIndex += xaxis.size();
             }
             List<String[]> sortResult = resultCustomSort(fieldList, sqlData);
             if (ObjectUtils.isNotEmpty(chartViewFieldDTO) && (getIndex >= index)) {

core/frontend/src/views/chart/components/dragItem/ChartDragItem.vue

@@ -195,7 +195,7 @@
                 <el-dropdown-item :command="beforeSort('asc')">{{ $t('chart.asc') }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{ $t('chart.desc') }}</el-dropdown-item>
                 <el-dropdown-item
-                  v-show="!item.chartId"
+                  v-show="showCustomSort"
                   :command="beforeSort('custom_sort')"
                 >{{ $t('chart.custom_sort') }}...</el-dropdown-item>
               </el-dropdown-menu>
@@ -228,6 +228,7 @@
 import { getItemType, getOriginFieldName } from '@/views/chart/components/dragItem/utils'
 import FieldErrorTips from '@/views/chart/components/dragItem/components/FieldErrorTips'
 import bus from '@/utils/bus'
+import { equalsAny } from '@/utils/StringUtils'
 
 export default {
   name: 'ChartDragItem',
@@ -273,6 +274,10 @@ export default {
         this.chart.datasourceType === 'ds_doris' ||
         this.chart.datasourceType === 'StarRocks' ||
         this.chart.datasetMode === 1
+    },
+    showCustomSort() {
+      return !equalsAny(this.chart.type, 'scatter') &&
+        !this.item.chartId
     }
   },
   watch: {

core/frontend/src/views/chart/components/dragItem/DimensionExtItem.vue

@@ -84,6 +84,12 @@
                 <el-dropdown-item :command="beforeSort('none')">{{ $t('chart.none') }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('asc')">{{ $t('chart.asc') }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{ $t('chart.desc') }}</el-dropdown-item>
+                <el-dropdown-item
+                  v-show="showCustomSort"
+                  :command="beforeSort('custom_sort')"
+                >
+                  {{ $t('chart.custom_sort') }}...
+                </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -181,6 +187,7 @@
 import { getItemType, getOriginFieldName } from '@/views/chart/components/dragItem/utils'
 import FieldErrorTips from '@/views/chart/components/dragItem/components/FieldErrorTips'
 import bus from '@/utils/bus'
+import { equalsAny } from '@/utils/StringUtils'
 
 export default {
   name: 'DimensionExtItem',
@@ -220,6 +227,10 @@ export default {
   computed: {
     hideSpecial() {
       return this.chart.type === 'bar-time-range'
+    },
+    showCustomSort() {
+      return !equalsAny(this.chart.type, 'bar-time-range', 'scatter') &&
+        !this.item.chartId
     }
   },
   watch: {
@@ -265,8 +276,18 @@ export default {
       }
     },
     sort(param) {
-      this.item.sort = param.type
-      this.$emit('onDimensionItemChange', this.item)
+      if (param.type === 'custom_sort') {
+        const item = {
+          index: this.index,
+          sort: param.type
+        }
+        this.$emit('onItemCustomSort', item)
+      } else {
+        this.item.index = this.index
+        this.item.sort = param.type
+        this.item.customSort = []
+        this.$emit('onDimensionItemChange', this.item)
+      }
     },
     beforeSort(type) {
       return {

core/frontend/src/views/chart/components/dragItem/DimensionItem.vue

@@ -90,9 +90,11 @@
                 <el-dropdown-item :command="beforeSort('asc')">{{ $t('chart.asc') }}</el-dropdown-item>
                 <el-dropdown-item :command="beforeSort('desc')">{{ $t('chart.desc') }}</el-dropdown-item>
                 <el-dropdown-item
-                  v-show="!item.chartId && (item.deType === 0 || item.deType === 5)"
+                  v-show="showCustomSort"
                   :command="beforeSort('custom_sort')"
-                >{{ $t('chart.custom_sort') }}...</el-dropdown-item>
+                >
+                  {{ $t('chart.custom_sort') }}...
+                </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </el-dropdown-item>
@@ -191,6 +193,7 @@ import { getItemType, getOriginFieldName } from '@/views/chart/components/dragIt
 import FieldErrorTips from '@/views/chart/components/dragItem/components/FieldErrorTips'
 import bus from '@/utils/bus'
 import { formatterItem } from '@/views/chart/chart/formatter'
+import { equalsAny } from '@/utils/StringUtils'
 
 export default {
   name: 'DimensionItem',
@@ -228,6 +231,13 @@ export default {
       showDateExt: false
     }
   },
+  computed: {
+    showCustomSort() {
+      return !equalsAny(this.chart.type, 'scatter') &&
+        !this.item.chartId &&
+        (this.item.deType === 0 || this.item.deType === 5)
+    }
+  },
   watch: {
     dimensionData: function() {
       this.getItemTagType()

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

@@ -568,6 +568,7 @@
                             :chart="chart"
                             @onDimensionItemChange="dimensionItemChange"
                             @onDimensionItemRemove="dimensionItemRemove"
+                            @onItemCustomSort="item => onCustomSort(item, 'xaxisExt')"
                             @editItemFilter="showDimensionEditFilter"
                             @onNameEdit="showRename"
                           />
@@ -670,7 +671,7 @@
                               @editItemFilter="showDimensionEditFilter"
                               @onNameEdit="showRename"
                               @valueFormatter="valueFormatter"
-                              @onCustomSort="onCustomSort"
+                              @onCustomSort="item => onCustomSort(item, 'xaxis')"
                             />
                           </template>
                         </transition-group>
@@ -748,6 +749,7 @@
                             :chart="chart"
                             @onDimensionItemChange="dimensionExtItemChange"
                             @onDimensionItemRemove="dimensionItemRemove"
+                            @onItemCustomSort="item => onCustomSort(item, 'xaxisExt')"
                             @editItemFilter="showDimensionEditFilter"
                             @onNameEdit="showRename"
                           />
@@ -947,7 +949,7 @@
                             :quota-data="quota"
                             @onItemChange="stackItemChange"
                             @onItemRemove="stackItemRemove"
-                            @onItemCustomSort="stackItemCustomSort"
+                            @onItemCustomSort="item => onCustomSort(item, 'extStack')"
                             @onNameEdit="showRename"
                           />
                         </transition-group>
@@ -1760,7 +1762,7 @@
     >
       <custom-sort-edit
         :chart="chart"
-        field-type="xAxis"
+        :field-type="customSortFieldType"
         :field="customSortField"
         @onSortChange="customSortChange"
       />
@@ -1782,40 +1784,6 @@
       </div>
     </el-dialog>
 
-    <!--extStack自定义排序-->
-    <el-dialog
-      v-if="showStackCustomSort"
-      v-dialogDrag
-      :title="$t('chart.custom_sort')"
-      :visible="showStackCustomSort"
-      :show-close="false"
-      width="500px"
-      class="dialog-css"
-    >
-      <custom-sort-edit
-        :chart="chart"
-        field-type="extStack"
-        :field="customSortField"
-        @onSortChange="customSortChange"
-      />
-      <div
-        slot="footer"
-        class="dialog-footer"
-      >
-        <el-button
-          size="mini"
-          @click="closeStackCustomSort"
-        >{{ $t('chart.cancel') }}
-        </el-button>
-        <el-button
-          type="primary"
-          size="mini"
-          @click="saveStackCustomSort"
-        >{{ $t('chart.confirm') }}
-        </el-button>
-      </div>
-    </el-dialog>
-
     <!--视图计算字段弹框-->
     <el-dialog
       v-if="editChartCalcField"
@@ -2071,7 +2039,8 @@ export default {
       lastDimensionIndex: 0,
       lastQuotaIndex: 0,
       selectedDimension: [],
-      selectedQuota: []
+      selectedQuota: [],
+      customSortFieldType: 'xaxis'
     }
   },
   computed: {
@@ -2844,9 +2813,10 @@ export default {
       this.moveId = e.draggedContext.element.id
       return true
     },
-    onCustomSort(item) {
-      this.customSortField = this.view.xaxis[item.index]
-      this.customSort()
+    onCustomSort(item, axis) {
+      this.customSortFieldType = axis
+      this.customSortField = this.view[axis][item.index]
+      this.showCustomSort = true
     },
 
     dimensionItemChange(item) {
@@ -3422,11 +3392,6 @@ export default {
       this.view.extStack.splice(item.index, 1)
       this.calcData(true)
     },
-    stackItemCustomSort(item) {
-      this.customSortField = this.view.extStack[item.index]
-      this.stackCustomSort()
-    },
-
     drillItemChange(item) {
       this.calcData(true)
     },
@@ -3678,9 +3643,6 @@ export default {
       this.closeValueFormatter()
     },
 
-    customSort() {
-      this.showCustomSort = true
-    },
     customSortChange(val) {
       this.customSortList = val
     },
@@ -3690,7 +3652,7 @@ export default {
       this.customSortList = []
     },
     saveCustomSort() {
-      this.view.xaxis.forEach(ele => {
+      this.view[this.customSortFieldType].forEach(ele => {
         if (ele.id === this.customSortField.id) {
           ele.sort = 'custom_sort'
           ele.customSort = this.customSortList
@@ -3699,24 +3661,6 @@ export default {
       this.closeCustomSort()
       this.calcData(true)
     },
-
-    stackCustomSort() {
-      this.showStackCustomSort = true
-    },
-    closeStackCustomSort() {
-      this.showStackCustomSort = false
-    },
-    saveStackCustomSort() {
-      this.view.extStack.forEach(ele => {
-        if (ele.id === this.customSortField.id) {
-          ele.sort = 'custom_sort'
-          ele.customSort = this.customSortList
-        }
-      })
-      this.closeStackCustomSort()
-      this.calcData(true)
-    },
-
     fieldEdit(param) {
       switch (param.type) {
         case 'ds':