@pega/angular-sdk-overrides 0.25.1 → 0.25.3
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.
- package/lib/designSystemExtension/alert/alert.component.scss +3 -3
- package/lib/designSystemExtension/banner/banner.component.scss +12 -2
- package/lib/designSystemExtension/material-case-summary/material-case-summary.component.html +6 -3
- package/lib/designSystemExtension/material-case-summary/material-case-summary.component.scss +5 -34
- package/lib/designSystemExtension/material-details/material-details.component.scss +0 -5
- package/lib/designSystemExtension/material-details-fields/material-details-fields.component.html +2 -2
- package/lib/designSystemExtension/material-details-fields/material-details-fields.component.scss +4 -3
- package/lib/designSystemExtension/material-summary-item/material-summary-item.component.scss +2 -17
- package/lib/designSystemExtension/material-utility/material-utility.component.scss +1 -2
- package/lib/designSystemExtension/material-vertical-tabs/material-vertical-tabs.component.scss +1 -1
- package/lib/designSystemExtension/operator/operator.component.html +1 -1
- package/lib/designSystemExtension/operator/operator.component.scss +3 -10
- package/lib/designSystemExtension/operator/operator.component.ts +0 -1
- package/lib/designSystemExtension/pulse/pulse.component.scss +2 -2
- package/lib/designSystemExtension/rich-text-editor/rich-text-editor.component.scss +0 -1
- package/lib/designSystemExtension/wss-quick-create/wss-quick-create.component.scss +16 -8
- package/lib/field/auto-complete/auto-complete.component.html +0 -1
- package/lib/field/auto-complete/auto-complete.component.ts +35 -172
- package/lib/field/cancel-alert/cancel-alert.component.html +8 -12
- package/lib/field/cancel-alert/cancel-alert.component.scss +2 -3
- package/lib/field/cancel-alert/cancel-alert.component.ts +24 -36
- package/lib/field/check-box/check-box.component.html +0 -1
- package/lib/field/check-box/check-box.component.scss +0 -1
- package/lib/field/check-box/check-box.component.ts +19 -149
- package/lib/field/currency/currency.component.ts +36 -168
- package/lib/field/date/date.component.html +1 -1
- package/lib/field/date/date.component.ts +30 -150
- package/lib/field/date-time/date-time.component.ts +31 -149
- package/lib/field/decimal/decimal.component.ts +38 -163
- package/lib/field/dropdown/dropdown.component.ts +29 -151
- package/lib/field/email/email.component.ts +16 -155
- package/lib/field/field.base.ts +149 -0
- package/lib/field/group/group.component.ts +7 -4
- package/lib/field/integer/integer.component.ts +18 -157
- package/lib/field/location/location.component.ts +1 -1
- package/lib/field/multiselect/multiselect.component.ts +46 -148
- package/lib/field/multiselect/utils.ts +55 -47
- package/lib/field/object-reference/object-reference.component.html +17 -0
- package/lib/field/object-reference/object-reference.component.scss +0 -0
- package/lib/field/object-reference/object-reference.component.spec.ts +22 -0
- package/lib/field/object-reference/object-reference.component.ts +237 -0
- package/lib/field/percentage/percentage.component.ts +37 -154
- package/lib/field/phone/phone.component.ts +28 -142
- package/lib/field/radio-buttons/radio-buttons.component.scss +4 -2
- package/lib/field/radio-buttons/radio-buttons.component.ts +35 -161
- package/lib/field/rich-text/rich-text.component.ts +19 -90
- package/lib/field/scalar-list/scalar-list.component.ts +17 -72
- package/lib/field/selectable-card/selectable-card.component.html +54 -24
- package/lib/field/selectable-card/selectable-card.component.scss +11 -0
- package/lib/field/selectable-card/selectable-card.component.ts +16 -52
- package/lib/field/semantic-link/semantic-link.component.html +4 -8
- package/lib/field/semantic-link/semantic-link.component.scss +0 -13
- package/lib/field/semantic-link/semantic-link.component.ts +165 -5
- package/lib/field/text/text.component.scss +0 -1
- package/lib/field/text-area/text-area.component.ts +18 -152
- package/lib/field/text-input/text-input.component.ts +16 -155
- package/lib/field/time/time.component.ts +17 -151
- package/lib/field/url/url.component.ts +16 -154
- package/lib/field/user-reference/user-reference.component.scss +0 -1
- package/lib/field/user-reference/user-reference.component.ts +2 -3
- package/lib/infra/Containers/flow-container/flow-container.component.ts +5 -7
- package/lib/infra/Containers/modal-view-container/modal-view-container.component.ts +5 -10
- package/lib/infra/Containers/view-container/helper.ts +35 -2
- package/lib/infra/Containers/view-container/view-container.component.ts +1 -1
- package/lib/infra/action-buttons/action-buttons.component.html +13 -8
- package/lib/infra/action-buttons/action-buttons.component.scss +23 -0
- package/lib/infra/action-buttons/action-buttons.component.ts +1 -2
- package/lib/infra/assignment/assignment.component.ts +8 -6
- package/lib/infra/assignment-card/assignment-card.component.html +1 -2
- package/lib/infra/assignment-card/assignment-card.component.scss +0 -4
- package/lib/infra/assignment-card/assignment-card.component.ts +21 -4
- package/lib/infra/defer-load/defer-load.component.html +6 -2
- package/lib/infra/defer-load/defer-load.component.ts +16 -10
- package/lib/infra/multi-step/multi-step.component.scss +1 -21
- package/lib/infra/navbar/navbar.component.html +25 -28
- package/lib/infra/navbar/navbar.component.scss +16 -4
- package/lib/infra/navbar/navbar.component.ts +8 -3
- package/lib/infra/root-container/root-container.component.scss +0 -1
- package/lib/infra/root-container/root-container.component.ts +1 -2
- package/lib/infra/stages/stages.component.html +2 -2
- package/lib/infra/stages/stages.component.scss +7 -35
- package/lib/infra/stages/stages.component.ts +4 -2
- package/lib/infra/view/view.component.html +1 -1
- package/lib/infra/view/view.component.ts +0 -2
- package/lib/template/advanced-search/advanced-search.component.html +12 -0
- package/lib/template/advanced-search/advanced-search.component.scss +0 -0
- package/lib/template/advanced-search/advanced-search.component.spec.ts +0 -0
- package/lib/template/advanced-search/advanced-search.component.ts +112 -0
- package/lib/template/advanced-search/advanced-search.service.ts +27 -0
- package/lib/template/advanced-search/search-group/persist-utils.ts +56 -0
- package/lib/template/advanced-search/search-groups/search-groups.component.html +32 -0
- package/lib/template/advanced-search/search-groups/search-groups.component.scss +0 -0
- package/lib/template/advanced-search/search-groups/search-groups.component.spec.ts +0 -0
- package/lib/template/advanced-search/search-groups/search-groups.component.ts +294 -0
- package/lib/template/advanced-search/search-groups/utils.ts +29 -0
- package/lib/template/app-shell/app-shell.component.html +4 -1
- package/lib/template/app-shell/app-shell.component.scss +0 -3
- package/lib/template/app-shell/app-shell.component.ts +46 -7
- package/lib/template/case-summary/case-summary.component.scss +0 -2
- package/lib/template/case-view/case-view.component.html +3 -3
- package/lib/template/case-view/case-view.component.scss +18 -10
- package/lib/template/case-view/case-view.component.ts +1 -1
- package/lib/template/data-reference/data-reference-advanced-search.service.ts +16 -0
- package/lib/template/data-reference/data-reference.component.html +11 -8
- package/lib/template/data-reference/data-reference.component.ts +346 -112
- package/lib/template/data-reference/search-form/search-form.component.html +39 -0
- package/lib/template/data-reference/search-form/search-form.component.scss +11 -0
- package/lib/template/data-reference/search-form/search-form.component.spec.ts +0 -0
- package/lib/template/data-reference/search-form/search-form.component.ts +167 -0
- package/lib/template/data-reference/search-form/tabsData.ts +160 -0
- package/lib/template/data-reference/utils.ts +92 -0
- package/lib/template/default-form/default-form.component.ts +10 -2
- package/lib/template/default-page/default-page.component.html +34 -0
- package/lib/template/default-page/default-page.component.scss +31 -0
- package/lib/template/default-page/default-page.component.spec.ts +24 -0
- package/lib/template/default-page/default-page.component.ts +64 -0
- package/lib/template/field-group-list/field-group-list.component.scss +0 -1
- package/lib/template/inline-dashboard-page/inline-dashboard-page.component.ts +1 -1
- package/lib/template/list-view/list-view.component.html +9 -4
- package/lib/template/list-view/list-view.component.scss +21 -21
- package/lib/template/list-view/list-view.component.ts +154 -84
- package/lib/template/list-view/utils.ts +25 -2
- package/lib/template/object-page/object-page.component.html +1 -0
- package/lib/template/object-page/object-page.component.scss +0 -0
- package/lib/template/object-page/object-page.component.spec.ts +22 -0
- package/lib/template/object-page/object-page.component.ts +14 -0
- package/lib/template/one-column-tab/one-column-tab.component.scss +1 -1
- package/lib/template/repeating-structures/repeating-structures.component.ts +0 -1
- package/lib/template/self-service-case-view/self-service-case-view.component.html +80 -0
- package/lib/template/self-service-case-view/self-service-case-view.component.scss +124 -0
- package/lib/template/self-service-case-view/self-service-case-view.component.spec.ts +24 -0
- package/lib/template/self-service-case-view/self-service-case-view.component.ts +216 -0
- package/lib/template/simple-table/simple-table.component.ts +0 -1
- package/lib/template/simple-table-manual/helpers.ts +2 -2
- package/lib/template/simple-table-manual/simple-table-manual.component.html +4 -4
- package/lib/template/simple-table-manual/simple-table-manual.component.scss +4 -14
- package/lib/template/simple-table-manual/simple-table-manual.component.ts +8 -4
- package/lib/template/single-reference-readonly/single-reference-readonly.component.html +4 -1
- package/lib/template/single-reference-readonly/single-reference-readonly.component.scss +21 -0
- package/lib/template/single-reference-readonly/single-reference-readonly.component.ts +104 -3
- package/lib/template/utils.ts +42 -0
- package/lib/template/wss-nav-bar/wss-nav-bar.component.html +5 -4
- package/lib/template/wss-nav-bar/wss-nav-bar.component.scss +2 -8
- package/lib/template/wss-nav-bar/wss-nav-bar.component.ts +1 -8
- package/lib/widget/app-announcement/app-announcement.component.html +1 -2
- package/lib/widget/app-announcement/app-announcement.component.scss +2 -2
- package/lib/widget/attachment/Attachment.types.ts +92 -0
- package/lib/widget/attachment/AttachmentUtils.ts +287 -0
- package/lib/widget/attachment/attachment.component.html +3 -3
- package/lib/widget/attachment/attachment.component.scss +2 -5
- package/lib/widget/attachment/attachment.component.ts +255 -254
- package/lib/widget/feed-container/feed-container.component.scss +3 -9
- package/lib/widget/feed-container/feed-container.component.ts +2 -2
- package/lib/widget/file-utility/file-utility.component.html +3 -3
- package/lib/widget/file-utility/file-utility.component.scss +5 -16
- package/lib/widget/list-utility/list-utility.component.scss +3 -5
- package/lib/widget/todo/todo.component.html +8 -5
- package/lib/widget/todo/todo.component.scss +10 -11
- package/lib/widget/todo/todo.component.ts +6 -2
- package/package.json +1 -1
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import { Component,
|
|
1
|
+
import { Component, forwardRef } from '@angular/core';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
|
-
import {
|
|
3
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
4
4
|
import { MatInputModule } from '@angular/material/input';
|
|
5
5
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
6
|
-
|
|
7
|
-
import {
|
|
8
|
-
import { Utils } from '@pega/angular-sdk-components';
|
|
6
|
+
|
|
7
|
+
import { FieldBase } from '@pega/angular-sdk-components';
|
|
9
8
|
import { ComponentMapperComponent } from '@pega/angular-sdk-components';
|
|
10
|
-
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
11
9
|
import { handleEvent } from '@pega/angular-sdk-components';
|
|
10
|
+
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
12
11
|
|
|
13
12
|
interface TextInputProps extends PConnFieldProps {
|
|
14
13
|
// If any, enter additional props that only exist on TextInput here
|
|
@@ -21,143 +20,22 @@ interface TextInputProps extends PConnFieldProps {
|
|
|
21
20
|
styleUrls: ['./text-input.component.scss'],
|
|
22
21
|
imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, forwardRef(() => ComponentMapperComponent)]
|
|
23
22
|
})
|
|
24
|
-
export class TextInputComponent
|
|
25
|
-
@Input() pConn$: typeof PConnect;
|
|
26
|
-
@Input() formGroup$: FormGroup;
|
|
27
|
-
|
|
28
|
-
// For interaction with AngularPConnect
|
|
29
|
-
angularPConnectData: AngularPConnectData = {};
|
|
23
|
+
export class TextInputComponent extends FieldBase {
|
|
30
24
|
configProps$: TextInputProps;
|
|
31
25
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
bVisible$ = true;
|
|
38
|
-
displayMode$?: string = '';
|
|
39
|
-
controlName$: string;
|
|
40
|
-
testId = '';
|
|
41
|
-
bHasForm$ = true;
|
|
42
|
-
componentReference = '';
|
|
43
|
-
helperText: string;
|
|
44
|
-
placeholder: string;
|
|
45
|
-
|
|
46
|
-
fieldControl = new FormControl('', null);
|
|
47
|
-
actionsApi: Object;
|
|
48
|
-
propName: string;
|
|
49
|
-
|
|
50
|
-
constructor(
|
|
51
|
-
private angularPConnect: AngularPConnectService,
|
|
52
|
-
private cdRef: ChangeDetectorRef,
|
|
53
|
-
private utils: Utils
|
|
54
|
-
) {}
|
|
55
|
-
|
|
56
|
-
ngOnInit(): void {
|
|
57
|
-
// First thing in initialization is registering and subscribing to the AngularPConnect service
|
|
58
|
-
this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
|
|
59
|
-
this.controlName$ = this.angularPConnect.getComponentID(this);
|
|
60
|
-
|
|
61
|
-
// Then, continue on with other initialization
|
|
62
|
-
|
|
63
|
-
// call updateSelf when initializing
|
|
64
|
-
// this.updateSelf();
|
|
65
|
-
this.checkAndUpdate();
|
|
66
|
-
|
|
67
|
-
if (this.formGroup$) {
|
|
68
|
-
// add control to formGroup
|
|
69
|
-
this.formGroup$.addControl(this.controlName$, this.fieldControl);
|
|
70
|
-
this.fieldControl.setValue(this.value$);
|
|
71
|
-
this.bHasForm$ = true;
|
|
72
|
-
} else {
|
|
73
|
-
this.bReadonly$ = true;
|
|
74
|
-
this.bHasForm$ = false;
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
ngOnDestroy(): void {
|
|
79
|
-
if (this.formGroup$) {
|
|
80
|
-
this.formGroup$.removeControl(this.controlName$);
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
if (this.angularPConnectData.unsubscribeFn) {
|
|
84
|
-
this.angularPConnectData.unsubscribeFn();
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
// Callback passed when subscribing to store change
|
|
89
|
-
onStateChange() {
|
|
90
|
-
this.checkAndUpdate();
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
checkAndUpdate() {
|
|
94
|
-
// Should always check the bridge to see if the component should
|
|
95
|
-
// update itself (re-render)
|
|
96
|
-
const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
|
|
97
|
-
|
|
98
|
-
// ONLY call updateSelf when the component should update
|
|
99
|
-
if (bUpdateSelf) {
|
|
100
|
-
this.updateSelf();
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
// updateSelf
|
|
105
|
-
updateSelf(): void {
|
|
106
|
-
// moved this from ngOnInit() and call this from there instead...
|
|
26
|
+
/**
|
|
27
|
+
* Updates the component when there are changes in the state.
|
|
28
|
+
*/
|
|
29
|
+
override updateSelf(): void {
|
|
30
|
+
// Resolve configuration properties
|
|
107
31
|
this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as TextInputProps;
|
|
108
32
|
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
this.testId = this.configProps$.testId;
|
|
114
|
-
|
|
115
|
-
this.label$ = this.configProps$.label;
|
|
116
|
-
this.displayMode$ = this.configProps$.displayMode;
|
|
117
|
-
|
|
118
|
-
this.componentReference = this.pConn$.getStateProps().value;
|
|
119
|
-
|
|
120
|
-
this.actionsApi = this.pConn$.getActionsApi();
|
|
121
|
-
this.propName = this.pConn$.getStateProps().value;
|
|
122
|
-
|
|
123
|
-
if (this.configProps$.visibility != null) {
|
|
124
|
-
this.bVisible$ = this.utils.getBooleanValue(this.configProps$.visibility);
|
|
125
|
-
}
|
|
126
|
-
this.helperText = this.configProps$.helperText;
|
|
127
|
-
this.placeholder = this.configProps$.placeholder || '';
|
|
128
|
-
|
|
129
|
-
// timeout and detectChanges to avoid ExpressionChangedAfterItHasBeenCheckedError
|
|
130
|
-
setTimeout(() => {
|
|
131
|
-
if (this.configProps$.required != null) {
|
|
132
|
-
this.bRequired$ = this.utils.getBooleanValue(this.configProps$.required);
|
|
133
|
-
}
|
|
134
|
-
this.cdRef.detectChanges();
|
|
135
|
-
});
|
|
136
|
-
|
|
137
|
-
// disabled
|
|
138
|
-
if (this.configProps$.disabled != undefined) {
|
|
139
|
-
this.bDisabled$ = this.utils.getBooleanValue(this.configProps$.disabled);
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
if (this.bDisabled$) {
|
|
143
|
-
this.fieldControl.disable();
|
|
144
|
-
} else {
|
|
145
|
-
this.fieldControl.enable();
|
|
146
|
-
}
|
|
33
|
+
// Update component common properties
|
|
34
|
+
this.updateComponentCommonProperties(this.configProps$);
|
|
147
35
|
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
// trigger display of error message with field control
|
|
153
|
-
if (this.angularPConnectData.validateMessage != null && this.angularPConnectData.validateMessage != '') {
|
|
154
|
-
const timer = interval(100).subscribe(() => {
|
|
155
|
-
this.fieldControl.setErrors({ message: true });
|
|
156
|
-
this.fieldControl.markAsTouched();
|
|
157
|
-
|
|
158
|
-
timer.unsubscribe();
|
|
159
|
-
});
|
|
160
|
-
}
|
|
36
|
+
// Get and set component specific properties
|
|
37
|
+
const { value } = this.configProps$;
|
|
38
|
+
this.value$ = value;
|
|
161
39
|
}
|
|
162
40
|
|
|
163
41
|
fieldOnChange(event: any) {
|
|
@@ -180,21 +58,4 @@ export class TextInputComponent implements OnInit, OnDestroy {
|
|
|
180
58
|
handleEvent(this.actionsApi, 'changeNblur', this.propName, value);
|
|
181
59
|
}
|
|
182
60
|
}
|
|
183
|
-
|
|
184
|
-
getErrorMessage() {
|
|
185
|
-
let errMessage = '';
|
|
186
|
-
|
|
187
|
-
// look for validation messages for json, pre-defined or just an error pushed from workitem (400)
|
|
188
|
-
if (this.fieldControl.hasError('message')) {
|
|
189
|
-
errMessage = this.angularPConnectData.validateMessage ?? '';
|
|
190
|
-
return errMessage;
|
|
191
|
-
}
|
|
192
|
-
if (this.fieldControl.hasError('required')) {
|
|
193
|
-
errMessage = 'You must enter a value';
|
|
194
|
-
} else if (this.fieldControl.errors) {
|
|
195
|
-
errMessage = this.fieldControl.errors.toString();
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
return errMessage;
|
|
199
|
-
}
|
|
200
61
|
}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
import { Component,
|
|
1
|
+
import { Component, forwardRef } from '@angular/core';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
|
-
import {
|
|
3
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
4
4
|
import { MatInputModule } from '@angular/material/input';
|
|
5
5
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
6
|
-
|
|
7
|
-
import {
|
|
8
|
-
import { Utils } from '@pega/angular-sdk-components';
|
|
6
|
+
|
|
7
|
+
import { FieldBase } from '@pega/angular-sdk-components';
|
|
9
8
|
import { ComponentMapperComponent } from '@pega/angular-sdk-components';
|
|
10
|
-
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
11
9
|
import { handleEvent } from '@pega/angular-sdk-components';
|
|
12
10
|
import { format } from '@pega/angular-sdk-components';
|
|
11
|
+
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
13
12
|
|
|
14
13
|
interface TimeProps extends PConnFieldProps {
|
|
15
14
|
// If any, enter additional props that only exist on Time here
|
|
@@ -21,147 +20,29 @@ interface TimeProps extends PConnFieldProps {
|
|
|
21
20
|
styleUrls: ['./time.component.scss'],
|
|
22
21
|
imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, forwardRef(() => ComponentMapperComponent)]
|
|
23
22
|
})
|
|
24
|
-
export class TimeComponent
|
|
25
|
-
@Input() pConn$: typeof PConnect;
|
|
26
|
-
@Input() formGroup$: FormGroup;
|
|
27
|
-
|
|
28
|
-
// Used with AngularPConnect
|
|
29
|
-
angularPConnectData: AngularPConnectData = {};
|
|
23
|
+
export class TimeComponent extends FieldBase {
|
|
30
24
|
configProps$: TimeProps;
|
|
31
|
-
|
|
32
|
-
label$ = '';
|
|
33
|
-
value$: string;
|
|
34
|
-
bRequired$ = false;
|
|
35
|
-
bReadonly$ = false;
|
|
36
|
-
bDisabled$ = false;
|
|
37
|
-
bVisible$ = true;
|
|
38
|
-
displayMode$?: string = '';
|
|
39
|
-
controlName$: string;
|
|
40
|
-
testId = '';
|
|
41
|
-
bHasForm$ = true;
|
|
42
|
-
componentReference = '';
|
|
43
|
-
helperText: string;
|
|
44
|
-
placeholder: string;
|
|
45
|
-
|
|
46
|
-
fieldControl = new FormControl('', null);
|
|
47
|
-
actionsApi: Object;
|
|
48
|
-
propName: string;
|
|
49
25
|
formattedValue$: any;
|
|
50
26
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
ngOnInit(): void {
|
|
58
|
-
// First thing in initialization is registering and subscribing to the AngularPConnect service
|
|
59
|
-
this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
|
|
60
|
-
this.controlName$ = this.angularPConnect.getComponentID(this);
|
|
61
|
-
|
|
62
|
-
// Then, continue on with other initialization
|
|
63
|
-
// call updateSelf when initializing
|
|
64
|
-
// this.updateSelf();
|
|
65
|
-
this.checkAndUpdate();
|
|
66
|
-
|
|
67
|
-
if (this.formGroup$) {
|
|
68
|
-
// add control to formGroup
|
|
69
|
-
this.formGroup$.addControl(this.controlName$, this.fieldControl);
|
|
70
|
-
this.fieldControl.setValue(this.value$);
|
|
71
|
-
this.bHasForm$ = true;
|
|
72
|
-
} else {
|
|
73
|
-
this.bReadonly$ = true;
|
|
74
|
-
this.bHasForm$ = false;
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
ngOnDestroy(): void {
|
|
79
|
-
if (this.formGroup$) {
|
|
80
|
-
this.formGroup$.removeControl(this.controlName$);
|
|
81
|
-
}
|
|
82
|
-
if (this.angularPConnectData.unsubscribeFn) {
|
|
83
|
-
this.angularPConnectData.unsubscribeFn();
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
// Callback passed when subscribing to store change
|
|
88
|
-
onStateChange() {
|
|
89
|
-
this.checkAndUpdate();
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
checkAndUpdate() {
|
|
93
|
-
// Should always check the bridge to see if the component should
|
|
94
|
-
// update itself (re-render)
|
|
95
|
-
const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
|
|
96
|
-
|
|
97
|
-
// ONLY call updateSelf when the component should update
|
|
98
|
-
if (bUpdateSelf) {
|
|
99
|
-
this.updateSelf();
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
// updateSelf
|
|
104
|
-
updateSelf(): void {
|
|
105
|
-
// moved this from ngOnInit() and call this from there instead...
|
|
27
|
+
/**
|
|
28
|
+
* Updates the component when there are changes in the state.
|
|
29
|
+
*/
|
|
30
|
+
override updateSelf(): void {
|
|
31
|
+
// Resolve config properties
|
|
106
32
|
this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as TimeProps;
|
|
107
33
|
|
|
108
|
-
|
|
109
|
-
this.
|
|
110
|
-
this.displayMode$ = this.configProps$.displayMode;
|
|
34
|
+
// Update component common properties
|
|
35
|
+
this.updateComponentCommonProperties(this.configProps$);
|
|
111
36
|
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
this.helperText = this.configProps$.helperText;
|
|
116
|
-
this.placeholder = this.configProps$.placeholder || '';
|
|
117
|
-
|
|
118
|
-
this.actionsApi = this.pConn$.getActionsApi();
|
|
119
|
-
this.propName = this.pConn$.getStateProps().value;
|
|
120
|
-
|
|
121
|
-
// timeout and detectChanges to avoid ExpressionChangedAfterItHasBeenCheckedError
|
|
122
|
-
setTimeout(() => {
|
|
123
|
-
if (this.configProps$.required != null) {
|
|
124
|
-
this.bRequired$ = this.utils.getBooleanValue(this.configProps$.required);
|
|
125
|
-
}
|
|
126
|
-
this.cdRef.detectChanges();
|
|
127
|
-
});
|
|
37
|
+
// Extract the value property
|
|
38
|
+
const { value } = this.configProps$;
|
|
39
|
+
this.value$ = value;
|
|
128
40
|
|
|
129
|
-
if (
|
|
41
|
+
if (['DISPLAY_ONLY', 'STACKED_LARGE_VAL'].includes(this.displayMode$)) {
|
|
130
42
|
this.formattedValue$ = format(this.value$, 'timeonly', {
|
|
131
43
|
format: 'hh:mm A'
|
|
132
44
|
});
|
|
133
45
|
}
|
|
134
|
-
|
|
135
|
-
if (this.configProps$.visibility != null) {
|
|
136
|
-
this.bVisible$ = this.utils.getBooleanValue(this.configProps$.visibility);
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
// disabled
|
|
140
|
-
if (this.configProps$.disabled != undefined) {
|
|
141
|
-
this.bDisabled$ = this.utils.getBooleanValue(this.configProps$.disabled);
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
if (this.bDisabled$) {
|
|
145
|
-
this.fieldControl.disable();
|
|
146
|
-
} else {
|
|
147
|
-
this.fieldControl.enable();
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
if (this.configProps$.readOnly != null) {
|
|
151
|
-
this.bReadonly$ = this.utils.getBooleanValue(this.configProps$.readOnly);
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
this.componentReference = this.pConn$.getStateProps().value;
|
|
155
|
-
|
|
156
|
-
// trigger display of error message with field control
|
|
157
|
-
if (this.angularPConnectData.validateMessage != null && this.angularPConnectData.validateMessage != '') {
|
|
158
|
-
const timer = interval(100).subscribe(() => {
|
|
159
|
-
this.fieldControl.setErrors({ message: true });
|
|
160
|
-
this.fieldControl.markAsTouched();
|
|
161
|
-
|
|
162
|
-
timer.unsubscribe();
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
46
|
}
|
|
166
47
|
|
|
167
48
|
fieldOnChange(event: any) {
|
|
@@ -189,19 +70,4 @@ export class TimeComponent implements OnInit, OnDestroy {
|
|
|
189
70
|
handleEvent(this.actionsApi, 'changeNblur', this.propName, value);
|
|
190
71
|
}
|
|
191
72
|
}
|
|
192
|
-
|
|
193
|
-
getErrorMessage() {
|
|
194
|
-
let errMessage = '';
|
|
195
|
-
// look for validation messages for json, pre-defined or just an error pushed from workitem (400)
|
|
196
|
-
if (this.fieldControl.hasError('message')) {
|
|
197
|
-
errMessage = this.angularPConnectData.validateMessage ?? '';
|
|
198
|
-
return errMessage;
|
|
199
|
-
}
|
|
200
|
-
if (this.fieldControl.hasError('required')) {
|
|
201
|
-
errMessage = 'You must enter a value';
|
|
202
|
-
} else if (this.fieldControl.errors) {
|
|
203
|
-
errMessage = this.fieldControl.errors.toString();
|
|
204
|
-
}
|
|
205
|
-
return errMessage;
|
|
206
|
-
}
|
|
207
73
|
}
|
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import { Component,
|
|
1
|
+
import { Component, forwardRef } from '@angular/core';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
|
-
import {
|
|
3
|
+
import { ReactiveFormsModule } from '@angular/forms';
|
|
4
4
|
import { MatInputModule } from '@angular/material/input';
|
|
5
5
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
6
|
-
|
|
7
|
-
import {
|
|
8
|
-
import { Utils } from '@pega/angular-sdk-components';
|
|
6
|
+
|
|
7
|
+
import { FieldBase } from '@pega/angular-sdk-components';
|
|
9
8
|
import { ComponentMapperComponent } from '@pega/angular-sdk-components';
|
|
10
|
-
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
11
9
|
import { handleEvent } from '@pega/angular-sdk-components';
|
|
10
|
+
import { PConnFieldProps } from '@pega/angular-sdk-components';
|
|
12
11
|
|
|
13
12
|
interface URLProps extends PConnFieldProps {
|
|
14
13
|
// If any, enter additional props that only exist on URL here
|
|
@@ -20,142 +19,22 @@ interface URLProps extends PConnFieldProps {
|
|
|
20
19
|
styleUrls: ['./url.component.scss'],
|
|
21
20
|
imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, forwardRef(() => ComponentMapperComponent)]
|
|
22
21
|
})
|
|
23
|
-
export class UrlComponent
|
|
24
|
-
@Input() pConn$: typeof PConnect;
|
|
25
|
-
@Input() formGroup$: FormGroup;
|
|
26
|
-
|
|
27
|
-
// Used with AngularPConnect
|
|
28
|
-
angularPConnectData: AngularPConnectData = {};
|
|
22
|
+
export class UrlComponent extends FieldBase {
|
|
29
23
|
configProps$: URLProps;
|
|
30
24
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
bVisible$ = true;
|
|
37
|
-
displayMode$?: string = '';
|
|
38
|
-
controlName$: string;
|
|
39
|
-
testId = '';
|
|
40
|
-
bHasForm$ = true;
|
|
41
|
-
componentReference = '';
|
|
42
|
-
helperText: string;
|
|
43
|
-
placeholder: string;
|
|
44
|
-
|
|
45
|
-
fieldControl = new FormControl('', null);
|
|
46
|
-
actionsApi: Object;
|
|
47
|
-
propName: string;
|
|
48
|
-
|
|
49
|
-
constructor(
|
|
50
|
-
private angularPConnect: AngularPConnectService,
|
|
51
|
-
private cdRef: ChangeDetectorRef,
|
|
52
|
-
private utils: Utils
|
|
53
|
-
) {}
|
|
54
|
-
|
|
55
|
-
ngOnInit(): void {
|
|
56
|
-
// First thing in initialization is registering and subscribing to the AngularPConnect service
|
|
57
|
-
this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
|
|
58
|
-
this.controlName$ = this.angularPConnect.getComponentID(this);
|
|
59
|
-
|
|
60
|
-
// Then, continue on with other initialization
|
|
61
|
-
|
|
62
|
-
// call updateSelf when initializing
|
|
63
|
-
// this.updateSelf();
|
|
64
|
-
this.checkAndUpdate();
|
|
65
|
-
|
|
66
|
-
if (this.formGroup$) {
|
|
67
|
-
// add control to formGroup
|
|
68
|
-
this.formGroup$.addControl(this.controlName$, this.fieldControl);
|
|
69
|
-
this.fieldControl.setValue(this.value$);
|
|
70
|
-
this.bHasForm$ = true;
|
|
71
|
-
} else {
|
|
72
|
-
this.bReadonly$ = true;
|
|
73
|
-
this.bHasForm$ = false;
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
ngOnDestroy(): void {
|
|
78
|
-
if (this.formGroup$) {
|
|
79
|
-
this.formGroup$.removeControl(this.controlName$);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
if (this.angularPConnectData.unsubscribeFn) {
|
|
83
|
-
this.angularPConnectData.unsubscribeFn();
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
// Callback passed when subscribing to store change
|
|
88
|
-
onStateChange() {
|
|
89
|
-
this.checkAndUpdate();
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
checkAndUpdate() {
|
|
93
|
-
// Should always check the bridge to see if the component should
|
|
94
|
-
// update itself (re-render)
|
|
95
|
-
const bUpdateSelf = this.angularPConnect.shouldComponentUpdate(this);
|
|
96
|
-
|
|
97
|
-
// ONLY call updateSelf when the component should update
|
|
98
|
-
if (bUpdateSelf) {
|
|
99
|
-
this.updateSelf();
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
// updateSelf
|
|
104
|
-
updateSelf(): void {
|
|
105
|
-
// moved this from ngOnInit() and call this from there instead...
|
|
25
|
+
/**
|
|
26
|
+
* Updates the component when there are changes in the state.
|
|
27
|
+
*/
|
|
28
|
+
override updateSelf(): void {
|
|
29
|
+
// Resolve config properties
|
|
106
30
|
this.configProps$ = this.pConn$.resolveConfigProps(this.pConn$.getConfigProps()) as URLProps;
|
|
107
31
|
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
this.testId = this.configProps$.testId;
|
|
113
|
-
this.label$ = this.configProps$.label;
|
|
114
|
-
this.displayMode$ = this.configProps$.displayMode;
|
|
115
|
-
this.helperText = this.configProps$.helperText;
|
|
116
|
-
this.placeholder = this.configProps$.placeholder || '';
|
|
117
|
-
|
|
118
|
-
this.actionsApi = this.pConn$.getActionsApi();
|
|
119
|
-
this.propName = this.pConn$.getStateProps().value;
|
|
120
|
-
|
|
121
|
-
// timeout and detectChanges to avoid ExpressionChangedAfterItHasBeenCheckedError
|
|
122
|
-
setTimeout(() => {
|
|
123
|
-
if (this.configProps$.required != null) {
|
|
124
|
-
this.bRequired$ = this.utils.getBooleanValue(this.configProps$.required);
|
|
125
|
-
}
|
|
126
|
-
this.cdRef.detectChanges();
|
|
127
|
-
});
|
|
128
|
-
|
|
129
|
-
if (this.configProps$.visibility != null) {
|
|
130
|
-
this.bVisible$ = this.utils.getBooleanValue(this.configProps$.visibility);
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
// disabled
|
|
134
|
-
if (this.configProps$.disabled != undefined) {
|
|
135
|
-
this.bDisabled$ = this.utils.getBooleanValue(this.configProps$.disabled);
|
|
136
|
-
}
|
|
32
|
+
// Update component common properties
|
|
33
|
+
this.updateComponentCommonProperties(this.configProps$);
|
|
137
34
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
this.fieldControl.enable();
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
if (this.configProps$.readOnly != null) {
|
|
145
|
-
this.bReadonly$ = this.utils.getBooleanValue(this.configProps$.readOnly);
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
this.componentReference = this.pConn$.getStateProps().value;
|
|
149
|
-
|
|
150
|
-
// trigger display of error message with field control
|
|
151
|
-
if (this.angularPConnectData.validateMessage != null && this.angularPConnectData.validateMessage != '') {
|
|
152
|
-
const timer = interval(100).subscribe(() => {
|
|
153
|
-
this.fieldControl.setErrors({ message: true });
|
|
154
|
-
this.fieldControl.markAsTouched();
|
|
155
|
-
|
|
156
|
-
timer.unsubscribe();
|
|
157
|
-
});
|
|
158
|
-
}
|
|
35
|
+
// Extract and normalize the value property
|
|
36
|
+
const { value } = this.configProps$;
|
|
37
|
+
this.value$ = value;
|
|
159
38
|
}
|
|
160
39
|
|
|
161
40
|
fieldOnChange(event: any) {
|
|
@@ -178,21 +57,4 @@ export class UrlComponent implements OnInit, OnDestroy {
|
|
|
178
57
|
handleEvent(this.actionsApi, 'changeNblur', this.propName, value);
|
|
179
58
|
}
|
|
180
59
|
}
|
|
181
|
-
|
|
182
|
-
getErrorMessage() {
|
|
183
|
-
let errMessage = '';
|
|
184
|
-
|
|
185
|
-
// look for validation messages for json, pre-defined or just an error pushed from workitem (400)
|
|
186
|
-
if (this.fieldControl.hasError('message')) {
|
|
187
|
-
errMessage = this.angularPConnectData.validateMessage ?? '';
|
|
188
|
-
return errMessage;
|
|
189
|
-
}
|
|
190
|
-
if (this.fieldControl.hasError('required')) {
|
|
191
|
-
errMessage = 'You must enter a value';
|
|
192
|
-
} else if (this.fieldControl.errors) {
|
|
193
|
-
errMessage = this.fieldControl.errors.toString();
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
return errMessage;
|
|
197
|
-
}
|
|
198
60
|
}
|
|
@@ -64,7 +64,7 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
|
|
|
64
64
|
filterValue = '';
|
|
65
65
|
|
|
66
66
|
fieldControl = new FormControl('', null);
|
|
67
|
-
actionsApi:
|
|
67
|
+
actionsApi: object;
|
|
68
68
|
propName: string;
|
|
69
69
|
onRecordChange: any;
|
|
70
70
|
|
|
@@ -187,7 +187,7 @@ export class UserReferenceComponent implements OnInit, OnDestroy {
|
|
|
187
187
|
} else {
|
|
188
188
|
// if same user ref field is referred in view as editable & readonly formatted text
|
|
189
189
|
// referenced users won't be available, so get user details from dx api
|
|
190
|
-
|
|
190
|
+
|
|
191
191
|
this.userName$ = await getUserName(this.pConn$, this.userID$);
|
|
192
192
|
}
|
|
193
193
|
} else if (displayAs === DROPDOWN_LIST || displayAs === SEARCH_BOX) {
|
|
@@ -276,7 +276,6 @@ function getUserName(pConn, userId = ''): Promise<string> {
|
|
|
276
276
|
const { parameters = {}, referenceList } = pConn.getConfigProps();
|
|
277
277
|
const contextName = pConn.getContextName();
|
|
278
278
|
|
|
279
|
-
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
280
279
|
const OPERATORS_DP = referenceList || PCore.getEnvironmentInfo().getDefaultOperatorDP() || '';
|
|
281
280
|
|
|
282
281
|
const columns = [
|
|
@@ -89,8 +89,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
|
|
|
89
89
|
this.angularPConnectData = this.angularPConnect.registerAndSubscribeComponent(this, this.onStateChange);
|
|
90
90
|
|
|
91
91
|
this.localizedVal = PCore.getLocaleUtils().getLocaleValue;
|
|
92
|
-
|
|
93
|
-
this.localeReference = `${caseInfo?.getClassName()}!CASE!${caseInfo.getName()}`.toUpperCase();
|
|
92
|
+
this.localeReference = this.pConn$?.getCaseLocaleReference();
|
|
94
93
|
|
|
95
94
|
// Then, continue on with other initialization
|
|
96
95
|
|
|
@@ -169,7 +168,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
|
|
|
169
168
|
// ONLY call updateSelf when the component should update
|
|
170
169
|
// AND removing the "gate" that was put there since shouldComponentUpdate
|
|
171
170
|
// should be the real "gate"
|
|
172
|
-
|
|
171
|
+
|
|
173
172
|
if (bUpdateSelf || caseViewModeFromProps !== caseViewModeFromRedux) {
|
|
174
173
|
// don't want to redraw the flow container when there are page messages, because
|
|
175
174
|
// the redraw causes us to loose the errors on the elements
|
|
@@ -202,9 +201,9 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
|
|
|
202
201
|
const kid = this.pConn$.getChildren()[0];
|
|
203
202
|
const todoKid = kid.getPConnect().getChildren()[0];
|
|
204
203
|
|
|
205
|
-
this.todo_pConn$ = todoKid
|
|
204
|
+
this.todo_pConn$ = todoKid?.getPConnect();
|
|
206
205
|
|
|
207
|
-
return
|
|
206
|
+
return !!this.todo_pConn$;
|
|
208
207
|
}
|
|
209
208
|
|
|
210
209
|
return !(caseViewMode && caseViewMode === 'perform');
|
|
@@ -464,7 +463,7 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
|
|
|
464
463
|
// @ts-ignore - Property 'getLoadingStatus' is private and only accessible within class 'C11nEnv'
|
|
465
464
|
loadingInfo = this.pConn$.getLoadingStatus();
|
|
466
465
|
} catch (ex) {
|
|
467
|
-
|
|
466
|
+
console.log(ex);
|
|
468
467
|
}
|
|
469
468
|
|
|
470
469
|
// this check in routingInfo, mimic Nebula/Constellation (React) to check and get the internals of the
|
|
@@ -486,7 +485,6 @@ export class FlowContainerComponent extends FlowContainerBaseComponent implement
|
|
|
486
485
|
}
|
|
487
486
|
});
|
|
488
487
|
|
|
489
|
-
// eslint-disable-next-line sonarjs/no-collapsible-if
|
|
490
488
|
if (currentOrder.length > 0) {
|
|
491
489
|
if (currentItems[key] && currentItems[key].view && type === 'single' && Object.keys(currentItems[key].view).length > 0) {
|
|
492
490
|
// when we get here, it it because the flow action data has changed
|