diff --git a/alfa-client/apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component.ts b/alfa-client/apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component.ts
index 7f5d897628057b0c929c61fd9596ad7de3dad49a..34702bb369f5ae2c4bb777ea001a14562c8d5b9c 100644
--- a/alfa-client/apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component.ts
+++ b/alfa-client/apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component.ts
@@ -5,9 +5,9 @@ export class ForwardingDialogE2EComponent {
private readonly forwardingButton: string = 'forwarding-dialog-forwarding-button';
private readonly searchText: string = 'instant_search-text-input';
private readonly searchEntry: string = 'item-button';
- private readonly forwardingItem: string = 'forwarding-item';
+ private readonly selectedSearchItem: string = 'selected-search-item';
private readonly changeButton: string = 'forwarding-item-change-button';
- private readonly zufiSearch: string = 'zufi-search';
+ private readonly organisationsEinheitSearch: string = 'organisations-einheit-search';
public getRoot() {
return cy.getTestElement(this.root);
@@ -37,15 +37,15 @@ export class ForwardingDialogE2EComponent {
cy.getTestElement(this.searchEntry).eq(index).click();
}
- public getForwardingItem() {
- return cy.getTestElement(this.forwardingItem);
+ public getSelectedSearchItem() {
+ return cy.getTestElement(this.selectedSearchItem);
}
public getChangeButton() {
return cy.getTestElement(this.changeButton);
}
- public getZufiSearch() {
- return cy.getTestElement(this.zufiSearch);
+ public getOrganisationsEinheitSearch() {
+ return cy.getTestElement(this.organisationsEinheitSearch);
}
}
diff --git a/alfa-client/apps/alfa-e2e/src/e2e/main-tests/vorgang-detailansicht/vorgang-forwarding.cy.ts b/alfa-client/apps/alfa-e2e/src/e2e/main-tests/vorgang-detailansicht/vorgang-forwarding.cy.ts
index d91019905c1bc53a44fb0a28e0fb882a416933f3..8634b339b87e025f62705edaefa760c86c16575b 100644
--- a/alfa-client/apps/alfa-e2e/src/e2e/main-tests/vorgang-detailansicht/vorgang-forwarding.cy.ts
+++ b/alfa-client/apps/alfa-e2e/src/e2e/main-tests/vorgang-detailansicht/vorgang-forwarding.cy.ts
@@ -2,6 +2,7 @@ import { registerLocaleData } from '@angular/common';
import localeDe from '@angular/common/locales/de';
import localeDeExtra from '@angular/common/locales/extra/de';
import { VorgangFormularButtonsE2EComponent } from 'apps/alfa-e2e/src/components/vorgang/vorgang-formular-buttons.e2e.components';
+import { ForwardingDialogE2EComponent } from 'apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component';
import { VorgangListE2EComponent } from '../../../components/vorgang/vorgang-list.e2e.component';
import { E2EVorgangNavigator } from '../../../helper/vorgang/vorgang.navigator';
import { E2EVorgangVerifier } from '../../../helper/vorgang/vorgang.verifier';
@@ -9,10 +10,9 @@ import { VorgangE2E } from '../../../model/vorgang';
import { MainPage, waitForSpinnerToDisappear } from '../../../page-objects/main.po';
import { VorgangPage } from '../../../page-objects/vorgang.po';
import { dropCollections } from '../../../support/cypress-helper';
-import { beDisabled, contains, exist, notBeDisabled, notExist } from '../../../support/cypress.util';
+import { beAriaDisabled, contains, exist, notBeAriaDisabled, notExist } from '../../../support/cypress.util';
import { loginAsPeter, loginAsSabine } from '../../../support/user-util';
import { createVorgang, initVorgaenge } from '../../../support/vorgang-util';
-import { ForwardingDialogE2EComponent } from 'apps/alfa-e2e/src/components/vorgang/vorgang-forwarding-dialog.e2e.component';
registerLocaleData(localeDe, 'de', localeDeExtra);
@@ -59,12 +59,12 @@ describe('Vorgang weiterleiten', () => {
exist(forwardingDialog.getRoot());
});
- it('should have zufi search', () => {
- exist(forwardingDialog.getZufiSearch());
+ it('should have organisations einheit search', () => {
+ exist(forwardingDialog.getOrganisationsEinheitSearch());
});
it('should have disabled forwarding button', () => {
- beDisabled(forwardingDialog.getForwardingButton());
+ beAriaDisabled(forwardingDialog.getForwardingButton());
});
it('should close dialog on escape', () => {
@@ -87,30 +87,30 @@ describe('Vorgang weiterleiten', () => {
notExist(forwardingDialog.getRoot());
});
- it('should show forwarding item on search select', () => {
+ it('should show selected search item on search select', () => {
vorgangFormularButtons.getForwardButton().click();
forwardingDialog.search(organisationsEinheitName);
forwardingDialog.clickSearchEntry(0);
- exist(forwardingDialog.getForwardingItem());
- contains(forwardingDialog.getForwardingItem(), organisationsEinheitName);
- contains(forwardingDialog.getForwardingItem(), organisationsEinheitAddress);
+ exist(forwardingDialog.getSelectedSearchItem());
+ contains(forwardingDialog.getSelectedSearchItem(), organisationsEinheitName);
+ contains(forwardingDialog.getSelectedSearchItem(), organisationsEinheitAddress);
});
it('should not show zufi search on search select', () => {
- notExist(forwardingDialog.getZufiSearch());
+ notExist(forwardingDialog.getOrganisationsEinheitSearch());
});
it('should not disable forwarding button on search select', () => {
- notBeDisabled(forwardingDialog.getForwardingButton());
+ notBeAriaDisabled(forwardingDialog.getForwardingButton());
});
- it('should clear forwarding item on change button click', () => {
+ it('should clear selected search item on change button click', () => {
forwardingDialog.getChangeButton().click();
- notExist(forwardingDialog.getForwardingItem());
- exist(forwardingDialog.getZufiSearch());
- beDisabled(forwardingDialog.getForwardingButton());
+ notExist(forwardingDialog.getSelectedSearchItem());
+ exist(forwardingDialog.getOrganisationsEinheitSearch());
+ beAriaDisabled(forwardingDialog.getForwardingButton());
});
it('should not display Weiterleiten button in status Angenommen', () => {
diff --git a/alfa-client/apps/alfa-e2e/src/helper/forwarding/forwarding.executor.ts b/alfa-client/apps/alfa-e2e/src/helper/forwarding/forwarding.executor.ts
index 22295bb180d00c9d23b787fde72a001bea29cab2..659d24215d7275c70ae2ee1b710f196dd0b81a46 100644
--- a/alfa-client/apps/alfa-e2e/src/helper/forwarding/forwarding.executor.ts
+++ b/alfa-client/apps/alfa-e2e/src/helper/forwarding/forwarding.executor.ts
@@ -9,7 +9,7 @@ export class E2EForwardingExecutor {
this.forwardingDialog.getSearchText().type(organisationsEinheit);
waitForSpinnerToDisappear();
this.forwardingDialog.clickSearchEntry(0);
- exist(this.forwardingDialog.getForwardingItem());
+ exist(this.forwardingDialog.getSelectedSearchItem());
this.forwardingDialog.getForwardingButton().click();
waitForSpinnerToDisappear();
}
diff --git a/alfa-client/apps/alfa-e2e/src/support/cypress.util.ts b/alfa-client/apps/alfa-e2e/src/support/cypress.util.ts
index f62a66e73e504ddd9952afd438ecdd7cf242866a..768db5ed90ce7662d1e2358b58aff85d86655f6b 100644
--- a/alfa-client/apps/alfa-e2e/src/support/cypress.util.ts
+++ b/alfa-client/apps/alfa-e2e/src/support/cypress.util.ts
@@ -97,12 +97,12 @@ export function notBeChecked(element: any): void {
element.should('not.be.checked');
}
-export function beDisabled(element: any): void {
- element.should('be.disabled');
+export function beAriaDisabled(element: any): void {
+ element.should('have.attr', 'aria-disabled', 'true');
}
-export function notBeDisabled(element: any): void {
- element.should('not.be.disabled');
+export function notBeAriaDisabled(element: any): void {
+ element.should('have.attr', 'aria-disabled', 'false');
}
//TODO: "first()" rausnehmen -> im html eine entprechende data-test-id ansprechen?! | trennen in "get" und "verify"
diff --git a/alfa-client/libs/design-component/src/lib/button-with-spinner/button-with-spinner.component.ts b/alfa-client/libs/design-component/src/lib/button-with-spinner/button-with-spinner.component.ts
index 4c1ebd4cfe3750fb12e7f5e05d8562fd49559b63..79e617880c423eefeb7ce3e3e41877c32154e29f 100644
--- a/alfa-client/libs/design-component/src/lib/button-with-spinner/button-with-spinner.component.ts
+++ b/alfa-client/libs/design-component/src/lib/button-with-spinner/button-with-spinner.component.ts
@@ -45,7 +45,7 @@ type ButtonVariants = VariantProps<typeof buttonVariants>;
[dataTestId]="dataTestId"
[isLoading]="isLoading"
[disabled]="disabled"
- (click)="clickEmitter.emit()"
+ (clickEmitter)="clickEmitter.emit()"
>
<ng-content icon select="[icon]" />
</ods-button>`,
diff --git a/alfa-client/libs/design-component/src/lib/cancel-dialog-button/cancel-dialog-button.component.ts b/alfa-client/libs/design-component/src/lib/cancel-dialog-button/cancel-dialog-button.component.ts
index df1f5fa4b1732a9b60879f6353ec9f006832cb5f..03ac3acbe39b7907df7af242da47d4d3f70a5fa3 100644
--- a/alfa-client/libs/design-component/src/lib/cancel-dialog-button/cancel-dialog-button.component.ts
+++ b/alfa-client/libs/design-component/src/lib/cancel-dialog-button/cancel-dialog-button.component.ts
@@ -27,7 +27,11 @@ import { ButtonComponent, CloseIconComponent, TooltipDirective } from '@ods/syst
text="Abbrechen"
dataTestId="cancel-dialog-button"
data-test-id="cancel-dialog-button-container"
- />
+ >
+ <ng-container icon>
+ <ods-close-icon class="fill-primary" />
+ </ng-container>
+ </ods-button>
}`,
})
export class CancelDialogButtonComponent {
diff --git a/alfa-client/libs/design-system/src/index.ts b/alfa-client/libs/design-system/src/index.ts
index d05d44db8ce46777152a6f48145ac2000dd5d0a3..c17fdb29f53e0948d6f7b3a61d0d3725c18e2ffc 100644
--- a/alfa-client/libs/design-system/src/index.ts
+++ b/alfa-client/libs/design-system/src/index.ts
@@ -28,6 +28,7 @@ export * from './lib/bescheid-status-text/bescheid-status-text.component';
export * from './lib/bescheid-wrapper/bescheid-wrapper.component';
export * from './lib/button-card/button-card.component';
export * from './lib/button/button.component';
+export * from './lib/dialog-container/dialog-container.component';
export * from './lib/dropdown-menu/dropdown-menu-button-item/dropdown-menu-button-item.component';
export * from './lib/dropdown-menu/dropdown-menu-item/dropdown-menu-item.component';
export * from './lib/dropdown-menu/dropdown-menu-link-item/dropdown-menu-link-item.component';
@@ -41,6 +42,7 @@ export * from './lib/form/file-upload-button/file-upload-button.component';
export * from './lib/form/radio-button-card/radio-button-card.component';
export * from './lib/form/text-input/text-input.component';
export * from './lib/form/textarea/textarea.component';
+export * from './lib/forwarding-item/forwarding-item-info/forwarding-item-info.component';
export * from './lib/forwarding-item/forwarding-item.component';
export * from './lib/icons/accessibility-icon/accessibility-icon.component';
export * from './lib/icons/account-circle-icon/account-circle-icon.component';
diff --git a/alfa-client/libs/design-system/src/lib/button/button.component.spec.ts b/alfa-client/libs/design-system/src/lib/button/button.component.spec.ts
index ecd327e0aa7ec13701a789698d80c163ea5d3dfa..fc5322e9e5371ac6f5a6dcc897224fce9b0a4c5e 100644
--- a/alfa-client/libs/design-system/src/lib/button/button.component.spec.ts
+++ b/alfa-client/libs/design-system/src/lib/button/button.component.spec.ts
@@ -41,4 +41,26 @@ describe('ButtonComponent', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
+
+ describe('component', () => {
+ beforeEach(() => {
+ component.clickEmitter.emit = jest.fn();
+ });
+
+ describe('onClick', () => {
+ it('should emit click', () => {
+ component.onClick();
+
+ expect(component.clickEmitter.emit).toHaveBeenCalled();
+ });
+
+ it('should NOT emit click if button is disabled', () => {
+ component.disabled = true;
+
+ component.onClick();
+
+ expect(component.clickEmitter.emit).not.toHaveBeenCalled();
+ });
+ });
+ });
});
diff --git a/alfa-client/libs/design-system/src/lib/button/button.component.ts b/alfa-client/libs/design-system/src/lib/button/button.component.ts
index 47e76172adb5e6f9600be54291ee79a841defb78..3f88a32abc1bdb41fc4c12cabc4543f7c2def3c1 100644
--- a/alfa-client/libs/design-system/src/lib/button/button.component.ts
+++ b/alfa-client/libs/design-system/src/lib/button/button.component.ts
@@ -31,18 +31,18 @@ import { SpinnerIconComponent } from '../icons/spinner-icon/spinner-icon.compone
export const buttonVariants = cva(
[
'flex items-center gap-3 rounded-lg text-sm font-medium box-border',
- 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',
+ 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 outline-focus',
],
{
variants: {
variant: {
- primary: 'bg-primary text-whitetext shadow-md hover:enabled:bg-primary-hover focus-visible:bg-primary-hover',
+ primary: 'bg-primary text-whitetext shadow-md hover:bg-primary-hover focus-visible:bg-primary-hover',
outline:
- 'border border-primary bg-background-50 text-primary shadow-md hover:enabled:bg-ghost-hover focus-visible:bg-ghost-hover focus-visible:border-background-200',
+ 'border border-primary bg-background-50 text-primary shadow-md hover:bg-ghost-hover focus-visible:bg-ghost-hover focus-visible:border-background-200',
outline_error:
- 'border border-error bg-background-50 text-error shadow-md hover:enabled:bg-ghost-hover focus-visible:bg-ghost-hover focus-visible:border-background-200',
+ 'border border-error bg-background-50 text-error shadow-md hover:bg-ghost-hover focus-visible:bg-ghost-hover focus-visible:border-background-200',
ghost:
- 'border border-transparent hover:enabled:bg-ghost-hover text-primary focus-visible:border-background-200 focus-visible:bg-ghost-hover font-semibold [&]:focus-visible:outline-offset-1',
+ 'border border-transparent hover:bg-ghost-hover text-primary focus-visible:border-background-200 focus-visible:bg-ghost-hover font-semibold [&]:focus-visible:outline-offset-1',
},
size: {
medium: 'h-9 py-2 px-4 min-w-32',
@@ -50,11 +50,11 @@ export const buttonVariants = cva(
},
disabled: {
false: null,
- true: ['opacity-70', 'cursor-not-allowed'],
+ true: '[&]:outline-disabled-button cursor-not-allowed',
},
destructive: {
- false: 'outline-focus',
- true: 'outline-destructive',
+ false: null,
+ true: '[&]:outline-destructive',
},
},
defaultVariants: {
@@ -66,19 +66,34 @@ export const buttonVariants = cva(
{
variant: 'primary',
destructive: true,
- class:
- '[&]:hover:enabled:bg-destructive-primary-hover [&]:bg-destructive [&]:outline-destructive [&]:focus-visible:bg-destructive-primary-hover',
+ class: '[&]:hover:bg-destructive-primary-hover [&]:bg-destructive [&]:focus-visible:bg-destructive-primary-hover',
},
{
variant: 'outline',
destructive: true,
class:
- '[&]:border-destructive [&]:text-destructive [&]:hover:enabled:bg-destructive-hover [&]:focus-visible:bg-destructive-hover',
+ '[&]:border-destructive [&]:text-destructive [&]:hover:bg-destructive-hover [&]:focus-visible:bg-destructive-hover',
},
{
variant: 'ghost',
destructive: true,
- class: '[&]:text-destructive [&]:hover:enabled:bg-destructive-hover [&]:focus-visible:bg-destructive-hover',
+ class: '[&]:text-destructive [&]:hover:bg-destructive-hover [&]:focus-visible:bg-destructive-hover',
+ },
+ {
+ variant: 'primary',
+ disabled: true,
+ class: '[&]:bg-disabled-button [&]:hover:bg-disabled-button/90 [&]:focus-visible:bg-disabled-button/90',
+ },
+ {
+ variant: 'outline',
+ disabled: true,
+ class:
+ '[&]:text-disabled-button [&]:border-disabled-button [&]:hover:bg-disabled-button/10 [&]:focus-visible:bg-disabled-button/10',
+ },
+ {
+ variant: 'ghost',
+ disabled: true,
+ class: '[&]:text-disabled-button [&]:hover:bg-disabled-button/10 [&]:focus-visible:bg-disabled-button/10',
},
],
},
@@ -89,27 +104,31 @@ export type ButtonVariants = VariantProps<typeof buttonVariants>;
selector: 'ods-button',
standalone: true,
imports: [CommonModule, SpinnerIconComponent],
- template: ` <button
+ template: `<button
type="button"
- [ngClass]="buttonVariants({ size, variant, disabled, destructive })"
- [disabled]="isDisabled"
+ [ngClass]="buttonVariants({ size, variant, disabled: isDisabled, destructive })"
[attr.aria-disabled]="isDisabled"
[attr.aria-label]="text"
[attr.data-test-id]="dataTestId"
[attr.data-test-class]="dataTestClass"
- (click)="clickEmitter.emit()"
+ (click)="onClick()"
>
- <ng-content *ngIf="!isLoading" select="[icon]"></ng-content>
- <ods-spinner-icon *ngIf="isLoading" [size]="spinnerSize" data-test-class="spinner"></ods-spinner-icon>
- <div *ngIf="text" class="flex-grow">{{ text }}</div>
+ @if (isLoading) {
+ <ods-spinner-icon [class]="isDisabled && 'fill-disabled-button'" [size]="spinnerSize" data-test-class="spinner" />
+ } @else {
+ <ng-content select="[icon]" />
+ }
+ @if (text) {
+ <p class="flex-grow">{{ text }}</p>
+ }
</button>`,
})
export class ButtonComponent {
@Input() text: string = '';
@Input() dataTestId: string = '';
@Input() dataTestClass: string = '';
- @Input() disabled: boolean = false;
- @Input() isLoading: boolean = false;
+ @Input({ transform: booleanAttribute }) disabled: boolean = false;
+ @Input({ transform: booleanAttribute }) isLoading: boolean = false;
@Input({ transform: booleanAttribute }) destructive: boolean = false;
@Input() variant: ButtonVariants['variant'];
@Input() size: ButtonVariants['size'];
@@ -121,5 +140,11 @@ export class ButtonComponent {
return this.disabled || this.isLoading;
}
+ public onClick(): void {
+ if (!this.isDisabled) {
+ this.clickEmitter.emit();
+ }
+ }
+
readonly buttonVariants = buttonVariants;
}
diff --git a/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.spec.ts b/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d1f894406fa1f6c9468c1d7ba356a56947a05c25
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DialogContainerComponent } from './dialog-container.component';
+
+describe('DialogContainerComponent', () => {
+ let component: DialogContainerComponent;
+ let fixture: ComponentFixture<DialogContainerComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [DialogContainerComponent]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(DialogContainerComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.ts b/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3df7faf24a83fb4ed3965b741004cdc53aaeabb6
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/dialog-container/dialog-container.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'ods-dialog-container',
+ standalone: true,
+ imports: [],
+ template: `
+ <div class="static flex w-[calc(100vw-2rem)] justify-center">
+ <div class="flex max-w-4xl grow flex-col rounded-lg bg-background-50 p-6 shadow-md">
+ <ng-content />
+ </div>
+ </div>
+ `,
+})
+export class DialogContainerComponent {}
diff --git a/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts b/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts
index cd01ba0190c68b4f9fec34f3e94496e6d86f73aa..1740d7ba39080e17caa742c931fa9267bffaf0a0 100644
--- a/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts
+++ b/alfa-client/libs/design-system/src/lib/form/text-input/text-input.component.ts
@@ -57,27 +57,27 @@ type TextInputVariants = VariantProps<typeof textInputVariants>;
<label *ngIf="showLabel" [for]="id" class="text-md mb-2 block font-medium text-text">
{{ inputLabel }}<ng-container *ngIf="required"><i aria-hidden="true">*</i></ng-container>
</label>
- <div class="mt-2">
- <div *ngIf="withPrefix" class="pointer-events-none absolute bottom-2 left-2 flex size-6 items-center justify-center">
- <ng-content select="[prefix]" />
- </div>
- <input
- type="text"
- [id]="id"
- [formControl]="fieldControl"
- [ngClass]="[textInputVariants({ variant }), withPrefix ? 'pl-10' : '', withSuffix ? 'pr-10' : '']"
- [placeholder]="placeholder"
- [autocomplete]="autocomplete"
- [attr.aria-required]="required"
- [attr.aria-invalid]="variant === 'error'"
- [attr.data-test-id]="_dataTestId + '-text-input'"
- (click)="clickEmitter.emit()"
- #inputElement
- />
- <div *ngIf="withSuffix" class="absolute bottom-2 right-2 flex size-6 items-center justify-center">
- <ng-content select="[suffix]" />
- </div>
+
+ <div *ngIf="withPrefix" class="pointer-events-none absolute bottom-2 left-2 flex size-6 items-center justify-center">
+ <ng-content select="[prefix]" />
+ </div>
+ <input
+ type="text"
+ [id]="id"
+ [formControl]="fieldControl"
+ [ngClass]="[textInputVariants({ variant }), withPrefix ? 'pl-10' : '', withSuffix ? 'pr-10' : '']"
+ [placeholder]="placeholder"
+ [autocomplete]="autocomplete"
+ [attr.aria-required]="required"
+ [attr.aria-invalid]="variant === 'error'"
+ [attr.data-test-id]="_dataTestId + '-text-input'"
+ (click)="clickEmitter.emit()"
+ #inputElement
+ />
+ <div *ngIf="withSuffix" class="absolute bottom-2 right-2 flex size-6 items-center justify-center">
+ <ng-content select="[suffix]" />
</div>
+
<ng-content select="[error]"></ng-content>
</div>
`,
diff --git a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.spec.ts b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..aa29de43383f328ce1179743c2fb6bbd0b435954
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ForwardingItemInfoComponent } from './forwarding-item-info.component';
+
+describe('ForwardingItemInfoComponent', () => {
+ let component: ForwardingItemInfoComponent;
+ let fixture: ComponentFixture<ForwardingItemInfoComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [ForwardingItemInfoComponent],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(ForwardingItemInfoComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.ts b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..abace4dec64981bfc6fd2e5cd8e3c66abeca881e
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item-info/forwarding-item-info.component.ts
@@ -0,0 +1,12 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+ selector: 'ods-forwarding-item-info',
+ standalone: true,
+ template: `<p class="font-medium">{{ label }}</p>
+ <p>{{ address }}</p>`,
+})
+export class ForwardingItemInfoComponent {
+ @Input({ required: true }) label!: string;
+ @Input({ required: true }) address!: string;
+}
diff --git a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts
index 7f8ebfd800c662910c5ec0905935c3d12487b7f3..e1322cfcdef6610df2a458541bcd3436fc12d7d2 100644
--- a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts
+++ b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.component.ts
@@ -21,7 +21,6 @@
* Die sprachspezifischen Genehmigungen und Beschränkungen
* unter der Lizenz sind dem Lizenztext zu entnehmen.
*/
-import { CommonModule } from '@angular/common';
import { Component, Input } from '@angular/core';
import { ForwardVorgangIconComponent } from '../icons/forward-vorgang-icon/forward-vorgang-icon.component';
@@ -33,25 +32,18 @@ export enum ForwardingDirection {
@Component({
selector: 'ods-forwarding-item',
standalone: true,
- imports: [CommonModule, ForwardVorgangIconComponent],
- template: `<div
- class="flex flex-col items-start justify-between gap-2 rounded-lg border border-grayborder p-3 md:flex-row md:items-center md:gap-0"
- >
- <div class="flex gap-3">
- <ods-forward-vorgang-icon class="fill-text" />
- <p class="text-gray-500">{{ direction }}:</p>
- <div>
- <p class="font-medium">{{ label }}</p>
- <p>{{ address }}</p>
+ imports: [ForwardVorgangIconComponent],
+ template: ` <div class="h-full rounded-lg border border-grayborder">
+ <div class="flex flex-col gap-3 p-3 align-top sm:flex-row">
+ <div class="flex gap-3">
+ <ods-forward-vorgang-icon class="fill-text" />
+ <div class="font-medium text-gray-500">{{ direction }}:</div>
</div>
- </div>
- <div class="text-end empty:hidden">
- <ng-content />
+ <div class="grow"><ng-content /></div>
+ <div class="flex items-center"><ng-content select="[end-content]" /></div>
</div>
</div>`,
})
export class ForwardingItemComponent {
- @Input({ required: true }) label!: string;
- @Input({ required: true }) address!: string;
@Input() direction: ForwardingDirection = ForwardingDirection.TO;
}
diff --git a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.stories.ts b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.stories.ts
index 53d2116e9f314c9e2194cd8a9ff7c72e39dd1b12..d70b202b1147e34a030258198844ac19afc7b1b6 100644
--- a/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.stories.ts
+++ b/alfa-client/libs/design-system/src/lib/forwarding-item/forwarding-item.stories.ts
@@ -24,11 +24,9 @@
import { argsToTemplate, moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
import { ButtonComponent } from '../button/button.component';
+import { ForwardingItemInfoComponent } from './forwarding-item-info/forwarding-item-info.component';
import { ForwardingDirection, ForwardingItemComponent } from './forwarding-item.component';
-const label: string = 'Bund für Umwelt und Naturschutz Kreisgruppe Kiel';
-const address: string = 'Kaiserstraße 25, 12443 Kiel';
-
const meta: Meta<ForwardingItemComponent> = {
title: 'Forwarding item',
component: ForwardingItemComponent,
@@ -41,7 +39,7 @@ const meta: Meta<ForwardingItemComponent> = {
},
decorators: [
moduleMetadata({
- imports: [ForwardingItemComponent, ButtonComponent],
+ imports: [ForwardingItemComponent, ForwardingItemInfoComponent, ButtonComponent],
}),
],
excludeStories: /.*Data$/,
@@ -53,40 +51,39 @@ type Story = StoryObj<ForwardingItemComponent>;
export const Default: Story = {
args: {
- label: label,
- address: address,
direction: ForwardingDirection.TO,
},
argTypes: {
direction: { control: 'select', options: [ForwardingDirection.TO, ForwardingDirection.FROM] },
},
+ render: () => ({
+ template: `<ods-forwarding-item>
+ <ods-forwarding-item-info label="Bund für Umwelt und Naturschutz Kreisgruppe Kiel" address="Kaiserstraße 25, 12443 Kiel" />
+ </ods-forwarding-item>`,
+ }),
};
export const WithButton: Story = {
- args: {
- label: label,
- address: address,
- },
-
- render: (args: ForwardingItemComponent) => ({
- props: args,
- template: `<ods-forwarding-item ${argsToTemplate(args)}>
- <ods-button variant="outline" text="Stelle ändern" />
+ render: () => ({
+ template: `<ods-forwarding-item>
+ <ods-forwarding-item-info label="Bund für Umwelt und Naturschutz Kreisgruppe Kiel" address="Kaiserstraße 25, 12443 Kiel" />
+ <ods-button variant="outline" text="Stelle ändern" end-content />
</ods-forwarding-item>`,
}),
};
export const WithCreationInfo: Story = {
args: {
- label: label,
- address: address,
direction: ForwardingDirection.FROM,
},
render: (args: ForwardingItemComponent) => ({
props: args,
template: `<ods-forwarding-item ${argsToTemplate(args)}>
- <p>20. Dez. 09:35</p>
- <p class="text-sm">Karin Wanowski-Müller</p>
+ <ods-forwarding-item-info label="Bund für Umwelt und Naturschutz Kreisgruppe Kiel" address="Kaiserstraße 25, 12443 Kiel" />
+ <div end-content>
+ <p>20. Dez. 09:35</p>
+ <p class="text-sm">Karin Wanowski-Müller</p>
+ </div>
</ods-forwarding-item>`,
}),
};
diff --git a/alfa-client/libs/design-system/src/lib/icons/spinner-icon/spinner-icon.component.ts b/alfa-client/libs/design-system/src/lib/icons/spinner-icon/spinner-icon.component.ts
index d361292b08e026c2f05e245276dae53b82fa2805..20ca2f1c2affe64e1a2aab8b81576c2c40a68e3e 100644
--- a/alfa-client/libs/design-system/src/lib/icons/spinner-icon/spinner-icon.component.ts
+++ b/alfa-client/libs/design-system/src/lib/icons/spinner-icon/spinner-icon.component.ts
@@ -24,6 +24,7 @@
import { NgClass } from '@angular/common';
import { Component, Input } from '@angular/core';
+import { twMerge } from 'tailwind-merge';
import { IconVariants, iconVariants } from '../iconVariants';
@Component({
@@ -33,8 +34,7 @@ import { IconVariants, iconVariants } from '../iconVariants';
template: `
<svg
xmlns="http://www.w3.org/2000/svg"
- [ngClass]="iconVariants({ size })"
- class="animate-spin fill-primary text-gray-200 dark:text-gray-600"
+ [ngClass]="twMerge('animate-spin fill-primary text-gray-200 dark:text-gray-600', iconVariants({ size }), class)"
aria-hidden="true"
viewBox="0 0 100 100"
fill="none"
@@ -53,6 +53,8 @@ import { IconVariants, iconVariants } from '../iconVariants';
})
export class SpinnerIconComponent {
@Input() size: IconVariants['size'] = 'full';
+ @Input() class: string;
- iconVariants = iconVariants;
+ readonly iconVariants = iconVariants;
+ readonly twMerge = twMerge;
}
diff --git a/alfa-client/libs/design-system/src/lib/instant-search/search-result-item/search-result-item.component.ts b/alfa-client/libs/design-system/src/lib/instant-search/search-result-item/search-result-item.component.ts
index 3f5364877b5c08806ff6990851a7863abdcd74a5..3d765154891b5f39c3168a8a07e39c973eee840b 100644
--- a/alfa-client/libs/design-system/src/lib/instant-search/search-result-item/search-result-item.component.ts
+++ b/alfa-client/libs/design-system/src/lib/instant-search/search-result-item/search-result-item.component.ts
@@ -32,7 +32,7 @@ import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@
*ngIf="title"
[ngClass]="[
'flex w-full justify-between border-2 border-transparent px-6 py-3',
- 'hover:border-focus focus:border-focus focus:outline-none',
+ 'hover:bg-background-150 focus:border-focus focus:outline-none',
]"
role="listitem"
tabindex="-1"
diff --git a/alfa-client/libs/design-system/src/lib/tailwind-preset/root.css b/alfa-client/libs/design-system/src/lib/tailwind-preset/root.css
index a3c8f7b01b5e1b8342761bf3190841ef059b5cc8..333257d60e54034a148f8f864ae42132d1a7643e 100644
--- a/alfa-client/libs/design-system/src/lib/tailwind-preset/root.css
+++ b/alfa-client/libs/design-system/src/lib/tailwind-preset/root.css
@@ -18,6 +18,7 @@
--color-disabled: 206 14% 95%;
--color-disabled-dark: 208 12% 65%;
+ --color-disabled-button: 0 0% 42%;
--color-destructive: 360, 71%, 49%, 1;
--color-destructive-hover: 360, 71%, 49%, 0.07;
@@ -59,6 +60,7 @@
--color-disabled: 206 14% 15%;
--color-disabled-dark: 208 12% 33%;
+ --color-disabled-button: 0 0% 68%;
--color-destructive: 360, 71%, 49%, 1;
--color-destructive-hover: 360, 71%, 49%, 0.2;
diff --git a/alfa-client/libs/design-system/src/lib/tailwind-preset/tailwind.config.js b/alfa-client/libs/design-system/src/lib/tailwind-preset/tailwind.config.js
index cf2abfcb2f32821bcb410f4d9bcd817f2aa2efb0..9c5ba7a4e53f673e8ac6c1b27e08f63936647d7f 100644
--- a/alfa-client/libs/design-system/src/lib/tailwind-preset/tailwind.config.js
+++ b/alfa-client/libs/design-system/src/lib/tailwind-preset/tailwind.config.js
@@ -146,6 +146,7 @@ module.exports = {
focus: 'hsl(var(--color-focus))',
disabled: {
dark: 'hsl(var(--color-disabled-dark) / <alpha-value>)',
+ button: 'hsl(var(--color-disabled-button) / <alpha-value>)',
DEFAULT: 'hsl(var(--color-disabled) / <alpha-value>)',
},
destructive: 'hsla(var(--color-destructive))',
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.html
index 5bf44a14c8978d8fea1e07d51b0ccc1279935ca4..6995cd3356290db9eb8f6011c21e013009b29734 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.html
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.html
@@ -1,11 +1,12 @@
<ods-button-with-spinner
[stateResource]="stateResource"
[disabled]="disabled"
+ [tooltip]="tooltip"
(clickEmitter)="clickEmitter.emit()"
- text="Weiterleiten"
- variant="outline"
+ text="Jetzt weiterleiten"
+ tooltipPosition="above"
dataTestId="forwarding-dialog-forwarding-button"
data-test-id="forwarding-button-container"
>
- <ods-forward-vorgang-icon icon class="fill-primary" />
+ <ods-forward-vorgang-icon icon class="fill-whitetext" />
</ods-button-with-spinner>
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.spec.ts
index 9e9a9d2118e1a9758f7ba58715f822822ead4cbf..661105c1ad208f595ae5b3f7f1158e0529d9fe2f 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.spec.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.spec.ts
@@ -1,3 +1,4 @@
+import { EMPTY_STRING } from '@alfa-client/tech-shared';
import { dispatchEventFromFixture, MockEvent } from '@alfa-client/test-utils';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ButtonWithSpinnerComponent } from '@ods/component';
@@ -27,13 +28,31 @@ describe('ForwardingButtonComponent', () => {
expect(component).toBeTruthy();
});
- describe('on button click', () => {
- it('should emit', () => {
- component.clickEmitter.emit = jest.fn();
+ describe('component', () => {
+ describe('set disabled', () => {
+ it('should set tooltip text', () => {
+ component.disabled = true;
- dispatchEventFromFixture(fixture, button, MockEvent.CLICK);
+ expect(component.tooltip).not.toBe(EMPTY_STRING);
+ });
- expect(component.clickEmitter.emit).toHaveBeenCalled();
+ it('should set empty tooltip', () => {
+ component.disabled = false;
+
+ expect(component.tooltip).toBe(EMPTY_STRING);
+ });
+ });
+ });
+
+ describe('template', () => {
+ describe('on button click', () => {
+ it('should emit', () => {
+ component.clickEmitter.emit = jest.fn();
+
+ dispatchEventFromFixture(fixture, button, MockEvent.CLICK);
+
+ expect(component.clickEmitter.emit).toHaveBeenCalled();
+ });
});
});
});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.ts
index 767fe5e4ce40e7589725973d37e9a84c12fd0564..e881014e936c13d57632ed0c9d059093bcb1d76a 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-button/forwarding-button.component.ts
@@ -1,18 +1,28 @@
import { CommandResource } from '@alfa-client/command-shared';
-import { StateResource } from '@alfa-client/tech-shared';
+import { EMPTY_STRING, StateResource } from '@alfa-client/tech-shared';
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { ButtonWithSpinnerComponent } from '@ods/component';
-import { ForwardVorgangIconComponent } from '@ods/system';
+import { ForwardVorgangIconComponent, TooltipDirective } from '@ods/system';
@Component({
selector: 'alfa-forwarding-button',
standalone: true,
- imports: [ButtonWithSpinnerComponent, ForwardVorgangIconComponent],
+ imports: [ButtonWithSpinnerComponent, ForwardVorgangIconComponent, TooltipDirective],
templateUrl: './forwarding-button.component.html',
})
export class ForwardingButtonComponent {
- @Input() disabled: boolean;
+ @Input() set disabled(value: boolean) {
+ this._disabled = value;
+ this.tooltip = value ? 'Bitte ein Amt oder Stelle auswählen' : EMPTY_STRING;
+ }
@Input() stateResource: StateResource<CommandResource>;
@Output() clickEmitter: EventEmitter<void> = new EventEmitter();
+
+ public tooltip: string;
+ private _disabled: boolean;
+
+ get disabled() {
+ return this._disabled;
+ }
}
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html
index 5aaf99a340455262073812254cf8c7d74adf578e..af7bf0bb349af1ccbbf4e22cc0091b5b50e8bcd1 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.html
@@ -1,22 +1,25 @@
-<div class="flex w-[620px] max-w-full flex-col gap-4 bg-background-100 p-8">
- <div class="flex items-center justify-between">
- <h1 class="text-xl font-semibold text-primary">Vorgang weiterleiten</h1>
- <ods-cancel-dialog-button showAsIconButton="true" />
- </div>
-
- @if (!selectedSearchResult) {
- <alfa-search-zustaendige-stelle-form-container cdkFocusInitial focusOnSearchField="true" data-test-id="zufi-search" />
- } @else {
- <alfa-forwarding-item-in-dialog [organisationsEinheitResource]="selectedSearchResult" data-test-id="forwarding-item" />
- }
+<ods-dialog-container>
+ <div class="flex grow flex-col gap-6">
+ <div class="flex items-center justify-between">
+ <h1 class="text-lg font-medium text-primary">Vorgang weiterleiten</h1>
+ <ods-cancel-dialog-button showAsIconButton="true" />
+ </div>
+ <div class="h-[calc(50vh+4.5rem)] grow">
+ @if (!selectedSearchResult) {
+ <alfa-forwarding-search-organisations-einheit cdkFocusInitial data-test-id="organisations-einheit-search" />
+ } @else {
+ <alfa-selected-search-item [organisationsEinheitResource]="selectedSearchResult" data-test-id="selected-search-item" />
+ }
+ </div>
- <div class="flex gap-4">
- <alfa-forwarding-button
- [stateResource]="forwardCommandStateResource"
- [disabled]="!selectedSearchResult"
- (clickEmitter)="onForwarding()"
- data-test-id="foward-dialog-forward-button"
- />
- <ods-cancel-dialog-button />
+ <div class="flex gap-4">
+ <alfa-forwarding-button
+ [stateResource]="forwardCommandStateResource"
+ [disabled]="!selectedSearchResult"
+ (clickEmitter)="onForwarding()"
+ data-test-id="foward-dialog-forward-button"
+ />
+ <ods-cancel-dialog-button />
+ </div>
</div>
-</div>
+</ods-dialog-container>
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.spec.ts
index 7e6114236be2ad7d2dddfcdfd309853b32568cdd..be35437daced36c2d43a532852f0d78cbc4fa8b9 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.spec.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.spec.ts
@@ -5,35 +5,36 @@ import {
MockEvent,
notExistsAsHtmlElement,
} from '@alfa-client/test-utils';
-import { ZustaendigeStelleModule } from '@alfa-client/zustaendige-stelle';
import { OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { getUrl } from '@ngxp/rest';
import { CancelDialogButtonComponent } from '@ods/component';
-import { MockComponent, MockModule } from 'ng-mocks';
+import { MockComponent } from 'ng-mocks';
import { getDataTestIdOf } from '../../../../../tech-shared/test/data-test';
import { createOrganisationsEinheitResource } from '../../../../../zustaendige-stelle-shared/test/organisations-einheit';
import { ForwardingButtonComponent } from './forwarding-button/forwarding-button.component';
import { ForwardingDialogComponent } from './forwarding-dialog.component';
-import { ForwardingItemInDialogComponent } from './forwarding-item/forwarding-item.component';
+import { SelectedSearchItemComponent } from './selected-search-item/selected-search-item.component';
+import { ForwardingSearchOrganisationsEinheitComponent } from './search-organisations-einheit/search-organisations-einheit.component';
describe('ForwardingDialogComponent', () => {
let component: ForwardingDialogComponent;
let fixture: ComponentFixture<ForwardingDialogComponent>;
- const zufiSearch: string = getDataTestIdOf('zufi-search');
- const forwardingItem: string = getDataTestIdOf('forwarding-item');
+ const organisationsEinheitSearch: string = getDataTestIdOf('organisations-einheit-search');
+ const selectedSearchItem: string = getDataTestIdOf('selected-search-item');
const forwardButton: string = getDataTestIdOf('foward-dialog-forward-button');
const organisationsEinheitResource: OrganisationsEinheitResource = createOrganisationsEinheitResource();
+
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [ForwardingDialogComponent],
declarations: [
MockComponent(CancelDialogButtonComponent),
MockComponent(ForwardingButtonComponent),
- MockComponent(ForwardingItemInDialogComponent),
- MockModule(ZustaendigeStelleModule),
+ MockComponent(SelectedSearchItemComponent),
+ MockComponent(ForwardingSearchOrganisationsEinheitComponent),
],
}).compileComponents();
@@ -53,7 +54,7 @@ describe('ForwardingDialogComponent', () => {
fixture.detectChanges();
- existsAsHtmlElement(fixture, zufiSearch);
+ existsAsHtmlElement(fixture, organisationsEinheitSearch);
});
it('should NOT render if selectedSearchResult is NOT null', () => {
@@ -61,7 +62,7 @@ describe('ForwardingDialogComponent', () => {
fixture.detectChanges();
- notExistsAsHtmlElement(fixture, zufiSearch);
+ notExistsAsHtmlElement(fixture, organisationsEinheitSearch);
});
});
});
@@ -78,7 +79,7 @@ describe('ForwardingDialogComponent', () => {
fixture.detectChanges();
- existsAsHtmlElement(fixture, forwardingItem);
+ existsAsHtmlElement(fixture, selectedSearchItem);
});
it('should NOT render if selectedSearchResult is null', () => {
@@ -86,7 +87,7 @@ describe('ForwardingDialogComponent', () => {
fixture.detectChanges();
- notExistsAsHtmlElement(fixture, forwardingItem);
+ notExistsAsHtmlElement(fixture, selectedSearchItem);
});
});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.ts
index 178d84465273bc421ee5bd9a49dca84d213cb299..9ff338f0a8f472af342aa6ccd809b3dcbcfca407 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-dialog.component.ts
@@ -7,8 +7,10 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { getUrl, ResourceUri } from '@ngxp/rest';
import { CancelDialogButtonComponent } from '@ods/component';
+import { DialogContainerComponent } from '@ods/system';
import { ForwardingButtonComponent } from './forwarding-button/forwarding-button.component';
-import { ForwardingItemInDialogComponent } from './forwarding-item/forwarding-item.component';
+import { SelectedSearchItemComponent } from './selected-search-item/selected-search-item.component';
+import { ForwardingSearchOrganisationsEinheitComponent } from './search-organisations-einheit/search-organisations-einheit.component';
@Component({
selector: 'alfa-forwarding-dialog',
@@ -19,7 +21,9 @@ import { ForwardingItemInDialogComponent } from './forwarding-item/forwarding-it
ReactiveFormsModule,
ZustaendigeStelleModule,
ForwardingButtonComponent,
- ForwardingItemInDialogComponent,
+ ForwardingSearchOrganisationsEinheitComponent,
+ SelectedSearchItemComponent,
+ DialogContainerComponent,
],
templateUrl: './forwarding-dialog.component.html',
})
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.html
deleted file mode 100644
index bd41e43d6a1c75eb03bca208ca264c7553aaa5a8..0000000000000000000000000000000000000000
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<ods-forwarding-item [label]="organisationsEinheitResource.name" [address]="organisationsEinheitResource.anschrift | anschriftToString" >
- <alfa-forwarding-item-change-button-container />
-</ods-forwarding-item>
\ No newline at end of file
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.spec.ts
deleted file mode 100644
index b8ffb55d8ab7ff80771ddd8cdd2d1e6611dbe459..0000000000000000000000000000000000000000
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.spec.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { getMockComponent } from '@alfa-client/test-utils';
-import { Anschrift, OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
-import { ForwardingItemComponent } from '@ods/system';
-import { MockComponent } from 'ng-mocks';
-import { createOrganisationsEinheitResource } from '../../../../../../zustaendige-stelle-shared/test/organisations-einheit';
-import { ForwardingItemChangeButtonContainerComponent } from './forwarding-item-change-button-container/forwarding-item-change-button-container.component';
-import { ForwardingItemInDialogComponent } from './forwarding-item.component';
-
-describe('ForwardingDialogForwardingItemComponent', () => {
- let component: ForwardingItemInDialogComponent;
- let fixture: ComponentFixture<ForwardingItemInDialogComponent>;
-
- const organisationsEinheitResource: OrganisationsEinheitResource = createOrganisationsEinheitResource();
- const anschrift: Anschrift = organisationsEinheitResource.anschrift;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- imports: [ForwardingItemInDialogComponent],
- declarations: [MockComponent(ForwardingItemChangeButtonContainerComponent), MockComponent(ForwardingItemComponent)],
- }).compileComponents();
-
- fixture = TestBed.createComponent(ForwardingItemInDialogComponent);
- component = fixture.componentInstance;
- component.organisationsEinheitResource = organisationsEinheitResource;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-
- describe('forwarding item', () => {
- it('should exist with input', () => {
- const forwardingItem: ForwardingItemComponent = getMockComponent(fixture, ForwardingItemComponent);
-
- expect(forwardingItem.label).toBe(organisationsEinheitResource.name);
- expect(forwardingItem.address).toBe(`${anschrift.strasse} ${anschrift.hausnummer}, ${anschrift.plz} ${anschrift.ort}`);
- });
- });
-});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.ts
deleted file mode 100644
index 9828f682d8860e851cc15cde31fef24150120f4a..0000000000000000000000000000000000000000
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item.component.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { AnschriftToStringPipe, OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
-import { Component, Input } from '@angular/core';
-import { ForwardingItemComponent } from '@ods/system';
-import { ForwardingItemChangeButtonContainerComponent } from './forwarding-item-change-button-container/forwarding-item-change-button-container.component';
-
-@Component({
- selector: 'alfa-forwarding-item-in-dialog',
- standalone: true,
- imports: [ForwardingItemChangeButtonContainerComponent, AnschriftToStringPipe, ForwardingItemComponent],
- templateUrl: './forwarding-item.component.html',
-})
-export class ForwardingItemInDialogComponent {
- @Input() organisationsEinheitResource: OrganisationsEinheitResource;
-}
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..410a1ed8605cd28872a594b69559885e6e707d5d
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.html
@@ -0,0 +1,3 @@
+<ods-forwarding-item>
+ <alfa-search-zustaendige-stelle-form-container focusOnSearchField="true"/>
+</ods-forwarding-item>
\ No newline at end of file
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..84b088454368fd60b3f91e74363ce1aadae01ee0
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.spec.ts
@@ -0,0 +1,26 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ZustaendigeStelleModule } from '@alfa-client/zustaendige-stelle';
+import { ForwardingItemComponent } from '@ods/system';
+import { MockComponent, MockModule } from 'ng-mocks';
+import { ForwardingSearchOrganisationsEinheitComponent } from './search-organisations-einheit.component';
+
+describe('ForwardingSearchOrganisationsEinheitComponent', () => {
+ let component: ForwardingSearchOrganisationsEinheitComponent;
+ let fixture: ComponentFixture<ForwardingSearchOrganisationsEinheitComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [ForwardingSearchOrganisationsEinheitComponent],
+ declarations: [MockComponent(ForwardingItemComponent), MockModule(ZustaendigeStelleModule)],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(ForwardingSearchOrganisationsEinheitComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..bc974a66d4a87b9d32b81acf1e8eff03d5f40430
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/search-organisations-einheit/search-organisations-einheit.component.ts
@@ -0,0 +1,11 @@
+import { ZustaendigeStelleModule } from '@alfa-client/zustaendige-stelle';
+import { Component } from '@angular/core';
+import { ForwardingItemComponent } from '@ods/system';
+
+@Component({
+ selector: 'alfa-forwarding-search-organisations-einheit',
+ standalone: true,
+ imports: [ForwardingItemComponent, ZustaendigeStelleModule],
+ templateUrl: './search-organisations-einheit.component.html',
+})
+export class ForwardingSearchOrganisationsEinheitComponent {}
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.html
similarity index 100%
rename from alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.html
rename to alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.html
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.spec.ts
similarity index 79%
rename from alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.spec.ts
rename to alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.spec.ts
index 49e50eaa845262e74914cd7f4717c66e549ca924..86ce46346d2fa0592dc93cc2c83c75f3f4512d83 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.spec.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.spec.ts
@@ -5,11 +5,11 @@ import { OrganisationsEinheitService, ZUSTAENDIGE_STELLE_SERVICE } from '@alfa-c
import { ButtonComponent } from '@ods/system';
import { MockComponent } from 'ng-mocks';
import { getDataTestIdOf } from '../../../../../../../tech-shared/test/data-test';
-import { ForwardingItemChangeButtonContainerComponent } from './forwarding-item-change-button-container.component';
+import { ChangeButtonContainerComponent } from './change-button-container.component';
describe('ForwardingItemChangeButtonContainerComponent', () => {
- let component: ForwardingItemChangeButtonContainerComponent;
- let fixture: ComponentFixture<ForwardingItemChangeButtonContainerComponent>;
+ let component: ChangeButtonContainerComponent;
+ let fixture: ComponentFixture<ChangeButtonContainerComponent>;
const buttonContainer: string = getDataTestIdOf('forwarding-item-change-button-container');
@@ -19,12 +19,12 @@ describe('ForwardingItemChangeButtonContainerComponent', () => {
service = mock(OrganisationsEinheitService);
TestBed.configureTestingModule({
- imports: [ForwardingItemChangeButtonContainerComponent],
+ imports: [ChangeButtonContainerComponent],
declarations: [MockComponent(ButtonComponent)],
providers: [{ provide: ZUSTAENDIGE_STELLE_SERVICE, useValue: service }],
}).compileComponents();
- fixture = TestBed.createComponent(ForwardingItemChangeButtonContainerComponent);
+ fixture = TestBed.createComponent(ChangeButtonContainerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.ts
similarity index 71%
rename from alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.ts
rename to alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.ts
index 5a0ca9ccbe7730e0eb8d54ef013b17d12719b0ec..549bd4342b5c274724a0a55a6fdde303d1209d69 100644
--- a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/forwarding-item/forwarding-item-change-button-container/forwarding-item-change-button-container.component.ts
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/change-button-container/change-button-container.component.ts
@@ -3,12 +3,12 @@ import { Component, inject } from '@angular/core';
import { ButtonComponent } from '@ods/system';
@Component({
- selector: 'alfa-forwarding-item-change-button-container',
+ selector: 'alfa-change-button-container',
standalone: true,
imports: [ButtonComponent],
- templateUrl: './forwarding-item-change-button-container.component.html',
+ templateUrl: './change-button-container.component.html',
})
-export class ForwardingItemChangeButtonContainerComponent {
+export class ChangeButtonContainerComponent {
private readonly organisationsEinheitService = inject(ZUSTAENDIGE_STELLE_SERVICE) as OrganisationsEinheitService;
public onClick(): void {
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.html b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..66f8b9cac15d60112010465b2632f3e607b0dfa7
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.html
@@ -0,0 +1,7 @@
+<ods-forwarding-item class="block">
+ <ods-forwarding-item-info
+ [label]="organisationsEinheitResource.name"
+ [address]="organisationsEinheitResource.anschrift | anschriftToString"
+ />
+ <alfa-change-button-container end-content />
+</ods-forwarding-item>
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.spec.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..c95fd052a78482a1a5aa3a15a60e3e3cd0b35ec3
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.spec.ts
@@ -0,0 +1,46 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { getMockComponent } from '@alfa-client/test-utils';
+import { Anschrift, OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
+import { ForwardingItemComponent, ForwardingItemInfoComponent } from '@ods/system';
+import { MockComponent } from 'ng-mocks';
+import { createOrganisationsEinheitResource } from '../../../../../../zustaendige-stelle-shared/test/organisations-einheit';
+import { ChangeButtonContainerComponent } from './change-button-container/change-button-container.component';
+import { SelectedSearchItemComponent } from './selected-search-item.component';
+
+describe('ForwardingSearchOrganisationsEinheitComponent', () => {
+ let component: SelectedSearchItemComponent;
+ let fixture: ComponentFixture<SelectedSearchItemComponent>;
+
+ const organisationsEinheitResource: OrganisationsEinheitResource = createOrganisationsEinheitResource();
+ const anschrift: Anschrift = organisationsEinheitResource.anschrift;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [SelectedSearchItemComponent],
+ declarations: [
+ MockComponent(ChangeButtonContainerComponent),
+ MockComponent(ForwardingItemComponent),
+ MockComponent(ForwardingItemInfoComponent),
+ ],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(SelectedSearchItemComponent);
+ component = fixture.componentInstance;
+ component.organisationsEinheitResource = organisationsEinheitResource;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ describe('forwarding item info', () => {
+ it('should exist with input', () => {
+ const forwardingItemInfo: ForwardingItemInfoComponent = getMockComponent(fixture, ForwardingItemInfoComponent);
+
+ expect(forwardingItemInfo.label).toBe(organisationsEinheitResource.name);
+ expect(forwardingItemInfo.address).toBe(`${anschrift.strasse} ${anschrift.hausnummer}, ${anschrift.plz} ${anschrift.ort}`);
+ });
+ });
+});
diff --git a/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.ts b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..c40737820507149807e1fe17be6de8a6033b6e6d
--- /dev/null
+++ b/alfa-client/libs/forwarding/src/lib/forwarding-dialog-container/forwarding-dialog/selected-search-item/selected-search-item.component.ts
@@ -0,0 +1,14 @@
+import { AnschriftToStringPipe, OrganisationsEinheitResource } from '@alfa-client/zustaendige-stelle-shared';
+import { Component, Input } from '@angular/core';
+import { ForwardingItemComponent, ForwardingItemInfoComponent } from '@ods/system';
+import { ChangeButtonContainerComponent } from './change-button-container/change-button-container.component';
+
+@Component({
+ selector: 'alfa-selected-search-item',
+ standalone: true,
+ imports: [ChangeButtonContainerComponent, AnschriftToStringPipe, ForwardingItemComponent, ForwardingItemInfoComponent],
+ templateUrl: './selected-search-item.component.html',
+})
+export class SelectedSearchItemComponent {
+ @Input() organisationsEinheitResource: OrganisationsEinheitResource;
+}