table-selection-dialog.component.html

<div style="display: flex; height: 80vh">
    <div style="flex: 1; overflow-y: auto; padding: 1rem; border-right: 1px solid #ccc">
        <h2>Tabellen auswählen</h2>

        <div *ngFor="let db of data">
            <h3>📦 {{ db.name }}</h3>
            <div *ngFor="let schema of db.schemas">
                <h4>📁 {{ schema.name }}</h4>
                <ul>
                    <li *ngFor="let table of schema.tables">
                        <label>
                            📄 {{ db.name }}.{{ schema.name }}.{{ table.name }}
                        </label>
                        <ul>
                            <li *ngFor="let attr of table.attributes">
                                <label>
                                    <input type="checkbox" [(ngModel)]="attr.selected"/>
                                    🔹 {{ attr.name }} : {{ attr.type }}
                                </label>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>

        <div style="margin-top: 1rem">
            <button (click)="close()">Schließen</button>
            <button (click)="showSelectedMetadata()">Ausgewählte anzeigen</button>
            <button (click)="sendMetadataInfos()">Sende Metadaten</button>
        </div>
    </div>

    <div style="flex: 2.5; padding: 1rem; overflow-x: auto; display: flex; gap: 2rem; border-left: 1px solid #ccc">

        <div *ngFor="let name of getTableNames()">
            <div *ngIf="tablePreviewAll[name]?.length">
                <h3>{{ name }}</h3>

                <table border="1" cellpadding="5" cellspacing="0">
                    <thead>
                    <tr>
                        <th *ngFor="let key of getKeys(tablePreviewAll[name])">{{ key }}</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr *ngFor="let row of tablePreviewAll[name]">
                        <td *ngFor="let key of getKeys(tablePreviewAll[name])">
                            {{ row[key] }}
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>

</div>