<div [hidden]="isEditMode">
    <h3>Notiz Detail</h3>
    <p>Erstellt am {{creationDate}} von {{operatorNote.creation_user_firstname}}
        {{operatorNote.creation_user_lastname}}</p>
    <div class="grid">
        <div class="grid-item">
            <dl>
                <dt>Datum:</dt>
                <dd>{{noteDate}}</dd>
                <dt>Betreff:</dt>
                <dd>{{operatorNote.title}}</dd>
                <dt *ngIf="operatorNote.lastname">Gesprächspartner:</dt>
                <dd *ngIf="operatorNote.lastname"><span *ngIf="operatorNote.gender == 'male'">Herr </span>
                    <span *ngIf="operatorNote.gender == 'female'">Frau </span>
                    <span *ngIf="operatorNote.gender == 'diverse'">Divers </span>{{operatorNote.firstname}} {{operatorNote.lastname}}</dd>
                <dt *ngIf="operatorNote.department">Abteilung:</dt>
                <dd *ngIf="operatorNote.department">{{operatorNote.department}}</dd>
                <dt *ngIf="operatorNote.email">E-Mail:</dt>
                <dd *ngIf="operatorNote.email"><a href="mailto:{{operatorNote.email}}">{{operatorNote.email}}</a></dd>
                <dt *ngIf="operatorNote.phone_no">Telefon:</dt>
                <dd *ngIf="operatorNote.phone_no"><a href="tel:{{operatorNote.phone_no}}">{{operatorNote.phone_no}}</a></dd>
                <dt *ngIf="operatorNote.mobile_no">Mobil:</dt>
                <dd *ngIf="operatorNote.mobile_no"><a href="tel:{{operatorNote.mobile_no}}">{{operatorNote.mobile_no}}</a></dd>
                <dt *ngIf="operatorNote.fax_no">Fax:</dt>
                <dd *ngIf="operatorNote.fax_no">{{operatorNote.fax_no}}</dd>
                <dt *ngIf="operatorNote.comment">Notiz:</dt>
                <dd class="pre-wrap" *ngIf="operatorNote.comment">{{operatorNote.comment}}</dd>
            </dl>
        </div>
    </div>

    <div class="form">
        <div class="row row--last" *ngIf="hasEditRights && appService.getAppUser().id == operatorNote.creation_user_id">
            <div class="column">
                <div class="button button--inline" (click)="editEntry()">Eintrag bearbeiten</div>
                <div class="button button--inline" (click)="deleteEntry()">Eintrag löschen</div>
            </div>
        </div>
    </div>
</div>
<div [hidden]="!isEditMode">
    <div id="operator-note-edit-modal">
        <app-operator-note-edit #operatorNoteEdit (editNote)="editOperatorNoteFunction($event)"></app-operator-note-edit>
    </div>
</div>
