diff --git a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/anhaenge/anhaenge.component.scss b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/anhaenge/anhaenge.component.scss index f1cc0d544e77c7ae3a7b14a54eab5e8ae12923d1..35fb962dd31b4a692426f0849a2f050343508e68 100644 --- a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/anhaenge/anhaenge.component.scss +++ b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/anhaenge/anhaenge.component.scss @@ -4,3 +4,7 @@ max-width: 100%; align-items: flex-start; } + +p { + color: #999; +} diff --git a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.html b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.html index 922ad6a719c7c30fe2dd6a9a04d4db6d4a90d8a0..5138e77216957ebab65c99ad9361dd3c25587f35 100644 --- a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.html +++ b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.html @@ -1,28 +1,36 @@ <ng-container *ngIf="redirectStateResource$ | async as redirectStateResource"> - <mat-spinner *ngIf="redirectStateResource.loaded"></mat-spinner> - <form *ngIf="!redirectStateResource.loaded" class="form" [formGroup]="formService.form" (submit)="submit()"> + <div *ngIf="pendingCommandsStateResource$ | async as pendingCommandsStateResource" class="spinner"> + <p>Vorgang wird weitergeleitet</p> + <mat-spinner + *ngIf="redirectStateResource.loaded || pendingCommandsHasRedirectCommand(pendingCommandsStateResource); else form" + class="spinner"></mat-spinner> + </div> - <goofy-client-text-editor - label="Zuständige Stelle" - [formControlName]="formServiceClass.FIELD_EMAIL" - placeholder="E-Mail Adresse" - [maxlength]="40"> - </goofy-client-text-editor> + <ng-template #form> + <form *ngIf="!redirectStateResource.loaded" class="form" [formGroup]="formService.form" (submit)="submit()"> - <goofy-client-password-editor - label="Passwort" - [formControlName]="formServiceClass.FIELD_PASSWORD" - placeholder="Passwort für die Verschlüsselung"> - </goofy-client-password-editor> + <goofy-client-text-editor + label="Zuständige Stelle" + [formControlName]="formServiceClass.FIELD_EMAIL" + placeholder="E-Mail Adresse" + [maxlength]="40"> + </goofy-client-text-editor> - <goofy-client-button-with-spinner - toolTip="Vorgang weiterleiten" - icon="forward" - type="submit" - text="Weiterleiten" - [stateResource]="redirectStateResource"> - </goofy-client-button-with-spinner> + <goofy-client-password-editor + label="Passwort" + [formControlName]="formServiceClass.FIELD_PASSWORD" + placeholder="Passwort für die Verschlüsselung"> + </goofy-client-password-editor> - </form> + <goofy-client-button-with-spinner + toolTip="Vorgang weiterleiten" + icon="forward" + type="submit" + text="Weiterleiten" + [stateResource]="redirectStateResource"> + </goofy-client-button-with-spinner> + + </form> + </ng-template> </ng-container> diff --git a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.scss b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.scss index 18e27e6e3e557730a7db2f88fc0bb34a05127911..9a78a6e424425d0d92a32aa29e3f741aadf8c831 100644 --- a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.scss +++ b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.scss @@ -1,11 +1,27 @@ .form { display: flex; flex-direction: column; + position: relative; + max-width: 320px; + width: 100%; ::ng-deep { mat-form-field { width: 100%; - max-width: 320px; } } } + +.spinner { + display: inline-flex; + flex-direction: column; + align-items: center; + + .mat-spinner { + margin: 8px; + } + + p { + color: #999; + } +} diff --git a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.ts b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.ts index 39f23f76dcabace5a260875f9c66e51a3c7f5fa7..480fab5ed20cfbb30273fde336d7a19961362394 100644 --- a/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.ts +++ b/goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-redirect/vorgang-redirect.component.ts @@ -12,19 +12,17 @@ import { VorgangRedirectFormService } from './vorgang-redirect.formservice'; styleUrls: ['./vorgang-redirect.component.scss'], providers: [VorgangRedirectFormService] }) -export class VorgangRedirectComponent implements OnChanges{ - - @Input() private vorgang: VorgangResource; - @Input() private pendingCommandsStateResource$: Observable<StateResource<CommandListResource>>; +export class VorgangRedirectComponent implements OnChanges { readonly formServiceClass = VorgangRedirectFormService; - redirectStateResource$: Observable<StateResource<CommandResource>> = of(createEmptyStateResource()); + @Input() private vorgang: VorgangResource; + @Input() private pendingCommandsStateResource$: Observable<StateResource<CommandListResource>>; constructor(public formService: VorgangRedirectFormService) { } ngOnChanges(): void { - if(!isNil(this.vorgang)){ + if (!isNil(this.vorgang)) { this.formService.setVorgang(this.vorgang); } } @@ -32,4 +30,8 @@ export class VorgangRedirectComponent implements OnChanges{ submit(): void { this.redirectStateResource$ = this.formService.submit(); } + + pendingCommandsHasRedirectCommand(pendingCommandsStateResource: StateResource<CommandListResource>) { + console.log(pendingCommandsStateResource.resource) + } }