如何从递归查询构建嵌套div的精确形式？

Question

I have a somewhat complex recursive postgresql query that pulls in something (I have simplified it for the purposes of this question) like this:

id  depth   path        has_children

1   1       1           true
2   2       1.2         true
3   3       1.2.3       true
4   4       1.2.3.4     true
5   5       1.2.3.4.5   false
6   1       6           true
7   2       6.7         true
8   3       6.7.8       false
9   1       9           false
10  1       10          true
11  2       10.11       false

This is the result as fetched (for those wondering why I parsed some arrays as objects it is because the rows are fetched as objects and I am just duplicating the result):

$tree = array
(
    (object) array
    (
        "id" => 1,
        "depth" => 1,
        "path" => "1",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 2,
        "depth" => 2,
        "path" => "1.2",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 3,
        "depth" => 3,
        "path" => "1.2.3",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 4,
        "depth" => 4,
        "path" => "1.2.3.4",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 5,
        "depth" => 5,
        "path" => "1.2.3.4.5",
        "has_children" => false
    ),

    (object) array
    (
        "id" => 6,
        "depth" => 1,
        "path" => "6",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 7,
        "depth" => 2,
        "path" => "6.7",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 8,
        "depth" => 3,
        "path" => "6.7.8",
        "has_children" => false
    ),

    (object) array
    (
        "id" => 9,
        "depth" => 1,
        "path" => "9",
        "has_children" => false
    ),

    (object) array
    (
        "id" => 10,
        "depth" => 1,
        "path" => "10",
        "has_children" => true
    ),

    (object) array
    (
        "id" => 11,
        "depth" => 2,
        "path" => "10.11",
        "has_children" => false
    )
);

I want to turn the result into this (with the given class names):

<div id="foo">
    <div class="bar">
        <div class="qux">
            <p>1</p>
        </div>

        <div class="baz">
            <div class="qux">
                <p>1.2</p>
            </div>

            <div class="baz">
                <div class="qux">
                    <p>1.2.3</p>
                </div>

                <div class="baz">
                    <div class="qux">
                        <p>1.2.3.4</p>
                    </div>

                    <div class="baz">
                        <div class="qux">
                            <p>1.2.3.4.5</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="bar">
        <div class="qux">
            <p>6</p>
        </div>

        <div class="baz">
            <div class="qux">
                <p>6.7</p>
            </div>

            <div class="baz">
                <div class="qux">
                    <p>6.7.8</p>
                </div>
            </div>
        </div>
    </div>

    <div class="bar">
        <div class="qux">
            <p>9</p>
        </div>
    </div>

    <div class="bar">
        <div class="qux">
            <p>10</p>
        </div>

        <div class="baz">
            <div class="qux">
                <p>10.11</p>
            </div>
        </div>
    </div>
</div>

However, I have gone and confused myself after looking at too many examples involving ul and li. Tweaking such examples for my uses have failed as nested uls and lis are different than nested divs.

I'd like a clean solution that uses a foreach (preferably) or while loop (a recursive function is not necessary). I also do not wish to recreate the result as an multidimensional array.

Answer 1

Probably not the prettiest code, but it outputs exactly as you specified:

<div id="foo">
<?php

$openingElement = true;
$divsOpened = 0;
$indent = 1;

foreach ($tree as $row) {
    if ($openingElement === true) {
        print str_repeat(' ', $indent * 4) . '<div class="bar">' . PHP_EOL;
    } else {
        print str_repeat(' ', $indent * 4) . '<div class="baz">' . PHP_EOL;
    }

    $indent++;
    $divsOpened++;

    print str_repeat(' ', $indent * 4) . '<div class="qux">' . PHP_EOL;
    $indent++;
    print str_repeat(' ', $indent * 4) . '<p>' . $row->path . '</p>' . PHP_EOL;
    $indent--;
    print str_repeat(' ', $indent * 4) . '</div>' . PHP_EOL;

    if ($row->has_children) {
        $openingElement = false;
        print PHP_EOL;
    } else {
        for ($i = $divsOpened; $i > 0; $i--) {
            print str_repeat(' ', $i * 4) . '</div>' . PHP_EOL;
            $indent--;
            $divsOpened--;
        }
        $openingElement = true;
    }
}

?>
</div>