<h3>Ansprechpartner</h3>
<p>Hier sind die Ansprechpartner zu sehen:</p>
<div class="button" id="create-service-contact" (click)="create()" *ngIf="hasEditRights">Ansprechpartner anlegen</div>
<form class="searchForm">
    <input type="text" name="search" class="search" (input)="searchFormSubmit($event)" placeholder="Ansprechpartner suchen" />
    <button class="resetSearch" [hidden]="!resetSearchBtn"></button>
</form>
<div class="ag-grid-box">
    <ag-grid-angular
            style="width: 100%;height: 100%;"
            class="ag-theme-balham"
            [defaultColDef]="defaultColDef"
            [rowData]="rowData"
            [columnDefs]="columnDefs"
            [suppressCellSelection]="true"
            [animateRows]="true"
            [enableCellTextSelection]="true"
            (gridReady)="onGridReady($event)"
            (rowClicked)="rowClicked($event)"
    >
    </ag-grid-angular>
</div>

<app-modal [overlay]="true" #modalServiceContactPersonDetail>
    <app-service-contact-person-detail #serviceContactPersonDetail (editServiceContact)="editServiceContactFunction($event)"
                                        (deleteServiceContact)="deleteServiceContactFunction($event)"
                                        (shortcut)="shortcutFunction($event)"></app-service-contact-person-detail>
</app-modal>

<app-modal [overlay]="true" #modalServiceContactPersonEdit>
    <div id="service-contact-person-modal">
        <app-service-contact-person-edit #serviceContactPersonEdit
                                          (createServiceContact)="createServiceContactFunction($event)"></app-service-contact-person-edit>
    </div>
</app-modal>
