@yomotech/view-toolkit 0.0.32 → 0.0.34

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 (72) hide show
  1. package/fesm2022/yomotech-view-toolkit.mjs +3593 -0
  2. package/fesm2022/yomotech-view-toolkit.mjs.map +1 -0
  3. package/package.json +49 -38
  4. package/types/yomotech-view-toolkit.d.ts +648 -0
  5. package/ng-package.json +0 -7
  6. package/src/lib/app-version.ts +0 -2
  7. package/src/lib/components/autocomplete/autocomplete.css +0 -0
  8. package/src/lib/components/autocomplete/autocomplete.html +0 -23
  9. package/src/lib/components/autocomplete/autocomplete.ts +0 -71
  10. package/src/lib/components/button/button.css +0 -0
  11. package/src/lib/components/button/button.html +0 -1
  12. package/src/lib/components/button/button.ts +0 -11
  13. package/src/lib/components/date/date.css +0 -0
  14. package/src/lib/components/date/date.html +0 -1
  15. package/src/lib/components/date/date.ts +0 -11
  16. package/src/lib/components/dropdown/dropdown.css +0 -0
  17. package/src/lib/components/dropdown/dropdown.html +0 -1
  18. package/src/lib/components/dropdown/dropdown.ts +0 -11
  19. package/src/lib/components/error-message/error-message.css +0 -0
  20. package/src/lib/components/error-message/error-message.html +0 -1
  21. package/src/lib/components/error-message/error-message.ts +0 -11
  22. package/src/lib/components/label/label.css +0 -0
  23. package/src/lib/components/label/label.html +0 -7
  24. package/src/lib/components/label/label.ts +0 -33
  25. package/src/lib/components/string/string.css +0 -0
  26. package/src/lib/components/string/string.html +0 -4
  27. package/src/lib/components/string/string.ts +0 -22
  28. package/src/lib/components/textbox/textbox.css +0 -0
  29. package/src/lib/components/textbox/textbox.html +0 -7
  30. package/src/lib/components/textbox/textbox.ts +0 -33
  31. package/src/lib/components/time/time.css +0 -0
  32. package/src/lib/components/time/time.html +0 -1
  33. package/src/lib/components/time/time.ts +0 -11
  34. package/src/lib/containers/card/card.component.css +0 -0
  35. package/src/lib/containers/card/card.component.html +0 -450
  36. package/src/lib/containers/card/card.component.ts +0 -474
  37. package/src/lib/containers/form/form.component.css +0 -101
  38. package/src/lib/containers/form/form.component.html +0 -305
  39. package/src/lib/containers/form/form.component.ts +0 -333
  40. package/src/lib/containers/grid/grid.component.css +0 -0
  41. package/src/lib/containers/grid/grid.component.html +0 -212
  42. package/src/lib/containers/grid/grid.component.ts +0 -228
  43. package/src/lib/containers/header-menu/header-menu.component.css +0 -0
  44. package/src/lib/containers/header-menu/header-menu.component.html +0 -72
  45. package/src/lib/containers/header-menu/header-menu.component.ts +0 -105
  46. package/src/lib/containers/logs/logs.component.css +0 -160
  47. package/src/lib/containers/logs/logs.component.html +0 -89
  48. package/src/lib/containers/logs/logs.component.ts +0 -29
  49. package/src/lib/containers/model/model.component.css +0 -0
  50. package/src/lib/containers/model/model.component.html +0 -351
  51. package/src/lib/containers/model/model.component.ts +0 -436
  52. package/src/lib/containers/pagination/pagination.component.css +0 -0
  53. package/src/lib/containers/pagination/pagination.component.html +0 -41
  54. package/src/lib/containers/pagination/pagination.component.ts +0 -100
  55. package/src/lib/containers/side-menu/side-menu.component.css +0 -173
  56. package/src/lib/containers/side-menu/side-menu.component.html +0 -126
  57. package/src/lib/containers/side-menu/side-menu.component.ts +0 -458
  58. package/src/lib/services/app-version-reset.service.ts +0 -59
  59. package/src/lib/services/config.service.ts +0 -144
  60. package/src/lib/services/couchdb.ts +0 -275
  61. package/src/lib/services/mobile-keycloak.service.ts +0 -116
  62. package/src/lib/services/network-log.service.ts +0 -27
  63. package/src/lib/services/notification.service.ts +0 -26
  64. package/src/lib/services/request.service.ts +0 -125
  65. package/src/lib/services/utility.service.ts +0 -600
  66. package/src/lib/view-toolkit.module.ts +0 -57
  67. package/src/lib/view-toolkit.spec.ts +0 -23
  68. package/src/lib/view-toolkit.ts +0 -15
  69. package/src/public-api.ts +0 -25
  70. package/tsconfig.lib.json +0 -17
  71. package/tsconfig.lib.prod.json +0 -11
  72. package/tsconfig.spec.json +0 -15
package/src/lib/containers/logs/logs.component.css DELETED
@@ -1,160 +0,0 @@
1
- /* ===============================
2
- LAYOUT
3
- =============================== */
4
-
5
- .network-log-wrapper {
6
- padding: 12px;
7
- }
8
-
9
- .network-log-table {
10
- width: 100%;
11
- overflow-x: auto;
12
- }
13
-
14
- /* ===============================
15
- TABLE
16
- =============================== */
17
-
18
- table {
19
- width: 100%;
20
- border-collapse: collapse;
21
- font-size: 13px;
22
- min-width: 900px;
23
- }
24
-
25
- thead th {
26
- background: #06b6d4;
27
- color: #fff;
28
- padding: 8px;
29
- text-align: left;
30
- position: sticky;
31
- top: 0;
32
- z-index: 2;
33
- }
34
-
35
- tbody td {
36
- padding: 8px;
37
- border-bottom: 1px solid #e5e7eb;
38
- }
39
-
40
- /* ===============================
41
- ROW STATES
42
- =============================== */
43
-
44
- .log-row {
45
- cursor: pointer;
46
- }
47
-
48
- .log-row:hover {
49
- background: #f1f5f9;
50
- }
51
-
52
- .details-row {
53
- background: #f8fafc;
54
- }
55
-
56
- /* ===============================
57
- METHOD TAGS
58
- =============================== */
59
-
60
- .method {
61
- padding: 2px 8px;
62
- border-radius: 4px;
63
- font-weight: 600;
64
- font-size: 11px;
65
- color: #fff;
66
- }
67
-
68
- .method.get {
69
- background: #16a34a;
70
- }
71
-
72
- .method.post {
73
- background: #2563eb;
74
- }
75
-
76
- .method.put {
77
- background: #d97706;
78
- }
79
-
80
- .method.delete {
81
- background: #dc2626;
82
- }
83
-
84
- /* ===============================
85
- STATUS
86
- =============================== */
87
-
88
- td.error {
89
- color: #dc2626;
90
- font-weight: 700;
91
- }
92
-
93
- /* ===============================
94
- ELLIPSIS
95
- =============================== */
96
-
97
- .ellipsis {
98
- max-width: 320px;
99
- white-space: nowrap;
100
- overflow: hidden;
101
- text-overflow: ellipsis;
102
- }
103
-
104
- /* ===============================
105
- DETAILS GRID
106
- =============================== */
107
-
108
- .details-container {
109
- display: grid;
110
- grid-template-columns: repeat(2, minmax(0, 1fr));
111
- gap: 16px;
112
- }
113
-
114
- .detail-block {
115
- background: #ffffff;
116
- border: 1px solid #e5e7eb;
117
- border-radius: 6px;
118
- padding: 10px;
119
- }
120
-
121
- .detail-block h4 {
122
- margin: 0 0 6px;
123
- font-size: 14px;
124
- color: #0f172a;
125
- }
126
-
127
- pre {
128
- background: #020617;
129
- color: #e5e7eb;
130
- padding: 8px;
131
- border-radius: 6px;
132
- max-height: 260px;
133
- overflow: auto;
134
- font-size: 12px;
135
- white-space: pre-wrap;
136
- word-break: break-word;
137
- }
138
-
139
- /* ===============================
140
- MOBILE
141
- =============================== */
142
-
143
- @media (max-width: 768px) {
144
- table {
145
- min-width: 100%;
146
- font-size: 12px;
147
- }
148
-
149
- .ellipsis {
150
- max-width: 140px;
151
- }
152
-
153
- .details-container {
154
- grid-template-columns: 1fr;
155
- }
156
-
157
- pre {
158
- max-height: 200px;
159
- }
160
- }
package/src/lib/containers/logs/logs.component.html DELETED
@@ -1,89 +0,0 @@
1
- <div class="network-log-wrapper">
2
-
3
- <div class="network-log-table">
4
- <table>
5
- <thead>
6
- <tr>
7
- <th>#</th>
8
- <th>Time</th>
9
- <th>Method</th>
10
- <th>URL</th>
11
- <th>Status</th>
12
- <th>Duration (ms)</th>
13
- <th>Size (KB)</th>
14
- </tr>
15
- </thead>
16
-
17
- <tbody>
18
- <ng-container *ngFor="let log of logs; let i = index">
19
-
20
- <!-- MAIN ROW -->
21
- <tr class="log-row" (click)="toggleRow(i)">
22
- <td>{{ i + 1 }}</td>
23
- <td>{{ log.time }}</td>
24
-
25
- <td>
26
- <span class="method" [class.get]="log.method === 'GET'" [class.post]="log.method === 'POST'"
27
- [class.put]="log.method === 'PUT'" [class.delete]="log.method === 'DELETE'">
28
- {{ log.method }}
29
- </span>
30
- </td>
31
-
32
- <td class="ellipsis" [title]="log.url">
33
- {{ log.url }}
34
- </td>
35
-
36
- <td [class.error]="log.status >= 400">
37
- {{ log.status }}
38
- </td>
39
-
40
- <td>{{ log.duration }}</td>
41
-
42
- <td>{{ log.size | number:'1.0-2' }}</td>
43
- </tr>
44
-
45
- <!-- DETAILS ROW -->
46
- <tr *ngIf="expandedRow === i" class="details-row">
47
- <td colspan="7">
48
- <div class="details-container">
49
-
50
- <!-- META -->
51
- <div class="detail-block">
52
- <h4>Meta</h4>
53
- <p><strong>Date:</strong> {{ log.date }}</p>
54
- <p><strong>Type:</strong> {{ log.type }}</p>
55
- </div>
56
-
57
- <!-- REQUEST -->
58
- <div class="detail-block">
59
- <h4>Request</h4>
60
- <p><strong>Headers</strong></p>
61
- <pre>{{ log.requestHeaders | json }}</pre>
62
-
63
- <p><strong>Body</strong></p>
64
- <pre>{{ log.requestBody | json }}</pre>
65
- </div>
66
-
67
- <!-- RESPONSE -->
68
- <div class="detail-block">
69
- <h4>Response</h4>
70
- <pre>{{ log.responseBody | json }}</pre>
71
- </div>
72
-
73
- <!-- PERFORMANCE -->
74
- <div class="detail-block">
75
- <h4>Performance</h4>
76
- <p><strong>Duration:</strong> {{ log.duration }} ms</p>
77
- <p><strong>Size:</strong> {{ log.size | number:'1.0-2' }} KB</p>
78
- </div>
79
-
80
- </div>
81
- </td>
82
- </tr>
83
-
84
- </ng-container>
85
- </tbody>
86
- </table>
87
- </div>
88
-
89
- </div>
package/src/lib/containers/logs/logs.component.ts DELETED
@@ -1,29 +0,0 @@
1
- import { Component } from '@angular/core';
2
- import { NetworkLogService } from '../../services/network-log.service';
3
- import { CommonModule } from '@angular/common';
4
-
5
- @Component({
6
- standalone: true,
7
- imports: [
8
- CommonModule
9
- ],
10
- selector: 'vl-logs',
11
- templateUrl: './logs.component.html',
12
- styleUrl: './logs.component.css'
13
- })
14
- export class LogsComponent {
15
- logs: any[] = [];
16
- expandedRow: number | null = null;
17
-
18
- constructor(private logService: NetworkLogService) {}
19
-
20
- ngOnInit() {
21
- const today = new Date().toISOString().split('T')[0];
22
- this.logs = this.logService.getLogsByDate(today);
23
- console.log('this.logs: ', this.logs);
24
- }
25
-
26
- toggleRow(index: number) {
27
- this.expandedRow = this.expandedRow === index ? null : index;
28
- }
29
- }
package/src/lib/containers/model/model.component.css DELETED
File without changes
package/src/lib/containers/model/model.component.html DELETED
@@ -1,351 +0,0 @@
1
- <nz-modal [nzTitle]="modalItemInfo?.modalTitle" nzCentered [(nzVisible)]="isModalShow" [nzFooter]="null"
2
- (nzOnCancel)="onCancel()">
3
- <!-- Loader Spinner -->
4
- <div *ngIf="isLoading" class="loader-overlay">
5
- <div class="spinner"></div>
6
- </div>
7
- <ng-container *nzModalContent>
8
- <div [style]="getStyleWithoutClasses(modalItemInfo?.layoutSchema?.style).style"
9
- [class]="modalItemInfo?.layoutSchema?.style?.classes[0]">
10
- <form #dynamicForm="ngForm" *ngIf="modalItemInfo?.layoutSchema?.formSections?.length > 0"
11
- (submit)="$event.preventDefault()">
12
- <div *ngFor="let formSection of modalItemInfo?.layoutSchema?.formSections">
13
- <div *ngIf="formSection?.label?.caption" [class]="formSection?.label?.style?.classes[0]"
14
- [style]="getStyleWithoutClasses(formSection?.label?.style).style">
15
- {{formSection.label.caption}}
16
- </div>
17
- <div [class]="formSection?.style?.classes[0]"
18
- [style]="getStyleWithoutClasses(formSection?.style).style"
19
- *ngIf="formSection.formFields?.length > 0">
20
- <div *ngFor="let formField of formSection.formFields">
21
- <div
22
- [ngSwitch]="formField?.scope?.reference && modalItemInfo.propertySchema[getScope(formField.scope?.reference)] ?
23
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.type : 'default'">
24
-
25
- <!-- image control -->
26
- <div *ngSwitchCase="'image'" [style]="getStyleWithoutClasses(formField?.style).style"
27
- [class]="formField.style?.classes[0]">
28
- <img [src]="formField.option.src" [alt]="'img'" />
29
- </div>
30
-
31
- <!-- credit card control -->
32
- <div *ngSwitchCase="'carditCard'"
33
- [style]="getStyleWithoutClasses(formField?.style).style"
34
- [class]="formField.style?.classes[0]">
35
- <div id="card-element">
36
- <!-- a Stripe element will be inserted here -->
37
- </div>
38
- <!-- Used to display form errors -->
39
- <div id="card-errors"
40
- class="displayError.textContent!=='': 'alert alert-danger mt-1'"></div>
41
- </div>
42
-
43
- <!-- string control -->
44
- <div *ngSwitchCase="'string'" class="form-group mb-3">
45
- <span *ngIf="formField.option.protected"
46
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
47
- [class]="formField?.label?.style?.classes[0]">
48
- <vl-string [formField]="formField" [modalItemInfo]="modalItemInfo">
49
- </vl-string>
50
- </span>
51
- <div *ngIf="!formField.option.protected">
52
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
53
- <vl-label [formField]="formField" [modalItemInfo]="modalItemInfo">
54
- </vl-label>
55
- <vl-textbox [formField]="formField"
56
- [modalItemInfo]="modalItemInfo"></vl-textbox>
57
- </div>
58
- <!-- Error Message -->
59
- <!-- <div *ngIf="inputField?.touched && inputField?.invalid"
60
- [style]="getStyleWithoutClasses(formField?.validation?.style).style">
61
- <p class="text-danger" *ngIf="inputField?.errors?.['required']">
62
- {{setErroMessage(formField, errorMessages, "required")}}</p>
63
- <p class="text-danger" *ngIf="inputField?.errors?.['email']">
64
- {{(formField.label?.value ?
65
- formField.label?.value :
66
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption)
67
- +
68
- ' ' + errorMessages.pattern}}</p>
69
- </div> -->
70
- </div>
71
- </div>
72
-
73
- <!-- number control -->
74
- <div *ngSwitchCase="'number'" class="form-group mb-3">
75
- <span *ngIf="formField.option.protected"
76
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
77
- [class]="formField?.label?.style?.classes[0]">
78
- <h5>{{
79
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
80
- }} {{
81
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.value
82
- |
83
- currency:formField.option.currency :true: formField.option?.decimalPoint}}
84
- </h5>
85
- </span>
86
- <span *ngIf="!formField.option.protected">
87
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
88
- <label [style]="getStyleWithoutClasses(formField?.label?.style).style"
89
- [class]="formField?.label?.style?.classes[0]">{{ formField.label?.value
90
- ?
91
- formField.label?.value :
92
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
93
- }}</label>
94
- <input type="number" [class]="formField.style?.classes[0]"
95
- [style]="getStyleWithoutClasses(formField?.style).style"
96
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"
97
- [name]="formField.scope?.reference"
98
- [placeholder]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.placeholder" />
99
- </div>
100
- </span>
101
- </div>
102
-
103
- <!-- DateRange control -->
104
- <div *ngSwitchCase="'dateRange'" class="form-group mb-3">
105
- <span *ngIf="formField.option.protected"
106
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
107
- [class]="formField?.label?.style?.classes[0]">
108
- <vl-string [formField]="formField" [modalItemInfo]="modalItemInfo">
109
- </vl-string>
110
- </span>
111
- <div *ngIf="!formField.option.protected">
112
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
113
- <label [style]="getStyleWithoutClasses(formField?.label?.style).style"
114
- [class]="formField?.label?.style?.classes[0]">{{ formField.label?.value
115
- ?
116
- formField.label?.value :
117
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
118
- }}</label>
119
- <nz-range-picker #dateRangeField="ngModel"
120
- [required]="formField.option.required"
121
- [name]="formField.scope?.reference"
122
- [style]="getStyleWithoutClasses(formField?.style).style"
123
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"></nz-range-picker>
124
- </div>
125
- <!-- Error Message -->
126
- <div *ngIf="dateRangeField?.touched && dateRangeField?.invalid"
127
- [style]="getStyleWithoutClasses(formField?.validation?.style).style">
128
- <p class="text-danger" *ngIf="dateRangeField?.errors?.['required']">
129
- {{formField.label?.value ?
130
- formField.label?.value :
131
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
132
- +
133
- ' ' + errorMessages.required}}</p>
134
- <p class="text-danger" *ngIf="dateRangeField?.errors?.['email']">
135
- {{(formField.label?.value ?
136
- formField.label?.value :
137
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption)
138
- +
139
- ' ' + errorMessages.pattern}}</p>
140
- </div>
141
- </div>
142
- </div>
143
-
144
- <!-- Date control -->
145
- <div *ngSwitchCase="'date'" class="form-group mb-3">
146
- <span *ngIf="formField.option.protected"
147
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
148
- [class]="formField?.label?.style?.classes[0]">
149
- <vl-string [formField]="formField" [modalItemInfo]="modalItemInfo">
150
- </vl-string>
151
- </span>
152
- <div *ngIf="!formField.option.protected">
153
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
154
- <label [style]="getStyleWithoutClasses(formField?.label?.style).style"
155
- [class]="formField?.label?.style?.classes[0]">{{ formField.label?.value
156
- ?
157
- formField.label?.value : formField.label?.caption ?
158
- formField.label?.caption :
159
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
160
- }}</label>
161
-
162
- <p-datepicker #dateField="ngModel" [required]="formField.option.required"
163
- [name]="formField.scope?.reference" type="number" inputmode="numeric"
164
- [disabled]="formField?.option?.disabled" [showIcon]="true"
165
- (ngModelChange)="dateChangeEvent(formField, $event)"
166
- (onInput)="onDateTyping($event)"
167
- (onFocus)="forceNumericKeyboard($event)"
168
- [dateFormat]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.format ? modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.format : 'yy-mm-dd'"
169
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"
170
- appendTo="body" [class]="formField?.scope?.style?.classes[0]"
171
- [style]="getStyleWithoutClasses(formField?.scope?.style).style">
172
- </p-datepicker>
173
- </div>
174
- <!-- Error Message -->
175
- <div *ngIf="dateField?.touched && dateField?.invalid"
176
- [style]="getStyleWithoutClasses(formField?.validation?.style).style">
177
- <p class="text-danger" *ngIf="dateField?.errors?.['required']">
178
- {{setErroMessage(formField, errorMessages, "required")}}</p>
179
- <p class="text-danger" *ngIf="dateField?.errors?.['email']">
180
- {{(formField.label?.value ?
181
- formField.label?.value :
182
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption)
183
- +
184
- ' ' + errorMessages.pattern}}</p>
185
- </div>
186
- </div>
187
- </div>
188
-
189
- <!-- Time control -->
190
- <div *ngSwitchCase="'time'" class="form-group mb-3">
191
- <span *ngIf="formField.option.protected"
192
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
193
- [class]="formField?.label?.style?.classes[0]">
194
- <vl-string [formField]="formField" [modalItemInfo]="modalItemInfo">
195
- </vl-string>
196
- </span>
197
- <div *ngIf="!formField.option.protected">
198
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
199
- <label [style]="getStyleWithoutClasses(formField?.label?.style).style"
200
- [class]="formField?.label?.style?.classes[0]">{{ formField.label?.value
201
- ?
202
- formField.label?.value : formField.label?.caption ?
203
- formField.label?.caption :
204
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
205
- }}</label>
206
- <p-datepicker #timeField="ngModel" [required]="formField.option.required"
207
- [name]="formField.scope?.reference" [timeOnly]="true" hourFormat="24"
208
- [disabled]="formField?.option?.disabled"
209
- (onFocus)="forceNumericKeyboard($event)"
210
- (onInput)="onTimeTyping($event)"
211
- (ngModelChange)="timeChangeEvent(formField, $event)"
212
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"
213
- appendTo="body" [class]="formField?.scope?.style?.classes[0]"
214
- [style]="getStyleWithoutClasses(formField?.style).style">
215
- </p-datepicker>
216
-
217
- </div>
218
- <!-- Error Message -->
219
- <div *ngIf="timeField?.touched && timeField?.invalid"
220
- [style]="getStyleWithoutClasses(formField?.validation?.style).style">
221
- <p class="text-danger" *ngIf="timeField?.errors?.['required']">
222
- {{setErroMessage(formField, errorMessages, "required")}}</p>
223
- <p class="text-danger" *ngIf="timeField?.errors?.['email']">
224
- {{(formField.label?.value ?
225
- formField.label?.value :
226
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption)
227
- +
228
- ' ' + errorMessages.pattern}}</p>
229
- </div>
230
- </div>
231
- </div>
232
-
233
- <!-- Autocomplete control -->
234
- <div *ngSwitchCase="'autocomplete'" class="form-group mb-3">
235
- <span *ngIf="formField.option.protected"
236
- [style]="getStyleWithoutClasses(formField?.label?.style).style"
237
- [class]="formField?.label?.style?.classes[0]">
238
- <vl-string [formField]="formField" [modalItemInfo]="modalItemInfo">
239
- </vl-string>
240
- </span>
241
- <div *ngIf="!formField.option.protected">
242
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
243
- <vl-label [formField]="formField" [modalItemInfo]="modalItemInfo">
244
- </vl-label>
245
-
246
- <vl-autocomplete [formField]="formField" [modalItemInfo]="modalItemInfo"
247
- [matchData]="matchData" [selectedLanguageInfo]="selectedLanguageInfo"
248
- [errorMessages]="errorMessages"
249
- (autocompSelectEvent)="autocompSelectEvent($event)"
250
- (autocompChange)="autocompChangeEvent($event)"
251
- (autocompFocusOut)="autocompFocusOutEvent($event)">
252
- </vl-autocomplete>
253
- </div>
254
- </div>
255
- </div>
256
-
257
- <!-- checkBox control -->
258
- <div *ngSwitchCase="'checkbox'" class="form-group mb-3"
259
- [style]="getStyleWithoutClasses(formField?.style).style"
260
- [class]="formField.style?.classes[0]">
261
- <span *ngIf="formField.option?.postfixCaption">
262
- <label class="form-check-label"><input type="checkbox" class="form-check-input"
263
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"
264
- [name]="formField.scope?.reference"
265
- (ngModelChange)="invokeSetformData()" />{{
266
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
267
- }}</label>
268
- </span>
269
- <div *ngIf="!formField.option?.postfixCaption"
270
- [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
271
- <label class="form-check-label">{{
272
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
273
- }}
274
- <input type="checkbox" class="form-check-input"
275
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value"
276
- [name]="formField.scope?.reference" /></label>
277
- </div>
278
- </div>
279
-
280
- <!-- dropdown control -->
281
- <div *ngSwitchCase="'dropdown'" class="form-group mb-3"
282
- [style]="getStyleWithoutClasses(formField?.style).style"
283
- [class]="formField.style?.classes[0]">
284
- <span *ngIf="formField.option?.postfixCaption">
285
- <select id="dynamic-dropdown" [class]="formField.style?.classes[0]"
286
- #dropdownField="ngModel"
287
- [style]="getStyleWithoutClasses(formField?.style).style"
288
- [name]="formField.scope?.reference"
289
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value">
290
- <option
291
- *ngFor="let item of modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.data"
292
- [value]="formField.option.optionValue"> {{
293
- formField.option.optionLabel}}</option>
294
- </select>
295
- <label
296
- [style]="getStyleWithoutClasses(formField?.label?.style).style">{{modalItemInfo.propertySchema[getScope(formField.scope)][formField.scope?.reference.split('/').pop()]?.caption
297
- }}</label>
298
- </span>
299
- <div *ngIf="!formField.option?.postfixCaption">
300
- <div [class]="formField?.layout == 'horizontal' ? 'horizontal-layout' : 'row'">
301
- <label
302
- [style]="getStyleWithoutClasses(formField?.label?.style).style">{{modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
303
- }}</label>
304
-
305
- <nz-select nzShowSearch nzAllowClear nzPlaceHolder="Select"
306
- #dropdownField="ngModel" [required]="formField.option.required"
307
- [class]="formField.style?.classes[0]"
308
- [style]="getStyleWithoutClasses(formField?.style).style"
309
- [name]="formField.scope?.reference"
310
- [(ngModel)]="modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()].value">
311
- <nz-option
312
- *ngFor="let item of modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.data"
313
- [nzLabel]="item[formField.option.optionLabel]"
314
- [nzValue]="item[formField.option.optionValue]"></nz-option>
315
- </nz-select>
316
- </div>
317
- <!-- Error Message -->
318
- <div *ngIf="dropdownField?.touched && dropdownField?.invalid"
319
- [style]="getStyleWithoutClasses(formField?.validation?.style).style">
320
- <p class="text-danger" *ngIf="dropdownField?.errors?.['required']">
321
- {{formField.label?.value ?
322
- formField.label?.value :
323
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption
324
- +
325
- ' ' + errorMessages.required}}</p>
326
- <p class="text-danger" *ngIf="dropdownField?.errors?.['email']">
327
- {{(formField.label?.value ?
328
- formField.label?.value :
329
- modalItemInfo.propertySchema[getScope(formField.scope?.reference)][formField.scope?.reference.split('/').pop()]?.caption)
330
- +
331
- ' ' + errorMessages.pattern}}</p>
332
- </div>
333
- </div>
334
- </div>
335
-
336
- <!-- button control -->
337
- <div *ngSwitchCase="'default'">
338
- <button type="button" [style]="getStyleWithoutClasses(formField.style).style"
339
- (click)="invokeFormBtnClick(formField.option, modalItemInfo.propertySchema, dynamicForm)"
340
- class="btn btn-primary btn-block">
341
- {{ formField.label?.caption }}
342
- </button>
343
- </div>
344
- </div>
345
- </div>
346
- </div>
347
- </div>
348
- </form>
349
- </div>
350
- </ng-container>
351
- </nz-modal>