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

[Sherzod]

* 

metaData.tdAttr = 'colspan='+ columns.length-2 ;

 

metaData.tdAttr = 'colspan='+ columns.length-startCol-1;

[Dinkin]

Спасибо!

А можно для уточнения подвести в итоге алгоритм, правильно ли я все понял (просто с последней Вашей корректировкой может какие то пункты можно пропустить)....вот так верно?

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)
{
    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;
          }
      }
    }
}

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;
}

 

[Sherzod]

4 minutes 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;

Добрый день,

Этот код можно удалить, мы перенесли всю логику на клиентскую часть...

[Sherzod]

On 12/22/2023 at 10:53 PM, Sherzod said:

1.

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

...

[Dinkin]

Спасибо, все отлично!

[Dinkin]

А с TUniDBTreeGrid такое не работает ? просто попробовал все тоже самое в такой таблице и нет эффекта.

[Sherzod]

Надо проверить. 

[Dinkin]

А почти работает, но только не трогает колонки которые сгруппированы =(

[Dinkin]

Подозреваю что так же не сработает и в обычной таблице

[Sherzod]

13 minutes ago, Dinkin said:

Подозреваю что так же не сработает и в обычной таблице

Уточните пожалуйста. 

[Dinkin]

Вот эти 4 колонки не трогает скрипт, оставляет их видимыми, так как они сгруппированы

[Sherzod]

Теперь понял.

Да, нужно переделать...

А какие именно хотите объединить к примеру?

[Dinkin]

5 minutes ago, Sherzod said:

А какие именно хотите объединить к примеру?

Ну у меня логика, что скрыть абсолютно все что с права от первой колонки.....и вот с 4-по 7(включительно) ку меня колонки в группе.

[Sherzod]

Ok, попробую проанализировать позже.

[Dinkin]

Спасибо!

[Sherzod]

[Sherzod]

1. Удалите код из ClientEvents (reconfigure).

2. Переместите код в OnCreate формы, используя именно JSAddListener:

procedure TMainForm.UniFormCreate(Sender: TObject);
begin
  UniDBGrid1.JSInterface.JSAddListener('reconfigure', 'function(sender, store, columns, oldStore, oldColumns, eOpts){'+
    'var columns = sender.columnManager.getColumns();'+
    'var startCol = 1; '+
    'var colCount = columns.length; '+
    'var fieldIndx = 0; '+
    'var fieldValue = 1500; '+

    'columns[startCol].renderer = function (value, metaData, record) {    '+
    '    if (record.data[fieldIndx] < fieldValue) {                       '+
    '        metaData.tdCls = "span-columns";                             '+
    '        metaData.tdAttr = "colspan="+ columns.length-startCol-1 ;    '+
    '    }                                                                '+
    '    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;                                              '+
    '      }                                                              '+
    '  }                                                                  '+
    '}                                                                    '+
   '}');
end;

3. Удалите все "комментарии" в коде (парсер иногда неправильно понимает //).

4. При необходимости, корректируйте переменные в коде (startCol, fieldIndx, fieldValue). 

5. CustomCSS, cls конфиг остаются как прежде...

6. И попробуйте...

[Sherzod]

И еще такой эффект с выравниванием:

[Dinkin]

Все суппер!  

Этот вариант подходит как и для дерева, так и для обычных таблиц)

[Dinkin]

Добрый день.

Я извиняюсь, небольшой вопросик,  вот то что код выше отменяет для обработаных столбцов событие DrawColumnCell отключается.

[Sherzod]

Да, потому что, мы назначаем свой renderer метод.

[Dinkin]

Добрый день!  

А возможно  из JSAddListener вызывать обычную функцию (передав в нее record.data[fieldIndx]) из тела программы, которая будет возвращать к примеру 0 или 1?

[Sherzod]

Добрый, 

41 minutes ago, Dinkin said:

вызывать обычную функцию

Какую например? 

[Dinkin]

Что то вроде такого (не пишу на паскале...для примера написал)
function TestFunction(st: String):Integer; 

begin
    return_value Integer;
    if  st = 'a'    
        then return_value := 1;
            else 
                return_value := 2;
end;

Или как то то позволить менять цвет строк через GridDrawColumnCell (вижу что переназначили, но все же вдруг есть вариант).

 

[Sherzod]

Логику можете перенести в "наш" renderer метод.