Итоги Slickgrid

0

Есть ли способ показать великие итоги в Slickgrid с группировкой?

Я нашел следующее:

1) В документации Внедрение итоговой строки через поставщика данных. Но тогда я не могу использовать функции DataView и группировки.

2) Существует плагин для SlickGrid, называемый Slickgrid totalals plugin. Но это не позволяет использовать функции группировки.

  • 0
    Второе, которое вам кажется многообещающим, вы должны сначала попытаться скомпоновать код с группировкой, а затем присоединить / зарегистрировать TotalGrouping, поскольку присоединить ее очень просто.
  • 0
    Спасибо за ответ! Я не уверен, что полностью вас понял, не могли бы вы привести пример кода, пожалуйста?
Теги:
slickgrid

2 ответа

1
Лучший ответ
  1. Добавить функцию TotalsDataProvider
function TotalsDataProvider(dataView, columns) {
  var totals = {};
  var totalsMetadata = {
  // Style the totals row differently.
    cssClasses: "totals",
    columns: {}
  };
  // Make the totals not editable.
  for (var i = 0; i < columns.length; i++) {
    totalsMetadata.columns[i] = { editor: null };
  }
  this.getLength = function() {
    return dataView.getLength() + 1;
  }
  this.getItem = function(index) {
    return (index < dataView.getLength()) ? dataView.getItem(index) : totals;
  };

  // Some group-functions from DataView
  this.setRefreshHints = function(hints) {
    return dataView.setRefreshHints(hints);
  };
  this.collapseGroup = function(varArgs) {
    return dataView.collapseGroup(varArgs);
  };
  this.expandGroup = function(varArgs) {
    return dataView.expandGroup(varArgs);
  };

  this.updateTotals = function() {
    var columnIdx = columns.length;
    while (columnIdx--) {
      var column = columns[columnIdx];
      if (!column.hasTotal) { // Just add in your column "hasTotal: true" 
        continue;
      }
      var total = 0;
      var i = dataView.getLength();
      while (i--) {
        total += (dataView.getItem(i)[column.field] || 0);
      }
      totals[column.field] = total;
    }
  };
  this.getItemMetadata = function(index) {
    return (index != dataView.getLength()) ? dataView.getItemMetadata(index) : totalsMetadata;
  };
  this.updateTotals();
}
  1. Добавьте в столбцы параметр "hasTotal: true". Например:
var columns = [
        {id: "id", name: "Index", field: "id", hasTotal: true},
        {id: "title", name: "Title", field: "title"},
        {id: "duration", name: "Duration", field: "duration", hasTotal: true},
        {id: "%", name: "% Complete", field: "percentComplete", hasTotal: true},
        {id: "start", name: "Start", field: "start"},
        {id: "finish", name: "Finish", field: "finish"},
        {id: "effort-driven", name: "Effort Driven", field: "effortDriven"}
      ];
  1. Измените переменную сетки и добавьте переменную dataProvider выше:
//grid = new Slick.Grid("#myGrid", dataView, columns, options);
var dataProvider = new TotalsDataProvider(dataView, columns);
grid = new Slick.Grid("#myGrid", dataProvider, columns, options);
  1. Каждый раз, когда вы меняете данные (путем фильтрации или с помощью grid.onCellCange), вам необходимо обновить общие данные:
// The data has changed - recalculate the totals.
dataProvider.updateTotals(); 
// Rerender the totals row (last row).     
grid.invalidateRow(dataProvider.getLength() - 1);
grid.render();
  • 0
    Спасибо за Ваш ответ! Это кажется более элегантным решением, чем мое. Я проверю это позже.
0

Я нашел некоторое обходное решение. Алгоритм выглядит следующим образом:

  1. Сбор данных JSON
  2. Рассчитать суммарные суммы для необходимых столбцов
  3. Нажмите дополнительную строку (элемент массива) внизу массива данных JSON с дополнительным параметром, например, noGrouping:true
  4. dataView.setItems(JSONDataArray) данных в DataView с помощью dataView.setItems(JSONDataArray)
  5. В slick.dataview.js в функции addTotals, после строки:

    g.collapsed = groupCollapsed ^ toggledGroups[g.groupingKey]; Добавить:

    if(g.rows[0].noGrouping) {
      g.collapsed = true;
    }
    

    Таким образом, группа великих итогов всегда рушится

  6. При необходимости добавьте некоторое форматирование в slick.groupitemmetadataprovider.js для функции defaultGroupCellFormatter

Ещё вопросы

Сообщество Overcoder
Наверх
Меню