@valtimo/task-management 0.0.0-test

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/fesm2022/valtimo-task-management.mjs +1344 -0
  2. package/fesm2022/valtimo-task-management.mjs.map +1 -0
  3. package/index.d.ts +6 -0
  4. package/lib/components/index.d.ts +5 -0
  5. package/lib/components/index.d.ts.map +1 -0
  6. package/lib/components/task-management-column-modal/task-management-column-modal.component.d.ts +89 -0
  7. package/lib/components/task-management-column-modal/task-management-column-modal.component.d.ts.map +1 -0
  8. package/lib/components/task-management-columns/task-management-columns.component.d.ts +41 -0
  9. package/lib/components/task-management-columns/task-management-columns.component.d.ts.map +1 -0
  10. package/lib/components/task-management-detail/task-management-detail.component.d.ts +13 -0
  11. package/lib/components/task-management-detail/task-management-detail.component.d.ts.map +1 -0
  12. package/lib/components/task-management-search-fields/task-management-search-fields.component.d.ts +35 -0
  13. package/lib/components/task-management-search-fields/task-management-search-fields.component.d.ts.map +1 -0
  14. package/lib/components/task-management-search-fields-modal/task-management-search-fields-modal.component.d.ts +81 -0
  15. package/lib/components/task-management-search-fields-modal/task-management-search-fields-modal.component.d.ts.map +1 -0
  16. package/lib/models/index.d.ts +2 -0
  17. package/lib/models/index.d.ts.map +1 -0
  18. package/lib/models/task-management.model.d.ts +6 -0
  19. package/lib/models/task-management.model.d.ts.map +1 -0
  20. package/lib/services/index.d.ts +4 -0
  21. package/lib/services/index.d.ts.map +1 -0
  22. package/lib/services/task-management-api.service.d.ts +18 -0
  23. package/lib/services/task-management-api.service.d.ts.map +1 -0
  24. package/lib/services/task-management-search-fields.service.d.ts +20 -0
  25. package/lib/services/task-management-search-fields.service.d.ts.map +1 -0
  26. package/lib/services/task-management.service.d.ts +11 -0
  27. package/lib/services/task-management.service.d.ts.map +1 -0
  28. package/package.json +25 -0
  29. package/public_api.d.ts +4 -0
  30. package/public_api.d.ts.map +1 -0
  31. package/valtimo-task-management.d.ts.map +1 -0
@@ -0,0 +1,1344 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Injectable, EventEmitter, Output, Input, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import * as i6 from '@valtimo/components';
4
+ import { CARBON_THEME, ViewType, CARBON_CONSTANTS, CarbonListModule, TooltipIconModule, CarbonMultiInputModule, ValtimoCdsModalDirective, ConfirmationModalModule, ValuePathSelectorPrefix, InputLabelModule, ValuePathSelectorComponent } from '@valtimo/components';
5
+ import * as i5 from '@angular/common';
6
+ import { CommonModule } from '@angular/common';
7
+ import * as i4 from '@ngx-translate/core';
8
+ import { TranslateModule } from '@ngx-translate/core';
9
+ import * as i2$1 from 'carbon-components-angular';
10
+ import { TabsModule, ModalModule, CheckboxModule, DropdownModule, InputModule, ButtonModule, LayerModule, IconModule } from 'carbon-components-angular';
11
+ import * as i3 from '@angular/forms';
12
+ import { FormGroup, FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
13
+ import { BehaviorSubject, of, map, tap, combineLatest, Subject, switchMap, take, startWith, distinctUntilChanged as distinctUntilChanged$1, filter } from 'rxjs';
14
+ import { TaskListColumnDefaultSort, TaskListSearchFieldDataType, TaskListSearchFieldFieldType, TaskListSearchDropdownDataProvider, TaskListSearchFieldMatchType } from '@valtimo/task';
15
+ import { distinctUntilChanged } from 'rxjs/operators';
16
+ import { isEqual } from 'lodash';
17
+ import * as i2 from '@valtimo/shared';
18
+ import { BaseApiService, getCaseManagementRouteParams } from '@valtimo/shared';
19
+ import * as i1 from '@angular/common/http';
20
+ import * as i1$1 from '@angular/router';
21
+ import { TrashCan16, InformationFilled16 } from '@carbon/icons';
22
+ import * as i1$2 from '@valtimo/document';
23
+
24
+ /*
25
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
26
+ *
27
+ * Licensed under EUPL, Version 1.2 (the "License");
28
+ * you may not use this file except in compliance with the License.
29
+ * You may obtain a copy of the License at
30
+ *
31
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
32
+ *
33
+ * Unless required by applicable law or agreed to in writing, software
34
+ * distributed under the License is distributed on an "AS IS" basis,
35
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
36
+ * See the License for the specific language governing permissions and
37
+ * limitations under the License.
38
+ */
39
+ var TaskManagementTab;
40
+ (function (TaskManagementTab) {
41
+ TaskManagementTab["COLUMNS"] = "columns";
42
+ TaskManagementTab["SEARCH_FIELDS"] = "searchFields";
43
+ })(TaskManagementTab || (TaskManagementTab = {}));
44
+
45
+ /*
46
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
47
+ *
48
+ * Licensed under EUPL, Version 1.2 (the "License");
49
+ * you may not use this file except in compliance with the License.
50
+ * You may obtain a copy of the License at
51
+ *
52
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
53
+ *
54
+ * Unless required by applicable law or agreed to in writing, software
55
+ * distributed under the License is distributed on an "AS IS" basis,
56
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
57
+ * See the License for the specific language governing permissions and
58
+ * limitations under the License.
59
+ */
60
+
61
+ /*
62
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
63
+ *
64
+ * Licensed under EUPL, Version 1.2 (the "License");
65
+ * you may not use this file except in compliance with the License.
66
+ * You may obtain a copy of the License at
67
+ *
68
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
69
+ *
70
+ * Unless required by applicable law or agreed to in writing, software
71
+ * distributed under the License is distributed on an "AS IS" basis,
72
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
73
+ * See the License for the specific language governing permissions and
74
+ * limitations under the License.
75
+ */
76
+ class TaskManagementService {
77
+ constructor() {
78
+ this._activeTab$ = new BehaviorSubject(TaskManagementTab.COLUMNS);
79
+ }
80
+ get activeTab$() {
81
+ return this._activeTab$.asObservable();
82
+ }
83
+ setActiveTab(tab) {
84
+ this._activeTab$.next(tab);
85
+ }
86
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
87
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementService }); }
88
+ }
89
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementService, decorators: [{
90
+ type: Injectable
91
+ }] });
92
+
93
+ /*
94
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
95
+ *
96
+ * Licensed under EUPL, Version 1.2 (the "License");
97
+ * you may not use this file except in compliance with the License.
98
+ * You may obtain a copy of the License at
99
+ *
100
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
101
+ *
102
+ * Unless required by applicable law or agreed to in writing, software
103
+ * distributed under the License is distributed on an "AS IS" basis,
104
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
105
+ * See the License for the specific language governing permissions and
106
+ * limitations under the License.
107
+ */
108
+ class TaskManagementApiService extends BaseApiService {
109
+ constructor(httpClient, configService) {
110
+ super(httpClient, configService);
111
+ this.httpClient = httpClient;
112
+ this.configService = configService;
113
+ }
114
+ getTaskListColumns(caseDefinitionKey) {
115
+ return this.httpClient.get(this.getApiUrl(`/management/v1/case/${caseDefinitionKey}/task-list-column`));
116
+ }
117
+ updateTaskListColumn(caseDefinitionKey, column) {
118
+ return this.httpClient.put(this.getApiUrl(`/management/v1/case/${caseDefinitionKey}/task-list-column/${column.key}`), column);
119
+ }
120
+ deleteTaskListColumn(caseDefinitionKey, columnKey) {
121
+ return this.httpClient.delete(this.getApiUrl(`/management/v1/case/${caseDefinitionKey}/task-list-column/${columnKey}`));
122
+ }
123
+ updateTaskListColumnOrder(caseDefinitionKey, columnKeys) {
124
+ return this.httpClient.post(this.getApiUrl(`/management/v2/case/${caseDefinitionKey}/task-list-column`), columnKeys);
125
+ }
126
+ swapTaskListColumns(caseDefinitionKey, firstColumn, secondColumn) {
127
+ return this.httpClient.post(this.getApiUrl(`/management/v1/case/${caseDefinitionKey}/task-list-column`), { first: firstColumn.key, second: secondColumn.key });
128
+ }
129
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementApiService, deps: [{ token: i1.HttpClient }, { token: i2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable }); }
130
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementApiService, providedIn: 'root' }); }
131
+ }
132
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementApiService, decorators: [{
133
+ type: Injectable,
134
+ args: [{
135
+ providedIn: 'root',
136
+ }]
137
+ }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.ConfigService }] });
138
+
139
+ class TaskManagementSearchFieldsService extends BaseApiService {
140
+ constructor(httpClient, configService) {
141
+ super(httpClient, configService);
142
+ this.httpClient = httpClient;
143
+ this.configService = configService;
144
+ }
145
+ setCaseDefinitionKey(caseDefinitionKey) {
146
+ this._caseDefinitionKey = caseDefinitionKey;
147
+ }
148
+ getTaskListSearchFields() {
149
+ return this.httpClient.get(this.getApiUrl(`/v1/search/field/TaskListSearchColumns/${this._caseDefinitionKey}`));
150
+ }
151
+ createTaskListSearchField(searchField) {
152
+ return this.httpClient.post(this.getApiUrl(`/v1/search/field/${this._caseDefinitionKey}`), {
153
+ ...searchField,
154
+ ownerType: 'TaskListSearchColumns',
155
+ ownerId: this._caseDefinitionKey,
156
+ });
157
+ }
158
+ updateTaskListSearchField(searchField) {
159
+ return this.httpClient.put(this.getApiUrl(`/v1/search/field/${this._caseDefinitionKey}/${searchField.key}`), {
160
+ ...searchField,
161
+ ownerType: 'TaskListSearchColumns',
162
+ ownerId: this._caseDefinitionKey,
163
+ });
164
+ }
165
+ deleteTaskListSearchField(searchFieldKey) {
166
+ return this.httpClient.delete(this.getApiUrl(`/v1/search/field/TaskListSearchColumns/${this._caseDefinitionKey}/${searchFieldKey}`));
167
+ }
168
+ orderTaskListSearchFields(searchFields) {
169
+ return this.httpClient.put(this.getApiUrl(`/v1/search/field/${this._caseDefinitionKey}/fields`), searchFields);
170
+ }
171
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsService, deps: [{ token: i1.HttpClient }, { token: i2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable }); }
172
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsService, providedIn: 'root' }); }
173
+ }
174
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsService, decorators: [{
175
+ type: Injectable,
176
+ args: [{
177
+ providedIn: 'root',
178
+ }]
179
+ }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.ConfigService }] });
180
+
181
+ /*
182
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
183
+ *
184
+ * Licensed under EUPL, Version 1.2 (the "License");
185
+ * you may not use this file except in compliance with the License.
186
+ * You may obtain a copy of the License at
187
+ *
188
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
189
+ *
190
+ * Unless required by applicable law or agreed to in writing, software
191
+ * distributed under the License is distributed on an "AS IS" basis,
192
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
193
+ * See the License for the specific language governing permissions and
194
+ * limitations under the License.
195
+ */
196
+
197
+ /*
198
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
199
+ *
200
+ * Licensed under EUPL, Version 1.2 (the "License");
201
+ * you may not use this file except in compliance with the License.
202
+ * You may obtain a copy of the License at
203
+ *
204
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
205
+ *
206
+ * Unless required by applicable law or agreed to in writing, software
207
+ * distributed under the License is distributed on an "AS IS" basis,
208
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
209
+ * See the License for the specific language governing permissions and
210
+ * limitations under the License.
211
+ */
212
+ class TaskManagementColumnModalComponent {
213
+ set taskListColumns(value) {
214
+ if (value?.length > 0) {
215
+ this._taskListColumns$.next(value);
216
+ }
217
+ }
218
+ set type(value) {
219
+ this.type$.next(value);
220
+ }
221
+ get type() {
222
+ return this.type$.getValue();
223
+ }
224
+ set show(showModal) {
225
+ this.show$.next(showModal);
226
+ if (showModal)
227
+ this.enable();
228
+ if (!showModal)
229
+ this.resetFormAfterTimeout();
230
+ }
231
+ set selectedTaskListColumn(column) {
232
+ if (column)
233
+ this.prefillForm(column);
234
+ }
235
+ get taskListColumns$() {
236
+ return this._taskListColumns$.pipe(distinctUntilChanged((previous, current) => isEqual(previous, current)));
237
+ }
238
+ get title() {
239
+ return this.formGroup.get('title');
240
+ }
241
+ get key() {
242
+ return this.formGroup.get('key');
243
+ }
244
+ get keyValue$() {
245
+ return this.key?.valueChanges.pipe(distinctUntilChanged()) ?? of(null);
246
+ }
247
+ get path() {
248
+ return this.formGroup.get('path');
249
+ }
250
+ get dateFormat() {
251
+ return this.formGroup.get('dateFormat');
252
+ }
253
+ get displayType() {
254
+ return this.formGroup.get('displayType');
255
+ }
256
+ get sortable() {
257
+ return this.formGroup.get('sortable');
258
+ }
259
+ get defaultSort() {
260
+ return this.formGroup.get('defaultSort');
261
+ }
262
+ get _SORT_ASC_ITEM() {
263
+ return {
264
+ content: this.translateService.instant(`listColumn.sortableAsc`),
265
+ key: 'ASC',
266
+ };
267
+ }
268
+ get _SORT_DESC_ITEM() {
269
+ return {
270
+ content: this.translateService.instant(`listColumn.sortableDesc`),
271
+ key: 'DESC',
272
+ };
273
+ }
274
+ get enumValues$() {
275
+ return this._enumValues$.pipe(distinctUntilChanged((previous, current) => isEqual(previous, current)));
276
+ }
277
+ get enumValid$() {
278
+ return this.enumValues$.pipe(map(values => this.getValidEnumValues(values).length > 0));
279
+ }
280
+ get yesNoValues$() {
281
+ return this._yesNoValues$.pipe(distinctUntilChanged((previous, current) => isEqual(previous, current)));
282
+ }
283
+ constructor(translateService, taskManagementApiService) {
284
+ this.translateService = translateService;
285
+ this.taskManagementApiService = taskManagementApiService;
286
+ this.carbonTheme = CARBON_THEME.G10;
287
+ this.closeEvent = new EventEmitter();
288
+ this.type$ = new BehaviorSubject('add');
289
+ this.isAdd$ = this.type$.pipe(map(type => type === 'add'));
290
+ this.isEdit$ = this.type$.pipe(map(type => type === 'edit'), tap(isEdit => {
291
+ if (isEdit) {
292
+ this.key?.disable();
293
+ }
294
+ else {
295
+ this.key?.enable();
296
+ }
297
+ }));
298
+ this.show$ = new BehaviorSubject(false);
299
+ this.disabled$ = new BehaviorSubject(false);
300
+ this._taskListColumns$ = new BehaviorSubject([]);
301
+ this._INVALID_KEY = 'INVALID_KEY';
302
+ this.DISPLAY_TYPES = [
303
+ ViewType.TEXT,
304
+ ViewType.DATE,
305
+ ViewType.BOOLEAN,
306
+ ViewType.ENUM,
307
+ ViewType.ARRAY_COUNT,
308
+ ViewType.UNDERSCORES_TO_SPACES,
309
+ ];
310
+ this.getInvalidListItem = (translateKey) => ({
311
+ content: this.translateService.instant(translateKey),
312
+ key: this._INVALID_KEY,
313
+ selected: true,
314
+ });
315
+ this.uniqueKeyValidator = (keyFormControl) => {
316
+ const taskListColumns = this._taskListColumns$.getValue();
317
+ return !taskListColumns?.find(column => column?.key?.trim()?.toLowerCase() === keyFormControl?.value?.trim()?.toLowerCase())
318
+ ? null
319
+ : { notUnique: true };
320
+ };
321
+ this.listItemValidator = (listItemControl) => listItemControl?.value?.key && listItemControl.value.key !== this._INVALID_KEY
322
+ ? null
323
+ : { invalidItem: true };
324
+ this.formGroup = new FormGroup({
325
+ title: new FormControl(null),
326
+ key: new FormControl(null, [
327
+ this.uniqueKeyValidator.bind(this),
328
+ Validators.required,
329
+ ]),
330
+ path: new FormControl(null, Validators.required),
331
+ dateFormat: new FormControl(null),
332
+ displayType: new FormControl(this.getInvalidListItem(`listColumn.selectDefaultSort`), [Validators.required, this.listItemValidator.bind(this)]),
333
+ sortable: new FormControl(false),
334
+ defaultSort: new FormControl(this.getInvalidListItem(`listColumn.selectDefaultSort`), [Validators.required]),
335
+ });
336
+ this.sortItems$ = combineLatest([
337
+ this.defaultSort?.valueChanges || of(null),
338
+ this.translateService.stream('key'),
339
+ ]).pipe(map(([defaultSortItem]) => [
340
+ this.getInvalidListItem(`listColumn.selectDefaultSort`),
341
+ this._SORT_ASC_ITEM,
342
+ this._SORT_DESC_ITEM,
343
+ ].map((item, index) => ({
344
+ ...item,
345
+ selected: defaultSortItem?.key === item?.key,
346
+ }))));
347
+ this.viewTypeItems$ = combineLatest([
348
+ this.displayType?.valueChanges || of(null),
349
+ this.translateService.stream('key'),
350
+ ]).pipe(map(([displayTypeItem]) => [
351
+ {
352
+ content: this.translateService.instant(`listColumnDisplayType.select`),
353
+ key: this._INVALID_KEY,
354
+ },
355
+ ...this.DISPLAY_TYPES.map(type => this.getListItemFromViewType(type)),
356
+ ].map((item, index) => ({
357
+ ...item,
358
+ selected: displayTypeItem?.key === item?.key,
359
+ }))));
360
+ this.showDateFormat$ = this.formGroup.valueChanges.pipe(map(formValues => !!(formValues.displayType?.key === this.DISPLAY_TYPES[1])), tap(showDateFormat => (this._showDateFormat = showDateFormat)));
361
+ this.showEnum$ = this.formGroup.valueChanges.pipe(map(formValues => !!(formValues.displayType?.key === ViewType.ENUM)), tap(showEnum => {
362
+ this._showEnum = showEnum;
363
+ if ((this._enumValues$.getValue() || []).length === 0)
364
+ this.resetEnumValues();
365
+ }));
366
+ this.showYesNo$ = this.formGroup.valueChanges.pipe(map(formValues => !!(formValues.displayType?.key === ViewType.BOOLEAN)), tap(showYesNo => {
367
+ this._showYesNo = showYesNo;
368
+ if ((this._yesNoValues$.getValue() || []).length === 0)
369
+ this.resetYesNoValues();
370
+ }));
371
+ this.CARBON_THEME_WHITE = CARBON_THEME.WHITE;
372
+ this.disableDefaultSort$ = combineLatest([this.taskListColumns$, this.keyValue$]).pipe(map(([taskListColumns, keyValue]) => {
373
+ const defaultSortColumn = taskListColumns.find(column => column?.defaultSort === TaskListColumnDefaultSort.ASC ||
374
+ column?.defaultSort === TaskListColumnDefaultSort.DESC);
375
+ const defaultSortColumnExists = !!defaultSortColumn;
376
+ const enabled = !defaultSortColumnExists || defaultSortColumn.key === keyValue;
377
+ if (enabled) {
378
+ this.defaultSort?.enable();
379
+ }
380
+ else {
381
+ this.defaultSort?.disable();
382
+ }
383
+ return !enabled;
384
+ }));
385
+ this._DEFAULT_ENUM_VALUES = [{ key: '', value: '' }];
386
+ this._enumValues$ = new BehaviorSubject(this._DEFAULT_ENUM_VALUES);
387
+ this._yesNoValues$ = new BehaviorSubject(this._DEFAULT_ENUM_VALUES);
388
+ }
389
+ closeModal() {
390
+ this.closeEvent.emit('close');
391
+ }
392
+ save() {
393
+ this.disable();
394
+ this.taskManagementApiService
395
+ .updateTaskListColumn(this.caseDefinitionKey, this.getTaskListColumnFromFormValue(this._showEnum, this._showDateFormat, this._showYesNo))
396
+ .subscribe({
397
+ next: () => {
398
+ this.closeModalAndRefresh();
399
+ this.enableAfterTimeout();
400
+ },
401
+ error: () => {
402
+ this.enable();
403
+ },
404
+ });
405
+ }
406
+ enumValueChange(value) {
407
+ this._enumValues$.next(value);
408
+ }
409
+ yesNoValueChange(value) {
410
+ this._yesNoValues$.next(value);
411
+ }
412
+ resetEnumValues() {
413
+ this._enumValues$.next(this._DEFAULT_ENUM_VALUES);
414
+ }
415
+ resetYesNoValues() {
416
+ this._yesNoValues$.next(this._DEFAULT_ENUM_VALUES);
417
+ }
418
+ resetFormAfterTimeout() {
419
+ setTimeout(() => {
420
+ this.resetForm();
421
+ }, CARBON_CONSTANTS.modalAnimationMs);
422
+ }
423
+ resetForm() {
424
+ this.resetEnumValues();
425
+ this.resetYesNoValues();
426
+ this.formGroup.reset({
427
+ title: null,
428
+ key: null,
429
+ dateFormat: null,
430
+ displayType: this.getInvalidListItem('listColumnDisplayType.select'),
431
+ sortable: false,
432
+ defaultSort: this.getInvalidListItem(`listColumn.selectDefaultSort`),
433
+ });
434
+ }
435
+ disable() {
436
+ this.disabled$.next(true);
437
+ }
438
+ enableAfterTimeout() {
439
+ setTimeout(() => {
440
+ this.enable();
441
+ }, CARBON_CONSTANTS.modalAnimationMs);
442
+ }
443
+ enable() {
444
+ this.disabled$.next(false);
445
+ }
446
+ closeModalAndRefresh() {
447
+ this.closeEvent.emit('refresh');
448
+ }
449
+ getTaskListColumnFromFormValue(includeEnum, includeDateFormat, includeYesNo) {
450
+ const validEnumValues = this.getValidEnumValues(this._enumValues$.getValue());
451
+ const mappedEnumValues = validEnumValues && validEnumValues.length > 0 && this.mapEnumValues(validEnumValues);
452
+ const validYesNoValues = this.getValidEnumValues(this._yesNoValues$.getValue());
453
+ const mappedYesNoValues = validYesNoValues && validYesNoValues.length > 0 && this.mapEnumValues(validYesNoValues);
454
+ const formValue = this.formGroup.getRawValue();
455
+ const taskListColumn = {
456
+ title: formValue?.title ?? '',
457
+ key: formValue.key ?? '',
458
+ path: formValue.path ?? '',
459
+ displayType: {
460
+ type: formValue?.displayType?.key ?? '',
461
+ displayTypeParameters: {
462
+ ...(!!includeDateFormat && { dateFormat: formValue.dateFormat ?? '' }),
463
+ ...(includeEnum && mappedEnumValues && { enum: mappedEnumValues }),
464
+ ...(includeYesNo && mappedYesNoValues && { enum: mappedYesNoValues }),
465
+ },
466
+ },
467
+ sortable: formValue.sortable ?? false,
468
+ ...(formValue?.defaultSort?.key !== this._INVALID_KEY && {
469
+ defaultSort: formValue?.defaultSort?.key,
470
+ }),
471
+ };
472
+ return taskListColumn;
473
+ }
474
+ mapEnumValues(enumValues) {
475
+ return enumValues.reduce((acc, curr) => ({ ...acc, [curr?.key ?? '']: curr.value }), {});
476
+ }
477
+ getValidEnumValues(values) {
478
+ return (values || []).filter(value => value.value && value.key);
479
+ }
480
+ getListItemFromViewType(viewType) {
481
+ return {
482
+ content: this.translateService.instant(`listColumnDisplayType.${viewType}`),
483
+ key: viewType,
484
+ };
485
+ }
486
+ getMultiInputValuesFromTaskListColumnEnum(taskListColumnEnum) {
487
+ return Object.keys(taskListColumnEnum).reduce((acc, curr) => [...acc, { key: curr, value: taskListColumnEnum[curr] }], []);
488
+ }
489
+ prefillForm(column) {
490
+ if (column?.displayType?.type === ViewType.ENUM &&
491
+ column?.displayType?.displayTypeParameters?.enum) {
492
+ this._enumValues$.next(this.getMultiInputValuesFromTaskListColumnEnum(column.displayType.displayTypeParameters.enum));
493
+ }
494
+ if (column?.displayType?.type === ViewType.BOOLEAN &&
495
+ column?.displayType?.displayTypeParameters?.enum) {
496
+ this._yesNoValues$.next(this.getMultiInputValuesFromTaskListColumnEnum(column.displayType.displayTypeParameters.enum));
497
+ }
498
+ this.formGroup.patchValue({
499
+ key: column.key,
500
+ path: column.path,
501
+ sortable: column.sortable,
502
+ displayType: this.getListItemFromViewType(column.displayType.type),
503
+ ...(column.title && { title: column.title }),
504
+ ...(!column.defaultSort && {
505
+ defaultSort: this.getInvalidListItem(`listColumn.selectDefaultSort`),
506
+ }),
507
+ ...(column.defaultSort === 'ASC' && { defaultSort: this._SORT_ASC_ITEM }),
508
+ ...(column.defaultSort === 'DESC' && { defaultSort: this._SORT_DESC_ITEM }),
509
+ ...(column.displayType?.type === ViewType.DATE && {
510
+ dateFormat: column.displayType?.displayTypeParameters?.dateFormat,
511
+ }),
512
+ });
513
+ }
514
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementColumnModalComponent, deps: [{ token: i4.TranslateService }, { token: TaskManagementApiService }], target: i0.ɵɵFactoryTarget.Component }); }
515
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TaskManagementColumnModalComponent, isStandalone: true, selector: "valtimo-task-management-column-modal", inputs: { carbonTheme: "carbonTheme", taskListColumns: "taskListColumns", type: "type", show: "show", caseDefinitionKey: "caseDefinitionKey", selectedTaskListColumn: "selectedTaskListColumn" }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n show: show$ | async,\n type: type$ | async,\n isAdd: isAdd$ | async,\n isEdit: isEdit$ | async,\n disabled: disabled$ | async,\n showDateFormat: showDateFormat$ | async,\n showEnum: showEnum$ | async,\n showYesNo: showYesNo$ | async,\n disableDefaultSort: disableDefaultSort$ | async,\n enumValues: enumValues$ | async,\n enumValid: enumValid$ | async,\n yesNoValues: yesNoValues$ | async,\n viewTypeItems: viewTypeItems$ | async,\n sortItems: sortItems$ | async,\n } as obs\"\n>\n <cds-modal size=\"sm\" [open]=\"obs.show\" valtimoCdsModal (close)=\"closeModal()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{\n obs.type === 'add'\n ? ('listColumn.addButtonText' | translate)\n : ('listColumn.editColumnTitle' | translate)\n }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"list-column-form\">\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.titleTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.titleTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"title\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label\n [invalid]=\"key?.touched && key?.invalid\"\n [disabled]=\"obs.disabled || obs.isEdit\"\n [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n >\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.key' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.keyTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"key\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.path' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.pathTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"path\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.displayType' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <cds-dropdown\n *ngIf=\"obs.viewTypeItems\"\n cdsLayer\n formControlName=\"displayType\"\n [disabled]=\"obs.disabled\"\n >\n <cds-dropdown-list [items]=\"obs.viewTypeItems\"></cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showDateFormat\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.dateFormat' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"dateFormat\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showEnum\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.enumTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.enumTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <valtimo-carbon-multi-input\n *ngIf=\"obs.showEnum\"\n [fullWidth]=\"true\"\n [carbonTheme]=\"CARBON_THEME_WHITE\"\n [defaultValues]=\"obs.enumValues\"\n type=\"keyValue\"\n (valueChange)=\"enumValueChange($event)\"\n ></valtimo-carbon-multi-input>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showYesNo\" [ngClass]=\"'no-margin'\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.enumTitleOptional' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.enumTooltipOptional' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <valtimo-carbon-multi-input\n *ngIf=\"obs.showYesNo\"\n [fullWidth]=\"true\"\n [defaultValues]=\"obs.yesNoValues\"\n type=\"keyValue\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n (valueChange)=\"yesNoValueChange($event)\"\n ></valtimo-carbon-multi-input>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-checkbox formControlName=\"sortable\" [disabled]=\"obs.disabled\"\n >{{ 'listColumn.sortable' | translate }}\n </cds-checkbox>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled || obs.disableDefaultSort\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.defaultSortTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <cds-dropdown\n formControlName=\"defaultSort\"\n [disabled]=\"obs.disabled\"\n cdsLayer\n *ngIf=\"obs.sortItems\"\n >\n <cds-dropdown-list [items]=\"obs.sortItems\"></cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n </div>\n </form>\n\n <cds-modal-footer>\n <button (click)=\"closeModal()\" cdsButton=\"secondary\" [disabled]=\"obs.disabled\">\n {{ 'listColumn.close' | translate }}\n </button>\n\n <button\n (click)=\"save()\"\n cdsButton=\"primary\"\n [disabled]=\"obs.disabled || formGroup.invalid || (obs.showEnum && !obs.enumValid)\"\n >\n {{ 'listColumn.save' | translate }}\n </button>\n </cds-modal-footer>\n </cds-modal>\n</ng-container>\n", styles: [".cds--text-input__field-wrapper cds-label{width:100%}.cds--text-input__field-wrapper ::ng-deep .cds--label{width:100%}.cds--text-input__field-wrapper:not(:last-child){margin-bottom:16px}.label-with-tooltip{display:flex;align-items:center}.select-label{padding-bottom:8px}.list-column-form{margin-bottom:16px}.no-margin{margin-bottom:0!important}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TabsModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i2$1.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$1.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$1.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$1.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$1.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$1.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$1.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$1.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i2$1.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$1.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TooltipIconModule }, { kind: "component", type: i6.TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i6.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["addRowText", "addButtonType", "addRowTranslationKey", "arbitraryAmountTitles", "arbitraryValueAmount", "defaultValues", "deleteRowText", "deleteRowTranslationKey", "disabled", "dropdownColumnTitle", "dropdownItems", "dropdownWidth", "fullWidth", "hideAddButton", "hideDeleteButton", "initialAmountOfRows", "keyColumnTitle", "margin", "maxRows", "minimumAmountOfRows", "name", "required", "title", "titleTranslationKey", "tooltip", "type", "valueColumnTitle", "valuePathSelectorCaseDefinitionKey", "valuePathSelectorPrefixes", "valuePathSelectorShowCaseDefinitionSelector", "valuePathSelectorNotation", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$1.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$1.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
516
+ }
517
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementColumnModalComponent, decorators: [{
518
+ type: Component,
519
+ args: [{ selector: 'valtimo-task-management-column-modal', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
520
+ CommonModule,
521
+ CarbonListModule,
522
+ TranslateModule,
523
+ TabsModule,
524
+ FormsModule,
525
+ ModalModule,
526
+ CheckboxModule,
527
+ DropdownModule,
528
+ InputModule,
529
+ ReactiveFormsModule,
530
+ TooltipIconModule,
531
+ CarbonMultiInputModule,
532
+ ButtonModule,
533
+ ValtimoCdsModalDirective,
534
+ LayerModule,
535
+ ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n show: show$ | async,\n type: type$ | async,\n isAdd: isAdd$ | async,\n isEdit: isEdit$ | async,\n disabled: disabled$ | async,\n showDateFormat: showDateFormat$ | async,\n showEnum: showEnum$ | async,\n showYesNo: showYesNo$ | async,\n disableDefaultSort: disableDefaultSort$ | async,\n enumValues: enumValues$ | async,\n enumValid: enumValid$ | async,\n yesNoValues: yesNoValues$ | async,\n viewTypeItems: viewTypeItems$ | async,\n sortItems: sortItems$ | async,\n } as obs\"\n>\n <cds-modal size=\"sm\" [open]=\"obs.show\" valtimoCdsModal (close)=\"closeModal()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{\n obs.type === 'add'\n ? ('listColumn.addButtonText' | translate)\n : ('listColumn.editColumnTitle' | translate)\n }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"list-column-form\">\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.titleTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.titleTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"title\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label\n [invalid]=\"key?.touched && key?.invalid\"\n [disabled]=\"obs.disabled || obs.isEdit\"\n [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n >\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.key' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.keyTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"key\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.path' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.pathTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"path\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.displayType' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <cds-dropdown\n *ngIf=\"obs.viewTypeItems\"\n cdsLayer\n formControlName=\"displayType\"\n [disabled]=\"obs.disabled\"\n >\n <cds-dropdown-list [items]=\"obs.viewTypeItems\"></cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showDateFormat\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip\">\n {{ 'listColumn.dateFormat' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <input cdsText cdsLayer formControlName=\"dateFormat\" />\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showEnum\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.enumTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.enumTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <valtimo-carbon-multi-input\n *ngIf=\"obs.showEnum\"\n [fullWidth]=\"true\"\n [carbonTheme]=\"CARBON_THEME_WHITE\"\n [defaultValues]=\"obs.enumValues\"\n type=\"keyValue\"\n (valueChange)=\"enumValueChange($event)\"\n ></valtimo-carbon-multi-input>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\" *ngIf=\"obs.showYesNo\" [ngClass]=\"'no-margin'\">\n <cds-label [disabled]=\"obs.disabled\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.enumTitleOptional' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.enumTooltipOptional' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <valtimo-carbon-multi-input\n *ngIf=\"obs.showYesNo\"\n [fullWidth]=\"true\"\n [defaultValues]=\"obs.yesNoValues\"\n type=\"keyValue\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n (valueChange)=\"yesNoValueChange($event)\"\n ></valtimo-carbon-multi-input>\n </cds-label>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-checkbox formControlName=\"sortable\" [disabled]=\"obs.disabled\"\n >{{ 'listColumn.sortable' | translate }}\n </cds-checkbox>\n </div>\n\n <div class=\"cds--text-input__field-wrapper\">\n <cds-label [disabled]=\"obs.disabled || obs.disableDefaultSort\">\n <span class=\"label-with-tooltip select-label\">\n {{ 'listColumn.defaultSortTitle' | translate }}\n\n <v-tooltip-icon\n [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n [disabled]=\"obs.disabled\"\n ></v-tooltip-icon>\n </span>\n\n <cds-dropdown\n formControlName=\"defaultSort\"\n [disabled]=\"obs.disabled\"\n cdsLayer\n *ngIf=\"obs.sortItems\"\n >\n <cds-dropdown-list [items]=\"obs.sortItems\"></cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n </div>\n </form>\n\n <cds-modal-footer>\n <button (click)=\"closeModal()\" cdsButton=\"secondary\" [disabled]=\"obs.disabled\">\n {{ 'listColumn.close' | translate }}\n </button>\n\n <button\n (click)=\"save()\"\n cdsButton=\"primary\"\n [disabled]=\"obs.disabled || formGroup.invalid || (obs.showEnum && !obs.enumValid)\"\n >\n {{ 'listColumn.save' | translate }}\n </button>\n </cds-modal-footer>\n </cds-modal>\n</ng-container>\n", styles: [".cds--text-input__field-wrapper cds-label{width:100%}.cds--text-input__field-wrapper ::ng-deep .cds--label{width:100%}.cds--text-input__field-wrapper:not(:last-child){margin-bottom:16px}.label-with-tooltip{display:flex;align-items:center}.select-label{padding-bottom:8px}.list-column-form{margin-bottom:16px}.no-margin{margin-bottom:0!important}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
536
+ }], ctorParameters: () => [{ type: i4.TranslateService }, { type: TaskManagementApiService }], propDecorators: { carbonTheme: [{
537
+ type: Input
538
+ }], taskListColumns: [{
539
+ type: Input
540
+ }], type: [{
541
+ type: Input
542
+ }], show: [{
543
+ type: Input
544
+ }], caseDefinitionKey: [{
545
+ type: Input
546
+ }], selectedTaskListColumn: [{
547
+ type: Input
548
+ }], closeEvent: [{
549
+ type: Output
550
+ }] } });
551
+
552
+ /*
553
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
554
+ *
555
+ * Licensed under EUPL, Version 1.2 (the "License");
556
+ * you may not use this file except in compliance with the License.
557
+ * You may obtain a copy of the License at
558
+ *
559
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
560
+ *
561
+ * Unless required by applicable law or agreed to in writing, software
562
+ * distributed under the License is distributed on an "AS IS" basis,
563
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
564
+ * See the License for the specific language governing permissions and
565
+ * limitations under the License.
566
+ */
567
+ class TaskManagementColumnsComponent {
568
+ constructor(route, taskManagementApiService, translateService) {
569
+ this.route = route;
570
+ this.taskManagementApiService = taskManagementApiService;
571
+ this.translateService = translateService;
572
+ this.carbonTheme = CARBON_THEME.G10;
573
+ this._refreshColumns$ = new BehaviorSubject(null);
574
+ this.caseDefinitionKey$ = getCaseManagementRouteParams(this.route).pipe(map((params) => (!params ? '' : params.caseDefinitionKey)));
575
+ this.loadingColumns$ = new BehaviorSubject(true);
576
+ this.selectedTaskListColumn$ = new Subject();
577
+ this.cachedTaskListColumns$ = new BehaviorSubject([]);
578
+ this.taskListColumns$ = combineLatest([
579
+ this.caseDefinitionKey$,
580
+ this._refreshColumns$,
581
+ this.translateService.stream('key'),
582
+ ]).pipe(tap(([_, refresh]) => {
583
+ if (refresh !== 'noAnimation')
584
+ this.loadingColumns$.next(true);
585
+ }), switchMap(([caseDefinitionKey]) => this.taskManagementApiService.getTaskListColumns(caseDefinitionKey)), tap(columns => {
586
+ this.cachedTaskListColumns$.next(columns);
587
+ }), map(columns => columns.map(column => ({
588
+ ...column,
589
+ title: column.title || '-',
590
+ sortable: column.sortable
591
+ ? this.translateService.instant('listColumn.sortableYes')
592
+ : this.translateService.instant('listColumn.sortableNo'),
593
+ defaultSort: (column.defaultSort === 'ASC' &&
594
+ this.translateService.instant('listColumn.sortableAsc')) ||
595
+ (column.defaultSort === 'DESC' &&
596
+ this.translateService.instant('listColumn.sortableDesc')) ||
597
+ '-',
598
+ displayType: this.translateService.instant(`listColumnDisplayType.${column?.displayType?.type}`),
599
+ displayTypeParameters: this.getDisplayTypeParametersView(column?.displayType?.displayTypeParameters),
600
+ }))), tap(() => {
601
+ this.enable();
602
+ this.loadingColumns$.next(false);
603
+ }));
604
+ this.showDeleteModal$ = new Subject();
605
+ this.deleteColumnKey$ = new BehaviorSubject('');
606
+ this.disabled$ = new BehaviorSubject(true);
607
+ this.fields = [
608
+ {
609
+ viewType: 'string',
610
+ sortable: false,
611
+ key: 'title',
612
+ label: 'listColumn.title',
613
+ },
614
+ {
615
+ viewType: 'string',
616
+ sortable: false,
617
+ key: 'key',
618
+ label: 'listColumn.key',
619
+ },
620
+ {
621
+ viewType: 'string',
622
+ sortable: false,
623
+ key: 'path',
624
+ label: 'listColumn.path',
625
+ },
626
+ {
627
+ viewType: 'string',
628
+ sortable: false,
629
+ key: 'displayType',
630
+ label: 'listColumn.displayType',
631
+ },
632
+ {
633
+ viewType: 'string',
634
+ sortable: false,
635
+ key: 'displayTypeParameters',
636
+ label: 'listColumn.displayTypeParameters',
637
+ },
638
+ {
639
+ viewType: 'string',
640
+ sortable: false,
641
+ key: 'sortable',
642
+ label: 'listColumn.sortable',
643
+ },
644
+ {
645
+ viewType: 'string',
646
+ sortable: false,
647
+ key: 'defaultSort',
648
+ label: 'listColumn.defaultSort',
649
+ },
650
+ ];
651
+ this.actionItems = [
652
+ {
653
+ label: 'interface.edit',
654
+ callback: this.editColumn.bind(this),
655
+ },
656
+ {
657
+ label: 'interface.delete',
658
+ callback: this.deleteColumn.bind(this),
659
+ type: 'danger',
660
+ },
661
+ ];
662
+ this.modalType$ = new Subject();
663
+ this.showModal$ = new Subject();
664
+ }
665
+ refreshColumns(noAnimation = false) {
666
+ this._refreshColumns$.next(noAnimation ? 'noAnimation' : null);
667
+ }
668
+ deleteColumn(taskListColumn) {
669
+ this.showDeleteModal$.next(true);
670
+ this.deleteColumnKey$.next(taskListColumn.key);
671
+ }
672
+ onItemsReordered(reorderedItems, caseDefinitionKey) {
673
+ this.disable();
674
+ this.taskManagementApiService
675
+ .updateTaskListColumnOrder(caseDefinitionKey, reorderedItems.map((column) => column.key))
676
+ .subscribe({
677
+ next: () => {
678
+ this.refreshColumns(true);
679
+ },
680
+ error: () => this.enable(),
681
+ });
682
+ }
683
+ editColumn(columnItem) {
684
+ this.cachedTaskListColumns$.pipe(take(1)).subscribe(cachedTaskListColumns => {
685
+ const selectedTaskListColumn = cachedTaskListColumns.find(column => column.key === columnItem.key);
686
+ this.selectedTaskListColumn$.next(selectedTaskListColumn ?? null);
687
+ this.showModal('edit');
688
+ });
689
+ }
690
+ showModal(type) {
691
+ this.modalType$.next(type);
692
+ this.showModal$.next(true);
693
+ }
694
+ onModalCloseEvent(event) {
695
+ this.showModal$.next(false);
696
+ if (event === 'refresh') {
697
+ this.disable();
698
+ this.refreshColumns();
699
+ }
700
+ setTimeout(() => {
701
+ this.clearSelectedTaskListColumn();
702
+ }, CARBON_CONSTANTS.modalAnimationMs);
703
+ }
704
+ deleteColumnConfirmation(columnKey, caseDefinitionKey) {
705
+ this.disable();
706
+ this.taskManagementApiService.deleteTaskListColumn(caseDefinitionKey, columnKey).subscribe({
707
+ next: () => {
708
+ this.refreshColumns(true);
709
+ },
710
+ error: () => this.enable(),
711
+ });
712
+ }
713
+ getDisplayTypeParametersView(displayTypeParameters) {
714
+ if (!displayTypeParameters)
715
+ return '-';
716
+ if (displayTypeParameters?.dateFormat) {
717
+ return displayTypeParameters.dateFormat;
718
+ }
719
+ else if (displayTypeParameters?.enum) {
720
+ return Object.keys(displayTypeParameters.enum).reduce((acc, curr) => {
721
+ const keyValuePairString = `${curr}: ${displayTypeParameters?.enum?.[curr]}`;
722
+ if (!acc)
723
+ return `${keyValuePairString}`;
724
+ return `${acc}, ${keyValuePairString}`;
725
+ }, '');
726
+ }
727
+ return '-';
728
+ }
729
+ disable() {
730
+ this.disabled$.next(true);
731
+ }
732
+ enable() {
733
+ this.disabled$.next(false);
734
+ }
735
+ clearSelectedTaskListColumn() {
736
+ this.selectedTaskListColumn$.next(null);
737
+ }
738
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementColumnsComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: TaskManagementApiService }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
739
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TaskManagementColumnsComponent, isStandalone: true, selector: "valtimo-task-management-columns", inputs: { carbonTheme: "carbonTheme" }, providers: [TaskManagementService], ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n taskListColumns: taskListColumns$ | async,\n cachedTaskListColumns: cachedTaskListColumns$ | async,\n caseDefinitionKey: caseDefinitionKey$ | async,\n loadingColumns: loadingColumns$ | async,\n modalType: modalType$ | async,\n showModal: showModal$ | async,\n } as obs\"\n>\n <valtimo-carbon-list\n [actionItems]=\"actionItems\"\n [items]=\"obs.taskListColumns\"\n [loading]=\"obs.loadingColumns\"\n [fields]=\"fields\"\n [header]=\"false\"\n [dragAndDrop]=\"true\"\n (rowClicked)=\"editColumn($event)\"\n (itemsReordered)=\"onItemsReordered($event, obs.caseDefinitionKey)\"\n >\n <ng-container carbonToolbarContent [ngTemplateOutlet]=\"addButton\"></ng-container>\n\n <valtimo-no-results\n [action]=\"addButton\"\n [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n [description]=\"'listColumn.noConfigWarning' | translate\"\n illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n ></valtimo-no-results>\n </valtimo-carbon-list>\n\n <valtimo-task-management-column-modal\n [taskListColumns]=\"obs.cachedTaskListColumns\"\n [type]=\"obs.modalType\"\n [show]=\"obs.showModal\"\n [caseDefinitionKey]=\"obs.caseDefinitionKey\"\n [selectedTaskListColumn]=\"selectedTaskListColumn$ | async\"\n (closeEvent)=\"onModalCloseEvent($event)\"\n ></valtimo-task-management-column-modal>\n\n <valtimo-confirmation-modal\n [showModalSubject$]=\"showDeleteModal$\"\n [outputOnConfirm]=\"deleteColumnKey$ | async\"\n (confirmEvent)=\"deleteColumnConfirmation($event, obs.caseDefinitionKey)\"\n confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n titleTranslationKey=\"listColumn.deleteColumn\"\n contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n ></valtimo-confirmation-modal>\n</ng-container>\n\n<ng-template #addButton>\n <button\n carbonToolbarContent\n cdsButton=\"primary\"\n [disabled]=\"disabled$ | async\"\n (click)=\"showModal('add')\"\n >\n {{ 'listColumn.addButtonText' | translate }}\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i6.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i6.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: TaskManagementColumnModalComponent, selector: "valtimo-task-management-column-modal", inputs: ["carbonTheme", "taskListColumns", "type", "show", "caseDefinitionKey", "selectedTaskListColumn"], outputs: ["closeEvent"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$1.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$1.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: i6.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
740
+ }
741
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementColumnsComponent, decorators: [{
742
+ type: Component,
743
+ args: [{ selector: 'valtimo-task-management-columns', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
744
+ CommonModule,
745
+ CarbonListModule,
746
+ TranslateModule,
747
+ TabsModule,
748
+ TaskManagementColumnModalComponent,
749
+ ButtonModule,
750
+ IconModule,
751
+ ConfirmationModalModule,
752
+ ], providers: [TaskManagementService], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n taskListColumns: taskListColumns$ | async,\n cachedTaskListColumns: cachedTaskListColumns$ | async,\n caseDefinitionKey: caseDefinitionKey$ | async,\n loadingColumns: loadingColumns$ | async,\n modalType: modalType$ | async,\n showModal: showModal$ | async,\n } as obs\"\n>\n <valtimo-carbon-list\n [actionItems]=\"actionItems\"\n [items]=\"obs.taskListColumns\"\n [loading]=\"obs.loadingColumns\"\n [fields]=\"fields\"\n [header]=\"false\"\n [dragAndDrop]=\"true\"\n (rowClicked)=\"editColumn($event)\"\n (itemsReordered)=\"onItemsReordered($event, obs.caseDefinitionKey)\"\n >\n <ng-container carbonToolbarContent [ngTemplateOutlet]=\"addButton\"></ng-container>\n\n <valtimo-no-results\n [action]=\"addButton\"\n [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n [description]=\"'listColumn.noConfigWarning' | translate\"\n illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n ></valtimo-no-results>\n </valtimo-carbon-list>\n\n <valtimo-task-management-column-modal\n [taskListColumns]=\"obs.cachedTaskListColumns\"\n [type]=\"obs.modalType\"\n [show]=\"obs.showModal\"\n [caseDefinitionKey]=\"obs.caseDefinitionKey\"\n [selectedTaskListColumn]=\"selectedTaskListColumn$ | async\"\n (closeEvent)=\"onModalCloseEvent($event)\"\n ></valtimo-task-management-column-modal>\n\n <valtimo-confirmation-modal\n [showModalSubject$]=\"showDeleteModal$\"\n [outputOnConfirm]=\"deleteColumnKey$ | async\"\n (confirmEvent)=\"deleteColumnConfirmation($event, obs.caseDefinitionKey)\"\n confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n titleTranslationKey=\"listColumn.deleteColumn\"\n contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n ></valtimo-confirmation-modal>\n</ng-container>\n\n<ng-template #addButton>\n <button\n carbonToolbarContent\n cdsButton=\"primary\"\n [disabled]=\"disabled$ | async\"\n (click)=\"showModal('add')\"\n >\n {{ 'listColumn.addButtonText' | translate }}\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n" }]
753
+ }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: TaskManagementApiService }, { type: i4.TranslateService }], propDecorators: { carbonTheme: [{
754
+ type: Input
755
+ }] } });
756
+
757
+ /*
758
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
759
+ *
760
+ * Licensed under EUPL, Version 1.2 (the "License");
761
+ * you may not use this file except in compliance with the License.
762
+ * You may obtain a copy of the License at
763
+ *
764
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
765
+ *
766
+ * Unless required by applicable law or agreed to in writing, software
767
+ * distributed under the License is distributed on an "AS IS" basis,
768
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
769
+ * See the License for the specific language governing permissions and
770
+ * limitations under the License.
771
+ */
772
+ class TaskManagementSearchFieldsModalComponent {
773
+ set caseDefinitionKey(value) {
774
+ this.caseDefinitionKey$.next(value);
775
+ }
776
+ set prefillData(value) {
777
+ this._prefillData = value;
778
+ this.setPrefilledForm(value);
779
+ }
780
+ get prefillData() {
781
+ return this._prefillData;
782
+ }
783
+ get dataType() {
784
+ return this.form.get('dataType');
785
+ }
786
+ get dataTypeValue$() {
787
+ return this.dataType?.valueChanges.pipe(startWith(this.dataType.value)) ?? of(null);
788
+ }
789
+ get matchType() {
790
+ return this.form.get('matchType');
791
+ }
792
+ get matchTypeValue$() {
793
+ return this.matchType?.valueChanges.pipe(startWith(this.matchType.value)) ?? of(null);
794
+ }
795
+ get dropdownDataProvider() {
796
+ return this.form.get('dropdownDataProvider');
797
+ }
798
+ get dropdownDataProviderValue$() {
799
+ return (this.dropdownDataProvider?.valueChanges.pipe(startWith(this.dropdownDataProvider.value)) ??
800
+ of(null));
801
+ }
802
+ get fieldType() {
803
+ return this.form.get('fieldType');
804
+ }
805
+ get fieldTypeValue$() {
806
+ return this.fieldType?.valueChanges.pipe(startWith(this.fieldType.value)) ?? of(null);
807
+ }
808
+ get keyValue() {
809
+ const controlValue = this.form.get('key')?.value;
810
+ return !controlValue ? null : controlValue;
811
+ }
812
+ get dataTypeValue() {
813
+ const controlValue = this.form.get('dataType')?.value;
814
+ this._dataTypeValue$.next(controlValue?.id);
815
+ return !controlValue ? null : controlValue.id;
816
+ }
817
+ get fieldTypeValue() {
818
+ const controlValue = this.form.get('fieldType')?.value;
819
+ return !controlValue ? null : controlValue.id;
820
+ }
821
+ get dropdownDataProviderValue() {
822
+ const controlValue = this.form.get('dropdownDataProvider')?.value;
823
+ this._dropdownProviderValue$.next(controlValue?.id);
824
+ return !controlValue ? null : controlValue.id;
825
+ }
826
+ get dropdownValuesArray() {
827
+ const formArray = this.form.get('dropdownValues');
828
+ return !formArray ? null : formArray;
829
+ }
830
+ constructor(documentService, iconService, fb, translateService) {
831
+ this.documentService = documentService;
832
+ this.iconService = iconService;
833
+ this.fb = fb;
834
+ this.translateService = translateService;
835
+ this.caseDefinitionKey$ = new BehaviorSubject('');
836
+ this.closeEvent = new EventEmitter();
837
+ this.form = this.fb.group({
838
+ key: this.fb.control('', Validators.required),
839
+ title: this.fb.control('', Validators.required),
840
+ path: this.fb.control('', Validators.required),
841
+ dataType: this.fb.control(null, Validators.required),
842
+ matchType: this.fb.control(null, this.matchTypeValidator),
843
+ fieldType: this.fb.control(null, Validators.required),
844
+ dropdownDataProvider: this.fb.control(null),
845
+ dropdownValues: this.fb.array([]),
846
+ });
847
+ this.TaskListSearchFieldDataType = TaskListSearchFieldDataType;
848
+ this.TaskListSearchFieldFieldType = TaskListSearchFieldFieldType;
849
+ this.TaskListSearchDropdownDataProvider = TaskListSearchDropdownDataProvider;
850
+ this.DROPDOWN_FIELDS = [
851
+ {
852
+ key: 'key',
853
+ label: 'searchFieldsOverview.key',
854
+ viewType: ViewType.TEXT,
855
+ },
856
+ {
857
+ key: 'value',
858
+ label: 'searchFieldsOverview.text',
859
+ viewType: ViewType.TEXT,
860
+ },
861
+ ];
862
+ this._dataTypeValue$ = new BehaviorSubject(null);
863
+ this._dropdownProviderValue$ = new BehaviorSubject(null);
864
+ this.dropdownReadonlyItems$ = this._dropdownProviderValue$.pipe(distinctUntilChanged$1(), filter(val => !!val && val === TaskListSearchDropdownDataProvider.JSON), switchMap((provider) => this.documentService.getDropdownData(provider ?? '', this.caseDefinitionKey$.getValue() ?? '', this.keyValue ?? '')), map(dropdownData => dropdownData ? Object.entries(dropdownData).map(([key, value]) => ({ key, value })) : []));
865
+ this.dataTypeItems$ = combineLatest([
866
+ this.dataTypeValue$,
867
+ this.translateService.stream('key'),
868
+ ]).pipe(map(([dataTypeValue]) => [
869
+ {
870
+ content: this.translateService.instant('searchFields.text'),
871
+ id: TaskListSearchFieldDataType.TEXT,
872
+ },
873
+ {
874
+ content: this.translateService.instant('searchFields.boolean'),
875
+ id: TaskListSearchFieldDataType.BOOLEAN,
876
+ },
877
+ {
878
+ content: this.translateService.instant('searchFields.date'),
879
+ id: TaskListSearchFieldDataType.DATE,
880
+ },
881
+ {
882
+ content: this.translateService.instant('searchFields.datetime'),
883
+ id: TaskListSearchFieldDataType.DATETIME,
884
+ },
885
+ {
886
+ content: this.translateService.instant('searchFields.number'),
887
+ id: TaskListSearchFieldDataType.NUMBER,
888
+ },
889
+ {
890
+ content: this.translateService.instant('searchFields.time'),
891
+ id: TaskListSearchFieldDataType.TIME,
892
+ },
893
+ ].map(item => ({ ...item, selected: item.id === dataTypeValue?.id }))));
894
+ this.fieldTypeItems$ = combineLatest([
895
+ this._dataTypeValue$.pipe(distinctUntilChanged$1()),
896
+ this.fieldTypeValue$,
897
+ this.translateService.stream('key'),
898
+ ]).pipe(map(([dataTypeValue, fieldTypeValue]) => [
899
+ {
900
+ content: this.translateService.instant('searchFieldsOverview.single'),
901
+ id: TaskListSearchFieldFieldType.SINGLE,
902
+ },
903
+ {
904
+ content: this.translateService.instant('searchFieldsOverview.range'),
905
+ id: TaskListSearchFieldFieldType.RANGE,
906
+ },
907
+ ...(dataTypeValue === TaskListSearchFieldDataType.TEXT
908
+ ? [
909
+ {
910
+ content: this.translateService.instant('searchFieldsOverview.single-select-dropdown'),
911
+ id: TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN,
912
+ },
913
+ {
914
+ content: this.translateService.instant('searchFieldsOverview.multi-select-dropdown'),
915
+ id: TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN,
916
+ },
917
+ ]
918
+ : []),
919
+ ].map(item => ({ ...item, selected: item.id === fieldTypeValue?.id }))));
920
+ this.dataProviderItems$ = this.translateService
921
+ .stream('key')
922
+ .pipe(switchMap(() => this.dropdownDataProviderValue$), map(dataProviderValue => [
923
+ {
924
+ content: this.translateService.instant('searchFieldsOverview.dropdownDatabaseDataProvider'),
925
+ id: TaskListSearchDropdownDataProvider.DATABASE,
926
+ },
927
+ {
928
+ content: this.translateService.instant('searchFieldsOverview.dropdownJsonFileDataProvider'),
929
+ id: TaskListSearchDropdownDataProvider.JSON,
930
+ },
931
+ ].map(item => ({ ...item, selected: item.id === dataProviderValue?.id }))));
932
+ this.matchTypeItems$ = this.translateService
933
+ .stream('key')
934
+ .pipe(switchMap(() => this.matchTypeValue$), map(matchTypeValue => [
935
+ {
936
+ content: this.translateService.instant('searchFieldsOverview.like'),
937
+ id: TaskListSearchFieldMatchType.LIKE,
938
+ },
939
+ {
940
+ content: this.translateService.instant('searchFieldsOverview.exact'),
941
+ id: TaskListSearchFieldMatchType.EXACT,
942
+ },
943
+ ].map(item => ({ ...item, selected: item.id === matchTypeValue?.id }))));
944
+ this.ValuePathSelectorPrefix = ValuePathSelectorPrefix;
945
+ this.iconService.registerAll([TrashCan16, InformationFilled16]);
946
+ }
947
+ ngOnInit() {
948
+ this.form.setValidators([this.dropdownDataProviderValidator, this.dropdownValuesValidator]);
949
+ }
950
+ addDropdownValue(prefillValue) {
951
+ if (!this.dropdownValuesArray)
952
+ return;
953
+ this.dropdownValuesArray.push(this.fb.group({
954
+ key: this.fb.control(prefillValue?.key ?? '', Validators.required),
955
+ value: this.fb.control(prefillValue?.value ?? '', Validators.required),
956
+ }));
957
+ }
958
+ removeDropdownValue(index) {
959
+ if (!this.dropdownValuesArray)
960
+ return;
961
+ this.dropdownValuesArray.removeAt(index);
962
+ }
963
+ onCancel() {
964
+ this.closeEvent.emit(null);
965
+ this.resetForm();
966
+ }
967
+ onSave() {
968
+ const groupValue = this.form.getRawValue();
969
+ this.closeEvent.emit({
970
+ ...(groupValue.title && { title: groupValue.title }),
971
+ ...(groupValue.key && { key: groupValue.key }),
972
+ ...(groupValue.path && { path: groupValue.path }),
973
+ ...(groupValue.dataType?.content && { dataType: groupValue.dataType.id }),
974
+ ...(groupValue.matchType?.content && { matchType: groupValue.matchType.id }),
975
+ ...(groupValue.fieldType?.content && { fieldType: groupValue.fieldType.id }),
976
+ ...(groupValue.dropdownDataProvider?.content && {
977
+ dropdownDataProvider: groupValue.dropdownDataProvider.id,
978
+ }),
979
+ ...(groupValue.dropdownValues && {
980
+ dropdownValues: groupValue.dropdownValues.reduce((acc, curr) => ({ ...acc, ...(!!curr?.key && { [curr.key]: curr.value }) }), {}),
981
+ }),
982
+ });
983
+ this.resetForm();
984
+ }
985
+ setPrefilledForm(prefillData) {
986
+ if (!prefillData)
987
+ return;
988
+ this.form.patchValue({
989
+ ...prefillData,
990
+ dataType: !prefillData.dataType
991
+ ? null
992
+ : {
993
+ content: prefillData.dataType,
994
+ id: prefillData.dataType,
995
+ selected: true,
996
+ },
997
+ matchType: !prefillData.matchType
998
+ ? null
999
+ : {
1000
+ content: prefillData.matchType,
1001
+ id: prefillData.matchType,
1002
+ selected: true,
1003
+ },
1004
+ fieldType: !prefillData.fieldType
1005
+ ? null
1006
+ : {
1007
+ content: prefillData.fieldType,
1008
+ id: prefillData.fieldType,
1009
+ selected: true,
1010
+ },
1011
+ dropdownDataProvider: !prefillData.dropdownDataProvider
1012
+ ? null
1013
+ : {
1014
+ content: prefillData.dropdownDataProvider,
1015
+ id: prefillData.dropdownDataProvider,
1016
+ selected: true,
1017
+ },
1018
+ dropdownValues: [],
1019
+ });
1020
+ if (prefillData.dropdownDataProvider && prefillData.dropdownValues)
1021
+ this.setPrefilledDropdownValues(prefillData.dropdownValues);
1022
+ this.form.get('key')?.disable();
1023
+ }
1024
+ setPrefilledDropdownValues(dropdownValue) {
1025
+ if (!this.dropdownValuesArray || !this.dropdownDataProviderValue)
1026
+ return;
1027
+ Object.entries(dropdownValue).forEach(([key, value]) => {
1028
+ this.addDropdownValue({ key, value });
1029
+ });
1030
+ }
1031
+ matchTypeValidator(control) {
1032
+ const controlValue = control.value;
1033
+ const dataTypeControlValue = control.parent?.get('dataType')?.value;
1034
+ if (dataTypeControlValue?.id === TaskListSearchFieldDataType.TEXT &&
1035
+ (!controlValue || !controlValue.selected))
1036
+ return { error: 'Match type not selected' };
1037
+ return null;
1038
+ }
1039
+ dropdownDataProviderValidator(group) {
1040
+ const controlValue = group.get('dropdownDataProvider')?.value;
1041
+ const fieldTypeControlValue = group.get('fieldType')?.value;
1042
+ if ([
1043
+ TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN,
1044
+ TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN,
1045
+ ].includes(fieldTypeControlValue?.id) &&
1046
+ !controlValue)
1047
+ return { error: 'Dropdown source provider is not specified' };
1048
+ return null;
1049
+ }
1050
+ dropdownValuesValidator(group) {
1051
+ const controlValue = group.get('dropdownValues')?.value;
1052
+ const fieldTypeControlValue = group.get('fieldType')?.value?.id;
1053
+ const dropdownProviderValue = group.get('dropdownDataProvider')?.value?.id;
1054
+ if ([
1055
+ TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN,
1056
+ TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN,
1057
+ ].includes(fieldTypeControlValue) &&
1058
+ (!controlValue || controlValue?.length === 0) &&
1059
+ dropdownProviderValue === TaskListSearchDropdownDataProvider.DATABASE)
1060
+ return { error: 'Dropdown source provider is not specified or is empty' };
1061
+ return null;
1062
+ }
1063
+ resetForm() {
1064
+ setTimeout(() => {
1065
+ while (!!this.dropdownValuesArray?.length) {
1066
+ this.dropdownValuesArray.removeAt(0);
1067
+ }
1068
+ this.form.reset();
1069
+ this.form.enable();
1070
+ }, CARBON_CONSTANTS.modalAnimationMs);
1071
+ }
1072
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsModalComponent, deps: [{ token: i1$2.DocumentService }, { token: i2$1.IconService }, { token: i3.FormBuilder }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
1073
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: TaskManagementSearchFieldsModalComponent, isStandalone: true, selector: "valtimo-task-management-search-fields-modal", inputs: { open: "open", caseDefinitionKey: "caseDefinitionKey", prefillData: "prefillData" }, outputs: { closeEvent: "closeEvent" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n<cds-modal [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form\n cdsModalContent\n [formGroup]=\"form\"\n class=\"valtimo-task-management-search-fields-modal__content\"\n >\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input\n data-testid=\"task-management-search-title\"\n cdsText\n type=\"text\"\n formControlName=\"title\"\n cdsLayer\n />\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.key' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n >\n </v-input-label>\n\n <input\n cdsLayer\n data-testid=\"task-management-search-key\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n />\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-dataType\"\n formControlName=\"dataType\"\n >\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === TaskListSearchFieldDataType.TEXT) {\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-matchType\"\n formControlName=\"matchType\"\n >\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-fieldType\"\n formControlName=\"fieldType\"\n >\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (\n dataTypeValue === TaskListSearchFieldDataType.TEXT &&\n (fieldTypeValue === TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"task-management-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === TaskListSearchDropdownDataProvider.DATABASE) {\n <div\n class=\"valtimo-task-management-search-fields-modal__list\"\n formArrayName=\"dropdownValues\"\n >\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form\n [formGroup]=\"dropdownValue\"\n class=\"valtimo-task-management-search-fields-modal__dropdown-values\"\n >\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"task-management-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"task-management-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"task-management-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"task-management-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n } @else if (dropdownDataProviderValue === TaskListSearchDropdownDataProvider.JSON) {\n <valtimo-carbon-list\n [header]=\"false\"\n [hideToolbar]=\"true\"\n [fields]=\"DROPDOWN_FIELDS\"\n [items]=\"dropdownReadonlyItems$ | async\"\n ></valtimo-carbon-list>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"task-management-search-cancel\" cdsButton=\"secondary\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"task-management-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"form.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-task-management-search-fields-modal__content,.valtimo-task-management-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-task-management-search-fields-modal__content{flex-direction:column}.valtimo-task-management-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-task-management-search-fields-modal__label{display:flex;gap:4px}.valtimo-task-management-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$1.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$1.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$1.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i2$1.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i2$1.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i2$1.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$1.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$1.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$1.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$1.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$1.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i6.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i6.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$1.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1074
+ }
1075
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsModalComponent, decorators: [{
1076
+ type: Component,
1077
+ args: [{ selector: 'valtimo-task-management-search-fields-modal', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
1078
+ CommonModule,
1079
+ TranslateModule,
1080
+ ButtonModule,
1081
+ DropdownModule,
1082
+ InputModule,
1083
+ ModalModule,
1084
+ ReactiveFormsModule,
1085
+ IconModule,
1086
+ CarbonListModule,
1087
+ InputLabelModule,
1088
+ ValuePathSelectorComponent,
1089
+ LayerModule,
1090
+ ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n<cds-modal [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form\n cdsModalContent\n [formGroup]=\"form\"\n class=\"valtimo-task-management-search-fields-modal__content\"\n >\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input\n data-testid=\"task-management-search-title\"\n cdsText\n type=\"text\"\n formControlName=\"title\"\n cdsLayer\n />\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.key' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n >\n </v-input-label>\n\n <input\n cdsLayer\n data-testid=\"task-management-search-key\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n />\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-dataType\"\n formControlName=\"dataType\"\n >\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === TaskListSearchFieldDataType.TEXT) {\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-matchType\"\n formControlName=\"matchType\"\n >\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n cdsLayer\n data-testid=\"task-management-search-fieldType\"\n formControlName=\"fieldType\"\n >\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (\n dataTypeValue === TaskListSearchFieldDataType.TEXT &&\n (fieldTypeValue === TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-task-management-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"task-management-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === TaskListSearchDropdownDataProvider.DATABASE) {\n <div\n class=\"valtimo-task-management-search-fields-modal__list\"\n formArrayName=\"dropdownValues\"\n >\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form\n [formGroup]=\"dropdownValue\"\n class=\"valtimo-task-management-search-fields-modal__dropdown-values\"\n >\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"task-management-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"task-management-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"task-management-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"task-management-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n } @else if (dropdownDataProviderValue === TaskListSearchDropdownDataProvider.JSON) {\n <valtimo-carbon-list\n [header]=\"false\"\n [hideToolbar]=\"true\"\n [fields]=\"DROPDOWN_FIELDS\"\n [items]=\"dropdownReadonlyItems$ | async\"\n ></valtimo-carbon-list>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"task-management-search-cancel\" cdsButton=\"secondary\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"task-management-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"form.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-task-management-search-fields-modal__content,.valtimo-task-management-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-task-management-search-fields-modal__content{flex-direction:column}.valtimo-task-management-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-task-management-search-fields-modal__label{display:flex;gap:4px}.valtimo-task-management-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
1091
+ }], ctorParameters: () => [{ type: i1$2.DocumentService }, { type: i2$1.IconService }, { type: i3.FormBuilder }, { type: i4.TranslateService }], propDecorators: { open: [{
1092
+ type: Input,
1093
+ args: [{ required: true }]
1094
+ }], caseDefinitionKey: [{
1095
+ type: Input,
1096
+ args: [{ required: true }]
1097
+ }], prefillData: [{
1098
+ type: Input
1099
+ }], closeEvent: [{
1100
+ type: Output
1101
+ }] } });
1102
+
1103
+ /*
1104
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
1105
+ *
1106
+ * Licensed under EUPL, Version 1.2 (the "License");
1107
+ * you may not use this file except in compliance with the License.
1108
+ * You may obtain a copy of the License at
1109
+ *
1110
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
1111
+ *
1112
+ * Unless required by applicable law or agreed to in writing, software
1113
+ * distributed under the License is distributed on an "AS IS" basis,
1114
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1115
+ * See the License for the specific language governing permissions and
1116
+ * limitations under the License.
1117
+ */
1118
+ class TaskManagementSearchFieldsComponent {
1119
+ constructor(documentService, route, searchFieldsService, trasnlateService) {
1120
+ this.documentService = documentService;
1121
+ this.route = route;
1122
+ this.searchFieldsService = searchFieldsService;
1123
+ this.trasnlateService = trasnlateService;
1124
+ this.caseDefinitionKey$ = getCaseManagementRouteParams(this.route).pipe(map((params) => (!params ? '' : params.caseDefinitionKey)), tap((caseDefinitionKey) => this.searchFieldsService.setCaseDefinitionKey(caseDefinitionKey)));
1125
+ this._refresh$ = new BehaviorSubject(null);
1126
+ this.searchFields$ = combineLatest([
1127
+ this.caseDefinitionKey$,
1128
+ this._refresh$,
1129
+ this.trasnlateService.stream('key'),
1130
+ ]).pipe(switchMap(() => this.searchFieldsService.getTaskListSearchFields()), map((searchFields) => this.mapTranslations(searchFields)));
1131
+ this.fields$ = this.trasnlateService.stream('key').pipe(map(() => [
1132
+ {
1133
+ key: 'title',
1134
+ label: 'searchFieldsOverview.title',
1135
+ viewType: ViewType.TEXT,
1136
+ },
1137
+ {
1138
+ key: 'key',
1139
+ label: 'searchFieldsOverview.key',
1140
+ viewType: ViewType.TEXT,
1141
+ },
1142
+ {
1143
+ key: 'path',
1144
+ label: 'searchFieldsOverview.path',
1145
+ viewType: ViewType.TEXT,
1146
+ },
1147
+ {
1148
+ key: 'dataTypeTranslation',
1149
+ label: 'searchFieldsOverview.dataType',
1150
+ viewType: ViewType.TEXT,
1151
+ },
1152
+ {
1153
+ key: 'fieldTypeTranslation',
1154
+ label: 'searchFieldsOverview.fieldType',
1155
+ viewType: ViewType.TEXT,
1156
+ },
1157
+ ]));
1158
+ this.deleteModalOpen$ = new BehaviorSubject(false);
1159
+ this.fieldModalOpen$ = new BehaviorSubject(false);
1160
+ this.itemToDelete$ = new BehaviorSubject(null);
1161
+ this.prefillData$ = new BehaviorSubject(null);
1162
+ this.ACTION_ITEMS = [
1163
+ {
1164
+ label: 'interface.edit',
1165
+ callback: this.editField.bind(this),
1166
+ type: 'normal',
1167
+ },
1168
+ {
1169
+ label: 'interface.delete',
1170
+ callback: this.deleteField.bind(this),
1171
+ type: 'danger',
1172
+ },
1173
+ ];
1174
+ }
1175
+ editField(item) {
1176
+ if (!!item.dropdownDataProvider) {
1177
+ this.documentService
1178
+ .getDropdownData(item.dropdownDataProvider, item.ownerId, item.key)
1179
+ .pipe(take(1))
1180
+ .subscribe(dropdownValues => {
1181
+ item.dropdownValues = dropdownValues;
1182
+ this.prefillData$.next(item);
1183
+ this.fieldModalOpen$.next(true);
1184
+ });
1185
+ return;
1186
+ }
1187
+ this.prefillData$.next(item);
1188
+ this.fieldModalOpen$.next(true);
1189
+ }
1190
+ onItemsReordered(event) {
1191
+ this.searchFieldsService
1192
+ .orderTaskListSearchFields(event)
1193
+ .pipe(take(1))
1194
+ .subscribe(() => this._refresh$.next(null));
1195
+ }
1196
+ onAddButtonClick() {
1197
+ this.fieldModalOpen$.next(true);
1198
+ }
1199
+ onCloseEvent(searchField, prefillData) {
1200
+ this.fieldModalOpen$.next(false);
1201
+ this.prefillData$.next(null);
1202
+ if (!searchField)
1203
+ return;
1204
+ const hasDropdownValues = searchField.fieldType === TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||
1205
+ searchField.fieldType === TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN;
1206
+ (!prefillData
1207
+ ? this.searchFieldsService.createTaskListSearchField(searchField)
1208
+ : this.searchFieldsService.updateTaskListSearchField(searchField))
1209
+ .pipe(take(1), switchMap((field) => {
1210
+ return hasDropdownValues
1211
+ ? this.documentService.postDropdownData(field.dropdownDataProvider ?? '', field.ownerId, field.key, searchField.dropdownValues ?? {})
1212
+ : of(field);
1213
+ }))
1214
+ .subscribe(() => this._refresh$.next(null));
1215
+ }
1216
+ onDeleteFieldConfirm(item) {
1217
+ if (!item)
1218
+ return;
1219
+ combineLatest([
1220
+ this.searchFieldsService.deleteTaskListSearchField(item.key),
1221
+ item.dropdownDataProvider
1222
+ ? this.documentService.deleteDropdownData(item.dropdownDataProvider, item.ownerId, item.key)
1223
+ : of(null),
1224
+ ])
1225
+ .pipe(take(1))
1226
+ .subscribe(() => this._refresh$.next(null));
1227
+ }
1228
+ deleteField(item) {
1229
+ this.itemToDelete$.next(item);
1230
+ this.deleteModalOpen$.next(true);
1231
+ }
1232
+ mapTranslations(searchFields) {
1233
+ return searchFields.map((searchField) => ({
1234
+ ...searchField,
1235
+ dataTypeTranslation: this.trasnlateService.instant(`searchFields.${searchField.dataType.toLowerCase()}`),
1236
+ fieldTypeTranslation: this.trasnlateService.instant(`searchFieldsOverview.${this.fieldTypeTranslation(searchField.fieldType)}`),
1237
+ }));
1238
+ }
1239
+ fieldTypeTranslation(fieldType) {
1240
+ switch (fieldType) {
1241
+ case TaskListSearchFieldFieldType.SINGLE_SELECT_DROPDOWN:
1242
+ return 'single-select-dropdown';
1243
+ case TaskListSearchFieldFieldType.MULTI_SELECT_DROPDOWN:
1244
+ return 'multi-select-dropdown';
1245
+ default:
1246
+ return fieldType.toLowerCase();
1247
+ }
1248
+ }
1249
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsComponent, deps: [{ token: i1$2.DocumentService }, { token: i1$1.ActivatedRoute }, { token: TaskManagementSearchFieldsService }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
1250
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TaskManagementSearchFieldsComponent, isStandalone: true, selector: "valtimo-task-management-search-fields", ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n fieldModalOpen: fieldModalOpen$ | async,\n fields: fields$ | async,\n itemToDelete: itemToDelete$ | async,\n prefillData: prefillData$ | async,\n searchFields: searchFields$ | async,\n } as obs\"\n>\n <valtimo-carbon-list\n [actionItems]=\"ACTION_ITEMS\"\n [fields]=\"obs.fields\"\n [items]=\"obs.searchFields\"\n [dragAndDrop]=\"true\"\n (itemsReordered)=\"onItemsReordered($event)\"\n (rowClicked)=\"editField($event)\"\n >\n <ng-container carbonToolbarContent>\n <ng-container [ngTemplateOutlet]=\"addButton\"></ng-container>\n </ng-container>\n\n <valtimo-no-results\n [action]=\"addButton\"\n [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n ></valtimo-no-results>\n </valtimo-carbon-list>\n\n <valtimo-task-management-search-fields-modal\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [open]=\"obs.fieldModalOpen\"\n [prefillData]=\"obs.prefillData\"\n (closeEvent)=\"onCloseEvent($event, obs.prefillData)\"\n ></valtimo-task-management-search-fields-modal>\n\n <valtimo-confirmation-modal\n confirmButtonTextTranslationKey=\"interface.delete\"\n confirmButtonType=\"danger\"\n contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n [outputOnConfirm]=\"obs.itemToDelete\"\n [showModalSubject$]=\"deleteModalOpen$\"\n titleTranslationKey=\"searchFieldsOverview.deleteSearchField\"\n (confirmEvent)=\"onDeleteFieldConfirm($event)\"\n ></valtimo-confirmation-modal>\n</ng-container>\n\n<ng-template #addButton>\n <button cdsButton=\"primary\" (click)=\"onAddButtonClick()\">\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n {{ 'searchFieldsOverview.add' | translate }}\n </button>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i6.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i6.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$1.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$1.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: TaskManagementSearchFieldsModalComponent, selector: "valtimo-task-management-search-fields-modal", inputs: ["open", "caseDefinitionKey", "prefillData"], outputs: ["closeEvent"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: i6.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1251
+ }
1252
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementSearchFieldsComponent, decorators: [{
1253
+ type: Component,
1254
+ args: [{ selector: 'valtimo-task-management-search-fields', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
1255
+ CommonModule,
1256
+ TranslateModule,
1257
+ CarbonListModule,
1258
+ ButtonModule,
1259
+ IconModule,
1260
+ TaskManagementSearchFieldsModalComponent,
1261
+ ConfirmationModalModule,
1262
+ ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<ng-container\n *ngIf=\"{\n fieldModalOpen: fieldModalOpen$ | async,\n fields: fields$ | async,\n itemToDelete: itemToDelete$ | async,\n prefillData: prefillData$ | async,\n searchFields: searchFields$ | async,\n } as obs\"\n>\n <valtimo-carbon-list\n [actionItems]=\"ACTION_ITEMS\"\n [fields]=\"obs.fields\"\n [items]=\"obs.searchFields\"\n [dragAndDrop]=\"true\"\n (itemsReordered)=\"onItemsReordered($event)\"\n (rowClicked)=\"editField($event)\"\n >\n <ng-container carbonToolbarContent>\n <ng-container [ngTemplateOutlet]=\"addButton\"></ng-container>\n </ng-container>\n\n <valtimo-no-results\n [action]=\"addButton\"\n [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n ></valtimo-no-results>\n </valtimo-carbon-list>\n\n <valtimo-task-management-search-fields-modal\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [open]=\"obs.fieldModalOpen\"\n [prefillData]=\"obs.prefillData\"\n (closeEvent)=\"onCloseEvent($event, obs.prefillData)\"\n ></valtimo-task-management-search-fields-modal>\n\n <valtimo-confirmation-modal\n confirmButtonTextTranslationKey=\"interface.delete\"\n confirmButtonType=\"danger\"\n contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n [outputOnConfirm]=\"obs.itemToDelete\"\n [showModalSubject$]=\"deleteModalOpen$\"\n titleTranslationKey=\"searchFieldsOverview.deleteSearchField\"\n (confirmEvent)=\"onDeleteFieldConfirm($event)\"\n ></valtimo-confirmation-modal>\n</ng-container>\n\n<ng-template #addButton>\n <button cdsButton=\"primary\" (click)=\"onAddButtonClick()\">\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n {{ 'searchFieldsOverview.add' | translate }}\n </button>\n</ng-template>\n" }]
1263
+ }], ctorParameters: () => [{ type: i1$2.DocumentService }, { type: i1$1.ActivatedRoute }, { type: TaskManagementSearchFieldsService }, { type: i4.TranslateService }] });
1264
+
1265
+ /*
1266
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
1267
+ *
1268
+ * Licensed under EUPL, Version 1.2 (the "License");
1269
+ * you may not use this file except in compliance with the License.
1270
+ * You may obtain a copy of the License at
1271
+ *
1272
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
1273
+ *
1274
+ * Unless required by applicable law or agreed to in writing, software
1275
+ * distributed under the License is distributed on an "AS IS" basis,
1276
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1277
+ * See the License for the specific language governing permissions and
1278
+ * limitations under the License.
1279
+ */
1280
+ class TaskManagementDetailComponent {
1281
+ constructor(taskManagementService) {
1282
+ this.taskManagementService = taskManagementService;
1283
+ this.activeTab$ = this.taskManagementService.activeTab$;
1284
+ this.TaskManagementTab = TaskManagementTab;
1285
+ }
1286
+ setActiveTab(tab) {
1287
+ this.taskManagementService.setActiveTab(tab);
1288
+ }
1289
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementDetailComponent, deps: [{ token: TaskManagementService }], target: i0.ɵɵFactoryTarget.Component }); }
1290
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: TaskManagementDetailComponent, isStandalone: true, selector: "ng-component", providers: [TaskManagementService], ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n@if (activeTab$ | async; as activeTab) {\n <cds-tabs type=\"contained\">\n <cds-tab\n [active]=\"activeTab === TaskManagementTab.COLUMNS\"\n [heading]=\"'taskManagement.columns' | translate\"\n (selected)=\"setActiveTab(TaskManagementTab.COLUMNS)\"\n >\n <valtimo-task-management-columns *ngIf=\"activeTab === TaskManagementTab.COLUMNS\">\n </valtimo-task-management-columns>\n </cds-tab>\n\n <cds-tab\n [active]=\"activeTab === TaskManagementTab.SEARCH_FIELDS\"\n [heading]=\"'taskManagement.searchFields' | translate\"\n (selected)=\"setActiveTab(TaskManagementTab.SEARCH_FIELDS)\"\n >\n <valtimo-task-management-search-fields *ngIf=\"activeTab === TaskManagementTab.SEARCH_FIELDS\">\n </valtimo-task-management-search-fields>\n </cds-tab>\n </cds-tabs>\n}\n", styles: ["::ng-deep .cds--tab-content{padding:0}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i2$1.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i2$1.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "component", type: TaskManagementColumnsComponent, selector: "valtimo-task-management-columns", inputs: ["carbonTheme"] }, { kind: "component", type: TaskManagementSearchFieldsComponent, selector: "valtimo-task-management-search-fields" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1291
+ }
1292
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TaskManagementDetailComponent, decorators: [{
1293
+ type: Component,
1294
+ args: [{ standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
1295
+ CommonModule,
1296
+ CarbonListModule,
1297
+ TranslateModule,
1298
+ TabsModule,
1299
+ TaskManagementColumnsComponent,
1300
+ TaskManagementSearchFieldsComponent,
1301
+ ], providers: [TaskManagementService], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n@if (activeTab$ | async; as activeTab) {\n <cds-tabs type=\"contained\">\n <cds-tab\n [active]=\"activeTab === TaskManagementTab.COLUMNS\"\n [heading]=\"'taskManagement.columns' | translate\"\n (selected)=\"setActiveTab(TaskManagementTab.COLUMNS)\"\n >\n <valtimo-task-management-columns *ngIf=\"activeTab === TaskManagementTab.COLUMNS\">\n </valtimo-task-management-columns>\n </cds-tab>\n\n <cds-tab\n [active]=\"activeTab === TaskManagementTab.SEARCH_FIELDS\"\n [heading]=\"'taskManagement.searchFields' | translate\"\n (selected)=\"setActiveTab(TaskManagementTab.SEARCH_FIELDS)\"\n >\n <valtimo-task-management-search-fields *ngIf=\"activeTab === TaskManagementTab.SEARCH_FIELDS\">\n </valtimo-task-management-search-fields>\n </cds-tab>\n </cds-tabs>\n}\n", styles: ["::ng-deep .cds--tab-content{padding:0}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
1302
+ }], ctorParameters: () => [{ type: TaskManagementService }] });
1303
+
1304
+ /*
1305
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
1306
+ *
1307
+ * Licensed under EUPL, Version 1.2 (the "License");
1308
+ * you may not use this file except in compliance with the License.
1309
+ * You may obtain a copy of the License at
1310
+ *
1311
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
1312
+ *
1313
+ * Unless required by applicable law or agreed to in writing, software
1314
+ * distributed under the License is distributed on an "AS IS" basis,
1315
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1316
+ * See the License for the specific language governing permissions and
1317
+ * limitations under the License.
1318
+ */
1319
+
1320
+ /*
1321
+ * Copyright 2015-2025 Ritense BV, the Netherlands.
1322
+ *
1323
+ * Licensed under EUPL, Version 1.2 (the "License");
1324
+ * you may not use this file except in compliance with the License.
1325
+ * You may obtain a copy of the License at
1326
+ *
1327
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
1328
+ *
1329
+ * Unless required by applicable law or agreed to in writing, software
1330
+ * distributed under the License is distributed on an "AS IS" basis,
1331
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
1332
+ * See the License for the specific language governing permissions and
1333
+ * limitations under the License.
1334
+ */
1335
+ /*
1336
+ * Public API Surface of task
1337
+ */
1338
+
1339
+ /**
1340
+ * Generated bundle index. Do not edit.
1341
+ */
1342
+
1343
+ export { TaskManagementApiService, TaskManagementColumnModalComponent, TaskManagementColumnsComponent, TaskManagementDetailComponent, TaskManagementSearchFieldsComponent, TaskManagementSearchFieldsService, TaskManagementService, TaskManagementTab };
1344
+ //# sourceMappingURL=valtimo-task-management.mjs.map