gisaf-frontend/src/app/info/info-misc/info-misc.component.html

<mat-tab-group [class]="inMap ? 'in-map' : ''" fxFlexFill>
    <mat-tab>
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Miscelenous information, depends on the kind of feature">toc</mat-icon>
        </ng-template>
        <table>
            <tr>
                <td>id</td>
                <td>{{ source.featureInfo.id }}</td>
            </tr>
            <tr *ngFor="let infoItem of source.featureInfo.infoItems">
                <td>{{ infoItem.key }}</td>
                <td>{{ infoItem.value }}</td>
            </tr>
            <tr *ngIf="source.featureInfo.externalRecordUrl">
                <td>External link</td>
                <a class='link' href='window.open(source.featureInfo.externalRecordUrl)' target="_blank">{{ source.featureInfo.externalRecordUrl }}</a>
            </tr>
        </table>
    </mat-tab>
    <mat-tab>
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Geography information: coordinates, area, etc">explore</mat-icon>
        </ng-template>
        <table>
            <tr *ngFor="let infoItem of source.featureInfo.geoInfoItems">
                <td>{{ infoItem.key }}</td>
                <td>{{ infoItem.value }}</td>
            </tr>
        </table>
    </mat-tab>
    <mat-tab [disabled]="hasSurveyInfo()">
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Survey information: category, surveyor, equipment, date, accuracy, status, etc">location_searching</mat-icon>
        </ng-template>
        <table>
            <tr *ngFor="let infoItem of source.featureInfo.surveyInfoItems">
                <td>{{ infoItem.key }}</td>
                <td>{{ infoItem.value }}</td>
            </tr>
        </table>
    </mat-tab>
    <mat-tab [disabled]="source.modelInfo.legend.length == 0">
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Legend">dns</mat-icon>
        </ng-template>
        <table>
            <tr *ngFor="let legendItem of source.modelInfo.legend">
                <td>{{ legendItem.key }}</td>
                <td>{{ legendItem.value }}</td>
            </tr>
        </table>
    </mat-tab>
    <!--
    <mat-tab>
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Miscelenous information, depends on the kind of feature">toc</mat-icon>
        </ng-template>
        <gisaf-info-misc fxFlexFill [inMap]='inMap'>
        </gisaf-info-misc>
    </mat-tab>
    -->
    <mat-tab>
        <ng-template mat-tab-label>
            <mat-icon matTooltip="Attachments: files and pictures">attach_file</mat-icon>
        </ng-template>
        <gisaf-info-attachments fxFlexFill
           [source]="source">
        </gisaf-info-attachments>
    </mat-tab>
    <mat-tab *ngFor="let categorizedInfoItems of source.featureInfo.categorizedInfoItems"
        [label]='categorizedInfoItems.name'>
        <table>
            <tr *ngFor="let categorizedInfoItem of categorizedInfoItems.infoItems">
                <th>{{ categorizedInfoItem.key }}</th>
                <td>{{ categorizedInfoItem.value }}</td>
            </tr>
        </table>
    </mat-tab>
</mat-tab-group>