Commit 5fa644a2 authored by Alexander Philipp Nowosad's avatar Alexander Philipp Nowosad
Browse files

Add names for multiple and lists

parent 82fc31d1
Pipeline #138361 failed with stages
in 10 minutes and 54 seconds
......@@ -8,13 +8,15 @@ import { Equality } from '../../shared/equality';
import { equalsList } from '../../shared/utils';
import { DatabaseModelPart } from '../../database/database-model-part';
export interface ElementSummary<T extends MethodElement> {
list: string;
elements: T[];
multiple: boolean;
multipleElements: boolean;
}
export class GroupSummary<T extends MethodElement> {
elements: {
list: string;
elements: T[];
multiple: boolean;
multipleElements: boolean;
}[];
elements: ElementSummary<T>[];
}
export class GroupSelection<T extends MethodElement>
......
......@@ -41,8 +41,7 @@
</div>
<div class="modal-body">
<div class="alert alert-info">
Types that are defined for this activity. Angle brackets ("<<", ">>")
indicate lists.
Types that are defined for this activity.
</div>
<div class="alert alert-info" *ngIf="modalElement.businessObject.inherit">
Types are inherited from parent element.
......@@ -58,9 +57,9 @@
*ngFor="let element of modalElement.businessObject.get('neededType')"
>
<span *ngIf="element.element"
>{{ element.element.name }} (<<{{ element.list }}>>)</span
>{{ element.element.name }} ({{ $any(element.list) | list }})</span
>
<span *ngIf="!element.element"><<{{ element.list }}>></span>
<span *ngIf="!element.element">{{ $any(element.list) | list }}</span>
</li>
</ul>
<div
......@@ -81,9 +80,9 @@
"
>
<span *ngIf="element.element"
><<{{ element.list }}>> {{ element.element.name }}</span
>{{ $any(element.list) | list }} {{ element.element.name }}</span
>
<span *ngIf="!element.element"><<{{ element.list }}>></span>
<span *ngIf="!element.element">{{ $any(element.list) | list }}</span>
</li>
</ul>
<div
......
......@@ -2,7 +2,7 @@
<ul>
<li *ngFor="let element of asGroupSummary(list).elements">
<ng-container *ngIf="element.multiple">
[<<{{ element.list }}>>]
{{ element.list | list | multiple: true }}
<ul>
<li *ngFor="let concreteElement of element.elements">
{{ concreteElement.name }}
......@@ -11,17 +11,11 @@
</ng-container>
<ng-container *ngIf="!element.multiple">
<ng-container *ngIf="element.elements.length === 1">
<ng-container *ngIf="element.multipleElements">
[{{ element.elements[0].name }}] (<<{{
element.elements[0].list
}}>>)
</ng-container>
<ng-container *ngIf="!element.multipleElements">
{{ element.elements[0].name }} (<<{{ element.elements[0].list }}>>)
</ng-container>
{{ element.elements[0].name | multiple: element.multipleElements }}
({{ element.elements[0].list | list }})
</ng-container>
<ng-container *ngIf="element.elements.length === 0">
(<<{{ element.list }}>>)
({{ element.list | list }})
</ng-container>
</ng-container>
</li>
......
......@@ -70,6 +70,8 @@ import { RunningProcessArtifactExportFormComponent } from './running-process-art
import { ConcreteArtifactFormComponent } from './concrete-artifact-form/concrete-artifact-form.component';
import { RunningProcessArtifactImportFormComponent } from './running-process-artifact-import-form/running-process-artifact-import-form.component';
import { RunningProcessArtifactRenameFormComponent } from './running-process-artifact-rename-form/running-process-artifact-rename-form.component';
import { MultiplePipe } from './pipes/multiple.pipe';
import { ListPipe } from './pipes/list.pipe';
@NgModule({
declarations: [
......@@ -142,6 +144,8 @@ import { RunningProcessArtifactRenameFormComponent } from './running-process-art
ConcreteArtifactFormComponent,
RunningProcessArtifactImportFormComponent,
RunningProcessArtifactRenameFormComponent,
MultiplePipe,
ListPipe,
],
imports: [DevelopmentProcessesRoutingModule, SharedModule],
})
......
......@@ -22,10 +22,7 @@
<ng-container *ngIf="selectedGroup !== index">
<li *ngFor="let element of group" class="list-group-item">
<app-method-element-info
[multiple]="element.multiple"
[multipleElements]="element.multipleElements"
[listName]="element.list"
[methodElement]="element.element"
[element]="element"
[methodElementName]="methodElementName"
></app-method-element-info>
</li>
......@@ -38,10 +35,7 @@
>
<app-method-element-info
[formArrayName]="elementIndex.toString()"
[multiple]="element.multiple"
[multipleElements]="element.multipleElements"
[listName]="element.list"
[methodElement]="element.element"
[element]="element"
[methodElements]="methodElements"
[methodElementName]="methodElementName"
></app-method-element-info>
......
......@@ -4,12 +4,12 @@
<input
readonly
type="text"
[value]="listValue"
[value]="element.list | multiple: element.multiple"
class="form-control-plaintext"
id="listInput"
/>
</div>
<div class="form-group col" *ngIf="!methodElement">
<div class="form-group col" *ngIf="element.element == null">
<label for="elementInput">{{ methodElementName }}</label>
<div class="input-group" *ngIf="formArray && formArray.length > 0">
<input
......@@ -26,7 +26,7 @@
(click)="openElementInput.next([input, $any($event.target).value])"
(focus)="openElementInput.next([input, $any($event.target).value])"
/>
<div class="input-group-append" *ngIf="multiple">
<div class="input-group-append" *ngIf="element.multiple">
<button
(click)="add(1)"
class="btn btn-outline-secondary align-self-baseline"
......@@ -54,18 +54,18 @@
</button>
</div>
</div>
<div class="form-group col" *ngIf="methodElement">
<div class="form-group col" *ngIf="element.element != null">
<label for="elementInputStatic">{{ methodElementName }}</label>
<input
readonly
type="text"
[value]="elementValue"
[value]="element.element.name | multiple: element.multipleElements"
class="form-control-plaintext"
id="elementInputStatic"
/>
</div>
</div>
<ng-container *ngIf="formArray && multiple">
<ng-container *ngIf="formArray && element.multiple">
<div
*ngFor="let control of formArray.controls.slice(1); let index = index"
class="form-row"
......@@ -89,7 +89,7 @@
(click)="openElementInput.next([input, $any($event.target).value])"
(focus)="openElementInput.next([input, $any($event.target).value])"
/>
<div class="input-group-append" *ngIf="multiple">
<div class="input-group-append" *ngIf="element.multiple">
<button
(click)="add(index + 2)"
class="btn btn-outline-secondary align-self-baseline"
......
import { Component, Input, Optional } from '@angular/core';
import { MethodElement } from '../../development-process-registry/method-elements/method-element';
import { merge, Observable, Subject } from 'rxjs';
import { FormArrayName, FormBuilder, Validators } from '@angular/forms';
import {
FormArray,
FormArrayName,
FormBuilder,
Validators,
} from '@angular/forms';
import { getTypeaheadInputPipe } from '../../shared/utils';
import { filter, map } from 'rxjs/operators';
import { MultipleSelection } from '../../development-process-registry/development-method/multiple-selection';
@Component({
selector: 'app-method-element-info',
......@@ -13,10 +19,7 @@ import { filter, map } from 'rxjs/operators';
export class MethodElementInfoComponent {
@Input() methodElementName: string;
@Input() listName: string;
@Input() methodElement: MethodElement = null;
@Input() multiple = false;
@Input() multipleElements = false;
@Input() element: MultipleSelection<MethodElement>;
@Input() methodElements: MethodElement[] = [];
......@@ -27,59 +30,45 @@ export class MethodElementInfoComponent {
@Optional() private formArrayName: FormArrayName
) {}
searchElements = (field: HTMLInputElement) => (input: Observable<string>) => {
return merge(
getTypeaheadInputPipe(input),
this.openElementInput.pipe(
filter(([f]) => f === field),
map(([, i]) => i)
)
).pipe(
map((term) =>
this.methodElements
.filter(
(methodElement) =>
methodElement.list.toLowerCase() ===
this.listName.toLowerCase() &&
methodElement.name.toLowerCase().includes(term.toLowerCase())
)
.slice(0, 7)
)
);
};
searchElements =
(field: HTMLInputElement) =>
(input: Observable<string>): Observable<MethodElement[]> => {
return merge(
getTypeaheadInputPipe(input),
this.openElementInput.pipe(
filter(([f]) => f === field),
map(([, i]) => i)
)
).pipe(
map((term) =>
this.methodElements
.filter(
(methodElement) =>
methodElement.list.toLowerCase() ===
this.element.list.toLowerCase() &&
methodElement.name.toLowerCase().includes(term.toLowerCase())
)
.slice(0, 7)
)
);
};
add(index: number = null) {
add(index: number = null): void {
if (index === null) {
index = this.formArray.length;
}
this.formArray.insert(index, this.fb.control(null, Validators.required));
}
remove(index: number) {
remove(index: number): void {
this.formArray.removeAt(index);
}
formatter(x: { name: string }) {
formatter(x: { name: string }): string {
return x.name;
}
get formArray() {
get formArray(): FormArray {
return this.formArrayName ? this.formArrayName.control : null;
}
get listValue() {
if (this.multiple) {
return '[' + this.listName + ']';
} else {
return this.listName;
}
}
get elementValue() {
if (this.multipleElements) {
return '[' + this.methodElement.name + ']';
} else {
return this.methodElement.name;
}
}
}
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'list',
})
export class ListPipe implements PipeTransform {
transform(value: string): string {
return 'List ' + value;
}
}
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'multiple'
})
export class MultiplePipe implements PipeTransform {
transform(value: string, multiple: boolean): string {
if (multiple) {
return value + ' (multiple)';
} else {
return value;
}
}
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment