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

    <div class="form">
        <div class="row row--last" *ngIf="hasEditRights && appService.getAppUser().id == productionNote.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="production-note-edit-modal">
        <app-production-note-edit #productionNoteEdit (editNote)="editProductionNoteFunction($event)"></app-production-note-edit>
    </div>
</div>
