Я реализовал таблицы таблиц с отображением заказов. Требуется одна логика: автоматически скрывать все позиции заказа для каждого заказа в таблице, а затем легко их расширять.
Одна из проблем заключается в том, что некоторые заказы могут иметь 10 позиций, а другие - 1.
Таким образом, эта реализация, поскольку мне нужно настроить правильное количество столбцов, отображает путь ко многим скрытым адаптивным строкам для заказов, которые в них не нуждаются.
Есть ли способ скрыть столбцы для строк, которые имеют только 1 элемент строки при расширении для их отображения? Тогда также сможете расширить еще одну строку на 10 позиций и просмотреть все 10 этих позиций?
Уже разработано для динамического определения количества th для позиций.
<thead>
<tr class="text-center">
<th></th>
<th scope="col">{{ __('Order ID') }}</th>
<th scope="col">{{ __('Status') }}</th>
<th scope="col">{{ __('Customer Name') }}</th>
<th scope="col">{{ __('Total Price') }}</th>
<th scope="col">{{ __('Created') }}</th>
<th scope="col">{{ __('Updated') }}</th>
<th scope="col" class="none">{{ __('Order Item 1') }}</th>
<th scope="col" class="none">{{ __('Order Item 2') }}</th>
<th scope="col" class="none">{{ __('Order Item 3') }}</th>
<th scope="col" class="none">{{ __('Order Item 4') }}</th>
<th scope="col" class="none">{{ __('Order Item 5') }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td>g</td>
<td>h</td>
<td>i</td>
<td>j</td>
<td>k</td>
<td>l</td>
<tr>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td>g</td>
<td>h</td>
<td>i</td>
<td></td>
<td></td>
<td></td>
<tr>
</tbody>
Таким образом, когда вы расширяете вторую строку, у нее есть два пустых tds, поэтому она не будет отображать th или td в строках, как это делает таблица данных для последних двух, но если я разверну первую строку, все будет отображено.