如何在数据表中对子行进行分组

我有一个使用子行的表，其中每一行都是可展开/可折叠的，但我的父行包含重复数据，如下所述。

我想对我的辅助行或子行进行分组，因为它们在官方Datatables文档中被调用，其中我有下表，其中父行中有采购订单、采购订单日期、货币和状态列。

如果你看，我有 3 个对应于相同标识符的采购订单，在本例中是258，但每个采购订单都包含一个具有不同信息的辅助行，该信息是接收日期、发票编号、项目代码和描述。

+-----------------------------------------------------------------------+
|    | Orden de compra  | Fecha de Orden de Compra | Moneda |   Estado  |
+----+------------------+--------------------------+--------+-----------+
|  + |        258       |       06/01/2020         |   USD  | Entregado |                                
+------+---------+------------+-------------------+-------------+-------+
|   Fecha de recepción  | No. Factura | Código Articulo |  Descripción  |
+------+---------+-----------+--------------------+-------------+-------+
|       07/01/2020      |     617     |      CA0033     |       CT      |
+-----------------------------------------------------------------------+
|  + |        258       |       06/01/2020         |   USD  | Entregado |
+-----------------------+--------------------------+--------+-----------+
|   Fecha de recepción  | No. Factura | Código Articulo |  Descripción  |
+-----------------------+-------------+-----------------+---------------+
|       14/01/2020      |     620     |      CA0036     |      CTR      |
+-----------------------+-------------+-----------------+---------------+
|  + |        258       |       06/01/2020         |   USD  | Entregado |
+-----------------------+--------------------------+--------+-----------+
|   Fecha de recepción  | No. Factura | Código Articulo |  Descripción  |
+-----------------------+-------------+-----------------+---------------+
|       16/01/2020      |     626     |      CC0048     |      CTY      |
+-----------------------+-------------+-----------------+---------------+

在不重复采购订单的情况下，我想实现的是将子行分组如下。

    +-----------------------------------------------------------------------+
    |    | Orden de compra  | Fecha de Orden de Compra | Moneda |   Estado  |
    +----+------------------+--------------------------+--------+-----------+
    |  + |        258       |       06/01/2020         |   USD  | Entregado |                                
    +------+---------+------------+-------------------+-------------+-------+
    |   Fecha de recepción  | No. Factura | Código Articulo |  Descripción  |
    +------+---------+-----------+--------------------+-------------+-------+
    |       07/01/2020      |     617     |      CA0033     |       CT      |
    +-----------------------+-------------+-----------------+---------------+
    |       14/01/2020      |     620     |      CA0036     |      CTR      |
    +-----------------------+-------------+-----------------+---------------+
    |       16/01/2020      |     626     |      CC0048     |      CTY      |
    +-----------------------+-------------+-----------------+---------------+

如果您现在查看采购订单，它包含 3 个相同订单的分组信息，这就是我想要的。

以下是用于构建表的 AJAX 调用的代码。

/* Formatting function for row details - modify as you need */
function format(d) {
    // `d` is the original data object for the row
    console.log(d);
    
    return '<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">' +
        '<tr>' +      
        '<td><strong>Fecha de Recepción: </strong></td>' + '<td><strong>No. Factura:<strong></td>' +  '<td><strong>Codigo Art:<strong></td>' +  '<td><strong>Descripcion Art:</strong></td>' +
        '</tr>' +
        '<tr>' +
        '<td>' + d.FechaFactura + '</td>' + '<td>' + d.Factura + '</td>' + '<td>' + d.Codigo + '</td>' +  '<td>' + d.Descripcion_Articulo + '</td>' +
        '</tr>' +    
        '</table>';     
}


$(document).ready(function () {
    $('#example').dataTable( {
        responsive : true,
         ajax : {
             "type": 'POST',
             "url" : './test.php',  
             "dataType": 'JSON',             
             "cache": false,
             "data": {
                 'param' : 1,                           
             },
         },
         language : {
            "lengthMenu": "Mostrar _MENU_ registros",
            "zeroRecords": "No se encontró nada",
            "info": "Mostrando del _START_ al _END_ de un total de _TOTAL_",
            "infoEmpty": "No hay registros",
            "emptyTable": "No hay datos para mostrar",
            "loadingRecords": "Cargando...",
            "processing": "Procesando...",
            "search": "Buscar:",
            "infoFiltered": "(filtrado de un total de _MAX_ registros)",
            "paginate": {
                "first": "Primera",
                "last": "Última",
                "next": "Siguiente",
                "previous": "Anterior"
            }
         },    
         columns: [          
             {
                 "className":      'details-control',
                 "orderable":      false,
                 "data":           null,
                 "defaultContent": ''
             },
             { "data" : "OrdenCompra" },
             { "data" : "FechaOrdenCompra" },
             { "data" : "TipoMoneda" },
             { "data" : "Estatus" }                 
        ],
         order : [[1, 'desc']]
    } );

    
    // Add event listener for opening and closing details
    $('#example').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = $('#example').DataTable().row(tr);

        if (row.child.isShown()) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child(format(row.data())).show();
            tr.addClass('shown');
        }
    });

});

查阅Datatables文档，它有一个RowGroup扩展，但我不知道它们是否可以分组为辅助行或子行。如果您能帮助我找到解决此问题的方法，我将不胜感激。

重要的是要记住，作为主行，我需要采购订单、采购订单日期、货币和状态，作为第二行，我需要找到接收日期、发票编号、项目代码和描述。

更新：

我附上了一个我想用我的桌子构建的手工示例：

如果你看，我有两个采购订单，每个订单都包含一个带有信息的子行。我没有重复每个采购订单，而是根据它们的 ID 将它们组合成一个。

在我的 Javascript 中，它看起来像这样：

/* Formatting function for row details - modify as you need */
function format(d) {
    // `d` is the original data object for the row
    console.log(d);
        let tabla = `<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">
                    <thead>
                        <tr>
                            <th>
                                Fecha de recepción
                            </th>
                            <th>
                                No. Factura
                            </th>
                            <th>
                                Codigo Art
                            </th>
                            <th>
                                Descripcion
                            </th>
                        </tr>
                        </thead>
                        <tbody>`;
                            d.Factura.forEach(f => {
                                tabla += `<tr>
                                <td>${f.FechaFactura}</td>
                                <td>${f.Factura}</td>
                                <td>${f.Codigo}</td>
                                <td>${f.Descripcion_Articulo}</td>
                                </tr>`;
                            });
                       tabla += '</tbody></table>';
                       return tabla;
                       }

当我重新加载我的表时，我收到以下错误：

更新 4：

现在我在对我的 JSON 的响应中得到以下信息：

在尝试对响应进行最后修改后，我现在得到以下作为对我的 JSON 的响应。

更新 5：

我现在收到以下内容作为对我的 JSON 的响应

当alert从 Datatables 视图加载表时，我得到以下信息：

更新 6：

在尝试了答案中找到的代码后，我在 Datatable 中得到了一个结果，但所有子行都分组在一个父行中以避免这种情况，我构建了以下数据以按父行和子行分组。

while添加以下分组数据后：

// -- Aquí tienes toda tu data agrupada
                $group_data = group_array($query, "OrdenCompraGroup");

                // -- Creamos un nuevo array para la nueva data procesada
                $new_data = array();

                // -- Vamos armar un array padre e hijo
                foreach($group_data as $itemPadre) {
                    // -- Variables que necesitas para el padre
                    $ordenCompra = "";
                    $fechaOrdenCompra = "";
                    $TipoMoneda="";       
                    $Estatus = "";                  
                    
                    // -- Declaramos la variable donde se almacenaran los datos hijos
                    $arrayFactura = array();

                    // --
                    foreach($itemPadre["groupdata"] as $itemHijo) {
                        // -- Aquí llenamos las variables del padre, ya que se encuentran dentro del groupdata
                        $ordenCompra = $itemHijo["OrdenCompra"];
                        $fechaOrdenCompra = $itemHijo["FechaOrdenCompra"];
                        $TipoMoneda = $itemHijo["TipoMoneda"];
                        $Estatus = $itemHijo["Estatus"];

                        // -- Aquí llenamos la data del hijo
                        $arrayFactura[] = array(
                            "Factura" => $itemHijo["Factura"],                          
                            "FechaFactura" => $itemHijo["FechaFactura"], //Fecha de recepcion,
                            "Codigo" => $itemHijo["Codigo"],
                            "Descripcion_Articulo" => utf8_encode ($itemHijo["Descripcion_Articulo"]),

                        );
                    }

                    // -- Aquí llenamos el array general (En este punto tenemos los datos del padre y del hijo)
                    $new_data[] = array(
                        "OrdenCompra" => $ordenCompra,              // -- PADRE
                        "FechaOrdenCompra" => $fechaOrdenCompra,    // -- PADRE
                        "TipoMoneda" => $TipoMoneda, //PADRE
                        "Estatus" => $Estatus,//PADRE
                        "Factura" => $arrayFactura,//HIJO
                    );
                }

但是此时我遇到了数据未显示在我的数据表中的问题，如果不是一件事，那是另一件事。