DevExpress (JS) — сгруппированные элементы dxDataGrid с пользовательскими сводными значениями

У меня есть dxDataGrid с 4 уровнями группировки. У меня также есть «сводная» конфигурация для «groupedItems» для суммирования различных полей и создания сводных данных для каждой группы. Однако по умолчанию devExpress будет пузырить эту СУММУ среди всех уровней группы (чего я не хочу), вместо этого я хотел бы использовать поведение «суммы» только для моих 4-й и 3-й групп, а затем иметь пользовательскую логику (a функция или что-то в этом роде), где я могу вычислить итоговые значения для моей 2-й группы.

В настоящее время у меня есть сводные данные 4-й и 3-й групп, отображаемые в сетке без проблем. Однако я не вижу какой-либо пользовательской опции, которую я могу включить, чтобы иметь пользовательскую сводку для определенной группы столбцов (в моем случае — «Практика»).

В настоящее время я использую DevExpress Extreme (JS) v16.1.6. Однако, если это выполнимо в другой технологии, такой как пользовательский интерфейс Kendo, было бы неплохо узнать, как это сделать там, поскольку в ближайшем будущем я планирую перейти с DevExpress на пользовательский интерфейс Kendo.

Я приложил скриншот, чтобы вы, ребята, могли немного лучше визуализировать мою проблему. Пример

Вот мой JS-код для DataGrid.

dxDataGrid: {
            dataSource: myDataSource, //AJAX Call
            grouping: { 
                autoExpandAll: false 
            },
            rowAlternationEnabled: true,
            allowColumnResizing: true,
            columnAutoWidth: true, 
            sorting: { mode: 'multiple' },
            searchPanel: { visible: true, width: 240, placeholder: 'Search...' },
            filterRow: { visible: true },
            loadPanel: { enabled: true },
            export: { enabled: true, fileName: 'My Test Report' },
            paging: { enabled: true },
            grouping: {
                autoExpandAll: false
            },
            groupPanel: {
                visible: true,
                allowColumnDragging: false
            },
            pager: {
                showPageSizeSelector: true,
                showNavigationButtons: true,
                showInfo: true
            },
            onCellPrepared: function(e) {

                if (e.rowType === 'group' && e.row.groupIndex <= 1 && e.columnIndex > e.row.groupIndex + 1) {
                   // e.cellElement.text(''); //This is bad, need to Find a solution now
                }
                else if (e.column.dataField === 'TotalPacCostPercentage') {

                    var pacPercentage = parseFloat(e.value) * 100;

                    if (pacPercentage >= 25 && pacPercentage <= 75) {
                        e.cellElement.addClass('medium-risk');
                    }
                    else if (pacPercentage > 75) {
                        e.cellElement.addClass('high-risk');
                    }
                }
            },
            columns: [
                { dataField: 'CountyName', caption: 'County', groupIndex: 0},
                { dataField: 'PracticeNameAndTin', caption: 'Practice', groupIndex: 1 },
                { dataField: 'ProviderDisplayName', caption: 'Provider', groupIndex: 2 },
                { dataField: 'CcsGroupName', caption: 'CCS Group', groupIndex: 3 },
                { dataField: 'CcsName', caption: 'CCS Name', allowGrouping: false },
                { dataField: 'ClaimTypeName', caption: 'Claim Type', allowGrouping: false },
                { dataField: 'PlaceOfServiceName', caption: 'Place of Service', allowGrouping: false },
                { dataField: 'PreTriggerCost', caption: 'Average Pre-Trigger', format: 'currency', allowGrouping: false  },
                { dataField: 'PreTriggerPacCostPercentage', caption: 'Pre-Trigger PAC %', format: 'percent', allowGrouping: false },
                { dataField: 'TriggerCost', caption: 'Average Trigger', format: 'currency', allowGrouping: false },
                { dataField: 'TriggerPacCostPercentage', caption: 'Trigger PAC %', format: 'percent', allowGrouping: false },
                { dataField: 'PostTriggerCost', caption: 'Average Post-Trigger', format: 'currency', allowGrouping: false },
                { dataField: 'PostTriggerPacCostPercentage', caption: 'Post-Trigger PAC %', format: 'percent', allowGrouping: false },
                { dataField: 'TotalCost', caption: 'Average Cost', format: 'currency', allowGrouping: false },
                { dataField: 'TotalPacCostPercentage', caption: 'PAC %', format: 'percent', allowGrouping: false }
            ],
            summary: {
                groupItems: [
                    { column: 'PreTriggerCost', summaryType: 'sum', valueFormat: 'currency', displayFormat: '{0}', alignByColumn: true },
                    { column: 'TriggerCost', summaryType: 'sum', valueFormat: 'currency', displayFormat: '{0}', alignByColumn: true },
                    { column: 'PostTriggerCost', summaryType: 'sum', valueFormat: 'currency', displayFormat: '{0}', alignByColumn: true },
                    { column: 'TotalCost', summaryType: 'sum', valueFormat: 'currency', displayFormat: '{0}', alignByColumn: true },
                ]
            }
        }

javascript kendo-grid devexpress kendo-ui dx-data-grid
person Adrian Cruz    schedule 09.03.2018    source источник

Ответы (1)


arrow_upward
2
arrow_downward

У вас есть сводные типы. ниже

  • "sum" Суммирует все значения в столбце.
  • "min" Вычисляет минимальное значение в столбце.
  • "max" Вычисляет максимальное значение в столбце.
  • "avg" Вычисляет среднее значение всех значений в столбце.
  • "count" Подсчитывает количество элементов в столбце.
  • "custom" Позволяет указать пользовательскую агрегатную функцию с помощью параметра calculateCustomSummary.

Для пользовательского режима вы можете создать пользовательскую функцию как показано ниже:

$("#gridContainer").dxDataGrid({
    // ...
    summary: {
        totalItems: [
            { summaryType: 'custom', name: 'CustomSummary1' },
            { summaryType: 'custom', name: 'CustomSummary2' }
        ],
        calculateCustomSummary: function (options) {
            // Calculating "CustomSummary1"
            if (options.name == 'CustomSummary1') {
                if (options.summaryProcess == 'start') {
                    // Initializing "totalValue" here
                }
                if (options.summaryProcess == 'calculate') {
                    // Modifying "totalValue" here
                }
                if (options.summaryProcess == 'finalize') {
                    // Assigning the final value to "totalValue" here
                }
            }

            // Calculating "CustomSummary2"
            if (options.name == 'CustomSummary2') {
                // ...
                // Same "if" statements here
            }
        }
    }
});
person Victor Hugo Terceros    schedule 13.03.2018
comment
Сделают ли эти расчетные значения экспорт в Excel? - person Adrian Cruz; 13.03.2018
comment
@AdrianCruz Думаю, да, но это был не ваш вопрос, и добавление подвопросов - это не то, как работает SO, вам нужно будет проверить - person Victor Hugo Terceros; 13.03.2018
comment
Хорошо, я попробую и посмотрю, как это работает. Спасибо! - person Adrian Cruz; 13.03.2018