| <!-- |
| /******************************************************************************** |
| * Copyright © 2018 Mettenmeier GmbH. |
| * |
| * This program and the accompanying materials are made available under the |
| * terms of the Eclipse Public License v. 2.0 which is available at |
| * http://www.eclipse.org/legal/epl-2.0. |
| * |
| * SPDX-License-Identifier: EPL-2.0 |
| ********************************************************************************/ |
| --> |
| <div class="container-fluid"> |
| <form class="mt-3" [formGroup]="form" novalidate> |
| <ngb-accordion #acc="ngbAccordion" activeIds="functionData,dataData"> |
| <!-- DATEN --> |
| <ngb-panel title="Kopfdaten" id="functionData"> |
| <ng-template ngbPanelContent> |
| <div class="row"> |
| <div class="col-md-6"> |
| <div class="form-group row"> |
| <label for="title" class="col-sm-3 col-form-label">Ebene</label> |
| <div class="col-sm-9"> |
| <input type="text" class="form-control" id="statusName" placeholder="Ebene" |
| formControlName="statusName"> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="row"> |
| <div class="col-md-6"> |
| <div class="form-group row"> |
| <label for="title" class="col-sm-3 col-form-label">Titel</label> |
| <div class="col-sm-9"> |
| <input type="text" class="form-control" id="title" placeholder="Titel" |
| formControlName="title"> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-6"> |
| <div class="form-group row"> |
| <label for="comment" class="col-sm-3 col-form-label">Kommentar</label> |
| <div class="col-sm-9"> |
| <input type="text" class="form-control" id="comment" placeholder="Kommentar" |
| formControlName="comment"> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="row"> |
| <div class="col-md-6"> |
| <div class="row" formGroupName="date"> |
| <label class="form-check-label col-form-label col-md-3"> |
| Zeitraum |
| </label> |
| <div class="col-md-4"> |
| <div class="form-group"> |
| <div class="input-group"> |
| <input class="form-control" placeholder="von" name="dp" ngbDatepicker |
| #validFrom="ngbDatepicker" formControlName="validFrom" required id="dateFromInput"> |
| </div> |
| <ok-error [control]="form.controls['validFrom']"></ok-error> |
| </div> |
| </div> |
| <div class="col-md-4"> |
| <div class="form-group"> |
| <div class="input-group"> |
| <input class="form-control" placeholder="bis" name="dp" ngbDatepicker |
| #validFrom="ngbDatepicker" formControlName="validTo" required id="dateFromInput"> |
| </div> |
| <ok-error [control]="form.controls['validTo']"></ok-error> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <hr> |
| <div class="row"> |
| <div class="col-md-6"> |
| <div class="form-group row"> |
| <label for="modifiedBy" class="col-sm-3 col-form-label">Bearbeiter</label> |
| <div class="col-sm-9"> |
| <input type="text" class="form-control" id="modifiedBy" formControlName="modifiedBy"> |
| </div> |
| </div> |
| </div> |
| <div class="col-md-6"> |
| <div class="form-group row"> |
| <label for="modifiedCause" class="col-sm-3 col-form-label">Bearbeitungsgrund</label> |
| <div class="col-sm-9"> |
| <input type="text" class="form-control" id="modifiedCause" formControlName="modifiedCause"> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="row"> |
| <div class="col-md-6"> |
| <div class="row"> |
| <label class="form-check-label col-form-label col-md-3"> |
| Gültigkeit |
| </label> |
| <div class="col-md-4"> |
| <div class="form-group"> |
| <div class="input-group"> |
| <input class="form-control" placeholder="von" name="dp" ngbDatepicker |
| #validFrom="ngbDatepicker" formControlName="modificationDate" required |
| id="dateFromInput"> |
| </div> |
| <ok-error [control]="form.controls['modificationDate']"></ok-error> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </ng-template> |
| </ngb-panel> |
| <ngb-panel title="Daten" id="dataData"> |
| <ng-template ngbPanelContent> |
| <div class="row mb-3"> |
| <div class="col-md-12"> |
| <button class="btn btn-primary" (click)="importIntoPlanning()" id="importIntoPlanning"> |
| in Planebene ausrollen |
| </button> |
| </div> |
| </div> |
| <div class="row" *ngIf="plan"> |
| <div class="col-md-12"> |
| <table class="table stick-table-top" id="table"> |
| <thead> |
| <tr> |
| <th scope="col">{{plan?.planHeader?.label}}</th> |
| <th *ngFor="let group of plan?.planHeader?.listGroups"> |
| {{group.title}} |
| </th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr *ngFor="let row of plan?.listPlanRows" [ngClass]="row.style"> |
| <th scope="row">{{row.label}}</th> |
| <td *ngFor="let listGroupBody of row?.listGroupBodies"> |
| <div *ngFor="let standby of listGroupBody" class="table-cell"> |
| <span class="text-nowrap"> |
| {{(standby.validFrom | date:'HH:mm') +' Uhr - '+ (standby.validTo | |
| date:'HH:mm')+' |
| Uhr'}} {{standby.user.firstname}} {{standby.user.lastname}} |
| </span> |
| </div> |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| </div> |
| </ng-template> |
| </ngb-panel> |
| </ngb-accordion> |
| </form> |
| </div> |