TUniDBGrid Объединение ячеек в строке

[Dinkin]

Добрый день.

Возможно ли объединить или скрыть ячейки в строке?

[Sherzod]

Добрый день,

Аналогичный пост:

 

[Dinkin]

Пробовал это вариант, нет результата чет 🙂

Там пишут что не ко всем версиям подходит, возможно к моей "1.90.0.1560" версии тоже не подходит🙂. Или может там для статичных данных, у меня таблица строится по запросам от хранимых процедур.

[Dinkin]

Спасибо, более менее в итоге получилось.

А не подскажете что ни так, пробую скрыть ряд ячеек в строке

function beforeInit(sender, config)
{
    // Объединяем ячейки в заголовке
    config.updatecolSpan = function() {
        var columns = sender.getColumns(),
            view = sender.getView(),
            store = sender.getStore(),
            colCount = store.getCount(),

            spanCell = null,
            spanCount = null;
        
        for (var col = 2; col < colCount; ++col) 
            {
                var cell = view.getCellByPosition({ row: 0, column: col }).dom,
                    record = store.getAt(0),
                    value = record.get(col);

                Ext.fly(cell).setStyle('display', 'none');
            }
        
        if (spanCell !== null) {
            spanCell.colSpan = spanCount;
        }
    };
}

 

[Sherzod]

Добрый день, 

А что не получается?

Скрины?

[Dinkin]

Получается только  вертикально объединить. А мне только 4 горизонтальных 

[Sherzod]

3 hours ago, Dinkin said:

 

Мне кажется Вам нужен другой подход.

Во первых, в этих ячейках, и тип, и данные различные.

Во вторых, мне кажется, что лучше использовать группировку, либо хранимые процедуры в самой БД...

[Dinkin]

Так я и использую хранимые процедуры, мне надо как то визуализировать потребности в таблице, тут ни какие хранимки не помогут, все на стороне верстки делается же. 

[Sherzod]

Вы можете "очищать" поля в хранимой процедуре к примеру...

[Dinkin]

Могу, но в таблице визуально все равно остаются клетки, пустые.

[Sherzod]

15 hours ago, Dinkin said:

Могу, но в таблице визуально все равно остаются клетки, пустые.

Да, но, думаю чтобы использовать colSpan, мы должны заранее знать "номера" строк, и количество столбцов (начиная с определенной column) которые мы должны объединить.

Еще раз позвольте спросить, какую логику используете для объединения ячеек? 

[Sherzod]

Если заранее придерживаться некоторой логики...

 

[Dinkin]

2 hours ago, Sherzod said:

Еще раз позвольте спросить, какую логику используете для объединения ячеек? 

В заголовке таблице должна быть одна строка "Все проекты". Пробовал сделать группировку, но тогда заголовок становиться не кликабельным.

попробовал так, не знаю на сколько это правильно

function beforeInit(sender, config)
{
      // Скрываем не использываемые ячейки
      
      config.updateRowSpan = function() {
      var view = sender.getView();

        for (var i = 1; i < 7; ++i) 
            {
               var cell = view.getCellByPosition({ row: 0, column: i }).dom;
               if (cell != null) 
                  Ext.fly(cell).setStyle('display', 'none');
            }
    };
}

 

1 hour ago, Sherzod said:

Если заранее придерживаться некоторой логики...

Вы отправляете через процедуру какие то элементы верстки, что скрывают строки?

[Sherzod]

4 minutes ago, Dinkin said:

В заголовке таблице должна быть одна строка "Все проекты".

Т.е., только одна строка !?

[Dinkin]

6 minutes ago, Sherzod said:

Т.е., только одна строка !?

Ага. 

На фрейме две таблицы, в первой только одна верхняя строка, во второй надо будет как то сделать как у Вас на скрине, думаю там группировкой, только пока не знаю можно ли сделать группировку в DBTreeGrid. 

[Sherzod]

1 hour ago, Dinkin said:

во второй надо будет как то сделать как у Вас на скрине

Примерное решение (Вы можете модифицировать код, чтобы не использовать "константы").

1. UniDBGrid1.OnDrawColumnCell ->

procedure TMainForm.UniDBGrid1DrawColumnCell(Sender: TObject; ACol,
  ARow: Integer; Column: TUniDBGridColumn; Attribs: TUniCellAttribs);
begin
  //if ARow = 1 then
  if Column.Field.DataSet.FieldByName('EmpNo').Value < 30 then
  begin
    if ACol > 1 then
      Attribs.Style.Cls := 'hide-column'
  end;

end;

2. UniDBGrid1.ClientEvents.ExtEvents (также нужно модифицировать код) ->

function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts)
{
    columns[1].renderer = function (value, metaData, record) {
        metaData.tdCls = 'span-columns';
        metaData.tdAttr = 'colspan='+ columns.length-2 ;
        return value;
    };
}

3. UniDBGrid1.LayoutConfig.Cls = adjust-columns

4. CustomCSS ->

.adjust-columns .span-columns {
    width: auto !important;
}

.adjust-columns .x-grid-item {
    /* This is pretty key... the framework sets a width of 0 on the table rows,
     * so this could have some other side effects */
    width: 100% !important;
}

.adjust-columns .hide-column {
    display: none;
}

 

Источник:

https://stackoverflow.com/questions/53537437/extjs-grid-colspan-and-row-span

 

Результат:

[Sherzod]

Ну как, разобрались? 

Помогло решение? 

[Dinkin]

Почему то не удаляет колонку с прогрессом

[Sherzod]

А что там, widget?

[Dinkin]

ага

[Sherzod]

Позже постараюсь проанализировать.

[Dinkin]

Спасибо!

[Sherzod]

Получается, что нужно перенести всю логику на клиентскую часть.

[Sherzod]

1.

//  if Column.Field.DataSet.FieldByName('EmpNo').Value < 30 then
//  begin
//    if ACol > 1 then
//      Attribs.Style.Cls := 'hide-column'
//
//  end;

2.

function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts)
{
    var startCol = 1; //zero based
    var colCount = columns.length;
    var fieldIndx = 0; //будет рассматриваться первая колонка
    var fieldValue = 30; //значение для условия проверки
    
    columns[startCol].renderer = function (value, metaData, record) {
        if (record.data[fieldIndx] < fieldValue) {
            metaData.tdCls = 'span-columns';
            metaData.tdAttr = 'colspan='+ columns.length-2 ;
        }
        return value;
    };
    
    startCol += 1;
    for (let i = startCol; i < colCount; i++) {
      if (columns[i].widget) {
          columns[i].onWidgetAttach = function(column, widget, record) {
              if (record.data[fieldIndx] < fieldValue) {
                  widget.element.up('td').addCls('hide-column')
              }
          }
      } else {
          columns[i].renderer = function (value, metaData, record) {
              if (record.data[fieldIndx] < fieldValue) {
                  metaData.tdCls = 'hide-column';
              }
              return value;
          }
      }
    }
}

 

[Sherzod]