How to add a sub-row to a child row in Datatables

I would like to add a new sublevel to my secondary row on a table that I have made with the help of Datatables, this time I want to generate a new child to my secondary row, I attach an example with which I want to explain and that I found from Datatables which is a what I want to get to, I just get a bit confused by the syntax used here and the one I use in my current code.

I attach the Javascript code with which I build my Datatable with a single child row:

/* Formatting function for row details - modify as you need */
function format1(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>
                                Date
                            </th>
                            <th>
                                No. Consecutivo
                            </th>
                        </tr>
                        </thead>
                        <tbody>`;
                            d.Consecutivo.forEach(f => {
                                tabla += `<tr>
                                <td>${f.Date}</td>
                                <td>${f.Consecutivo}</td>                             
                                </tr>`;
                            });
                       tabla += '</tbody></table>';
                       return tabla;

}

$(document).ready(function () {
   $('#example').dataTable( {
        responsive : true,
         ajax : {
             "type": 'POST',
             "url" : './test.php',  
             "dataType": 'JSON',             
             "cache": false,
             "data": {
                 'param' : 1,                       
             },
         },   
         columns: [          
             {
                 "className":      'details-control',
                 "orderable":      false,
                 "data":           null,
                 "defaultContent": ''
             },
             { "data" : "PurchaseOrder" },
             { "data" : "DatePurchaseOrder" },
             { "data" : "Total"},
             { "data" : "Currency" },
             { "data" : "Status" },                  
        ],
         order : [[1, 'desc']],
    } );

    
    // Add event listener for opening and closing details
    $('#example tbody').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(format1(row.data())).show();
            tr.addClass('shown');
        }
    });
}); 

I would appreciate if someone can give me some guidance on this topic.

Update 1:

Seeing that some are a bit confused by the purpose of my question, I took the trouble to make a small example by hand of what I want to get to.

I explain a little more, the header where the PurchaseOrder is located is the parent row, the No. Consecutivo header is the daughter row of the parent PurchaseOrder row and the Date header is the child row of the No. Consecutivo

Update 2:

Between searching and searching for documentation I came across another example, but it still doesn't give me a clearer idea, I don't know if it's necessary to modify the code I'm using and adapt it to what I've found in the examples or with the code I'm using. what I have planned can be done.

from How to add a sub-row to a child row in Datatables