@eqproject/eqp-dynamic-module 2.10.62 → 2.10.64
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/README.md +502 -347
- package/USERGUIDE.md +437 -0
- package/esm2020/lib/components/exported/eqp-dynamic-module-configurator/eqp-dynamic-module-configurator.component.mjs +4 -1
- package/fesm2015/eqproject-eqp-dynamic-module.mjs +3 -0
- package/fesm2015/eqproject-eqp-dynamic-module.mjs.map +1 -1
- package/fesm2020/eqproject-eqp-dynamic-module.mjs +3 -0
- package/fesm2020/eqproject-eqp-dynamic-module.mjs.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,45 +1,66 @@
|
|
|
1
1
|
# @eqproject/eqp-dynamic-module
|
|
2
2
|
|
|
3
|
-
> Angular 15 library for building, rendering and managing dynamic forms with a no-code configurator.
|
|
4
|
-
|
|
5
3
|
[](https://www.npmjs.com/package/@eqproject/eqp-dynamic-module)
|
|
6
4
|
[](https://angular.io/)
|
|
7
5
|
|
|
6
|
+
> Libreria Angular 15 per la creazione, visualizzazione e gestione di form dinamiche con configuratore no-code.
|
|
7
|
+
> Angular 15 library for building, rendering and managing dynamic forms with a no-code configurator.
|
|
8
|
+
|
|
9
|
+
📖 **[Guida utente / User Guide →](./USERGUIDE.md)**
|
|
10
|
+
|
|
8
11
|
---
|
|
9
12
|
|
|
10
|
-
##
|
|
13
|
+
## Changelog
|
|
11
14
|
|
|
12
|
-
|
|
13
|
-
-
|
|
14
|
-
- [Installation](#installation)
|
|
15
|
-
- [Module Setup](#module-setup)
|
|
16
|
-
- [Components](#components)
|
|
17
|
-
- [eqp-dynamic-module — Form Viewer/Filler](#eqp-dynamic-module--form-viewerfiller)
|
|
18
|
-
- [eqp-dynamic-module-configurator — Form Builder](#eqp-dynamic-module-configurator--form-builder)
|
|
19
|
-
- [Configuration Models](#configuration-models)
|
|
20
|
-
- [View Modes](#view-modes)
|
|
21
|
-
- [Endpoint Configuration](#endpoint-configuration)
|
|
22
|
-
- [Data Models](#data-models)
|
|
23
|
-
- [Field Types Reference](#field-types-reference)
|
|
15
|
+
### v2.10.64
|
|
16
|
+
- **Bugfix configurator:** se il campo `Code` del form risulta `null` al momento del salvataggio (scenario: form creato con AI senza salvataggio intermedio), ora viene generato automaticamente da `Name` prima dell'invio al server.
|
|
24
17
|
|
|
25
|
-
|
|
18
|
+
### v2.10.63
|
|
19
|
+
- README riscritto in formato bilingue (italiano completo + inglese completo).
|
|
20
|
+
- Aggiunto `USERGUIDE.md` con guida pratica per scenari d'uso comuni e sezione prompt AI di esempio.
|
|
21
|
+
- `USERGUIDE.md` incluso nel pacchetto npm tramite `ng-package.json` assets.
|
|
26
22
|
|
|
27
|
-
|
|
23
|
+
### v2.10.62
|
|
24
|
+
- Migrazione da `tmw-picker` 1.0.x a 1.1.0: NgModule → standalone components, moment.js → Luxon, aggiornamento di tutti i token formato data (`DD/MM/YYYY` → `dd/MM/yyyy`).
|
|
25
|
+
- Rimossi input inutilizzati: `answerToDuplicateId` da `eqp-dynamic-module`, `ProjectName` da `eqp-dynamic-module-configurator`.
|
|
26
|
+
- Documentazione NPM riscritta completamente (bilingue IT/EN).
|
|
28
27
|
|
|
29
|
-
|
|
28
|
+
### v2.10.60
|
|
29
|
+
- Aggiornamenti interni e correzioni bug.
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|-----------|---------|
|
|
33
|
-
| `<eqp-dynamic-module>` | Runtime form viewer, filler, list, filter and graphs |
|
|
34
|
-
| `<eqp-dynamic-module-configurator>` | No-code form builder (create, edit, import, export) |
|
|
31
|
+
---
|
|
35
32
|
|
|
36
|
-
|
|
33
|
+
## Versione italiana
|
|
34
|
+
|
|
35
|
+
- [Panoramica](#panoramica)
|
|
36
|
+
- [Prerequisiti](#prerequisiti)
|
|
37
|
+
- [Installazione](#installazione)
|
|
38
|
+
- [Configurazione del modulo](#configurazione-del-modulo)
|
|
39
|
+
- [Componenti](#componenti)
|
|
40
|
+
- [eqp-dynamic-module — Visualizzatore form](#eqp-dynamic-module--visualizzatore-form)
|
|
41
|
+
- [eqp-dynamic-module-configurator — Builder form](#eqp-dynamic-module-configurator--builder-form)
|
|
42
|
+
- [Modelli di configurazione](#modelli-di-configurazione)
|
|
43
|
+
- [Modalità di visualizzazione](#modalità-di-visualizzazione)
|
|
44
|
+
- [Configurazione endpoint](#configurazione-endpoint)
|
|
45
|
+
- [Modelli dati](#modelli-dati)
|
|
46
|
+
- [Tipi di campo](#tipi-di-campo)
|
|
37
47
|
|
|
38
48
|
---
|
|
39
49
|
|
|
40
|
-
|
|
50
|
+
### Panoramica
|
|
51
|
+
|
|
52
|
+
`@eqproject/eqp-dynamic-module` espone **due componenti pubblici**:
|
|
41
53
|
|
|
42
|
-
|
|
54
|
+
| Componente | Scopo |
|
|
55
|
+
|-----------|-------|
|
|
56
|
+
| `<eqp-dynamic-module>` | Visualizzatore, compilatore, lista, filtro e grafici a runtime |
|
|
57
|
+
| `<eqp-dynamic-module-configurator>` | Builder no-code per creare e modificare le definizioni form |
|
|
58
|
+
|
|
59
|
+
Le form sono strutture JSON salvate lato server e recuperate a runtime. La libreria gestisce rendering, validazione, recupero dati, operazioni CRUD e funzionalità avanzate come formule, trigger, action button e speech-to-text.
|
|
60
|
+
|
|
61
|
+
---
|
|
62
|
+
|
|
63
|
+
### Prerequisiti
|
|
43
64
|
|
|
44
65
|
```bash
|
|
45
66
|
npm install @angular/cdk@^15.1.2 @angular/material@^15.1.2 @angular/material-luxon-adapter@^15.2.9 --legacy-peer-deps
|
|
@@ -47,11 +68,11 @@ npm install @angular-material-components/datetime-picker@^15.0.0 @angular-materi
|
|
|
47
68
|
npm install moment@^2.29.4 sweetalert2@^11.4.24 --legacy-peer-deps
|
|
48
69
|
```
|
|
49
70
|
|
|
50
|
-
>
|
|
71
|
+
> Tutti i comandi `npm install` per questa libreria richiedono il flag `--legacy-peer-deps`.
|
|
51
72
|
|
|
52
73
|
---
|
|
53
74
|
|
|
54
|
-
|
|
75
|
+
### Installazione
|
|
55
76
|
|
|
56
77
|
```bash
|
|
57
78
|
npm install @eqproject/eqp-dynamic-module --legacy-peer-deps
|
|
@@ -59,23 +80,20 @@ npm install @eqproject/eqp-dynamic-module --legacy-peer-deps
|
|
|
59
80
|
|
|
60
81
|
---
|
|
61
82
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
Import `EqpDynamicModuleModule` in your `AppModule` (or the feature module where you need it):
|
|
83
|
+
### Configurazione del modulo
|
|
65
84
|
|
|
66
85
|
```typescript
|
|
67
86
|
import { EqpDynamicModuleModule } from '@eqproject/eqp-dynamic-module';
|
|
68
87
|
|
|
69
88
|
@NgModule({
|
|
70
89
|
imports: [
|
|
71
|
-
// ...
|
|
72
90
|
EqpDynamicModuleModule
|
|
73
91
|
]
|
|
74
92
|
})
|
|
75
93
|
export class AppModule {}
|
|
76
94
|
```
|
|
77
95
|
|
|
78
|
-
|
|
96
|
+
In `angular.json`, aggiungi il tema Material agli stili:
|
|
79
97
|
|
|
80
98
|
```json
|
|
81
99
|
"styles": [
|
|
@@ -86,442 +104,588 @@ Add Angular Material theme and icons to your `angular.json` styles:
|
|
|
86
104
|
|
|
87
105
|
---
|
|
88
106
|
|
|
89
|
-
|
|
107
|
+
### Componenti
|
|
90
108
|
|
|
91
|
-
|
|
109
|
+
#### `eqp-dynamic-module` — Visualizzatore form
|
|
92
110
|
|
|
93
|
-
|
|
111
|
+
Visualizza una form dinamica in una delle [modalità disponibili](#modalità-di-visualizzazione).
|
|
94
112
|
|
|
95
|
-
|
|
113
|
+
**Utilizzo base**
|
|
96
114
|
|
|
97
115
|
```typescript
|
|
98
|
-
import {
|
|
99
|
-
DynamicModuleGeneralConfig,
|
|
100
|
-
DynamicModuleViewModeEnum
|
|
101
|
-
} from '@eqproject/eqp-dynamic-module';
|
|
116
|
+
import { DynamicModuleGeneralConfig, DynamicModuleViewModeEnum } from '@eqproject/eqp-dynamic-module';
|
|
102
117
|
|
|
103
|
-
// component.ts
|
|
104
118
|
generalConfig = new DynamicModuleGeneralConfig(
|
|
105
|
-
'https://
|
|
119
|
+
'https://tua-api.esempio.it/api',
|
|
106
120
|
this.userToken,
|
|
107
121
|
this.context,
|
|
108
|
-
null
|
|
122
|
+
null
|
|
109
123
|
);
|
|
110
124
|
```
|
|
111
125
|
|
|
112
126
|
```html
|
|
113
127
|
<eqp-dynamic-module
|
|
114
128
|
[configurations]="generalConfig"
|
|
115
|
-
[formID]="'
|
|
129
|
+
[formID]="'id-del-form'"
|
|
116
130
|
[starterViewMode]="DynamicModuleViewModeEnum.LIST"
|
|
117
131
|
[userID]="currentUser.id"
|
|
118
|
-
(saveRecord)="
|
|
119
|
-
(afterSaveRecord)="
|
|
132
|
+
(saveRecord)="onSalvataggio($event)"
|
|
133
|
+
(afterSaveRecord)="dopoSalvataggio($event)">
|
|
120
134
|
</eqp-dynamic-module>
|
|
121
135
|
```
|
|
122
136
|
|
|
123
|
-
|
|
137
|
+
**Input**
|
|
124
138
|
|
|
125
|
-
| Input |
|
|
139
|
+
| Input | Tipo | Default | Descrizione |
|
|
126
140
|
|-------|------|---------|-------------|
|
|
127
|
-
| `configurations` | `DynamicModuleGeneralConfig` | — | **
|
|
128
|
-
| `formID` | `string` | — | **
|
|
129
|
-
| `starterViewMode` | `DynamicModuleViewModeEnum` | `LIST` |
|
|
130
|
-
| `userID` | `string` | `"0"` |
|
|
131
|
-
| `orgaID` | `string` | `"0"` |
|
|
132
|
-
| `showTitle` | `boolean` | `true` |
|
|
133
|
-
| `showBackButton` | `boolean` | `true` |
|
|
134
|
-
| `showSaveButton` | `boolean` | `true` |
|
|
135
|
-
| `values` | `Record[]` | `null` |
|
|
136
|
-
| `FormJSON` | `string` | `""` | JSON
|
|
137
|
-
| `formulaObject` | `any` | `{}` |
|
|
138
|
-
| `selectedRecord` | `Record \| string` | `null` |
|
|
139
|
-
| `externalButtons` | `RecordButton[]` | `[]` |
|
|
140
|
-
| `actionButtons` | `ActionButton[]` | `[]` |
|
|
141
|
-
| `defaultListActions` | `DynamicModuleListFormRecordActionsDefault` |
|
|
142
|
-
| `listViewRecordTitle` | `string[]` | `[]` |
|
|
143
|
-
| `defaultListViewFunction` | `Function` | `null` |
|
|
144
|
-
| `onSaveBackToList` | `boolean` | `false` |
|
|
145
|
-
| `onBackTo` | `DynamicModuleViewModeEnum` | `null` |
|
|
146
|
-
| `numberOfColumns` | `number` | `3` |
|
|
147
|
-
| `showHiddenFields` | `boolean` | `true` |
|
|
148
|
-
| `filterResultViewMode` | `DynamicModuleFilterResultViewModeEnum` | `INTERNAL_EQPTABLE` |
|
|
149
|
-
| `additionalParams` | `any` | `null` |
|
|
150
|
-
| `additionalInfo` | `any` | `null` |
|
|
151
|
-
| `prefilterParams` | `any` | `null` |
|
|
152
|
-
| `updateInfo` | `any` | `null` |
|
|
153
|
-
| `contestualizationParams` | `any` | `null` |
|
|
154
|
-
| `showNewSearchButton` | `boolean` | `true` |
|
|
155
|
-
| `highlightFilter` | `any` | — |
|
|
156
|
-
| `isDraggableListView` | `boolean` | `true` |
|
|
157
|
-
| `Statistic` | `FilterStatistic` | `null` |
|
|
158
|
-
| `QueryEditorComponent` | `any` | — |
|
|
159
|
-
| `debugMode` | `boolean` | `false` |
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
| Output | Payload |
|
|
141
|
+
| `configurations` | `DynamicModuleGeneralConfig` | — | **Obbligatorio.** Configurazione connessione server. |
|
|
142
|
+
| `formID` | `string` | — | **Obbligatorio.** ID del form da visualizzare. |
|
|
143
|
+
| `starterViewMode` | `DynamicModuleViewModeEnum` | `LIST` | Modalità iniziale. |
|
|
144
|
+
| `userID` | `string` | `"0"` | ID utente per il salvataggio record. |
|
|
145
|
+
| `orgaID` | `string` | `"0"` | ID organizzazione. |
|
|
146
|
+
| `showTitle` | `boolean` | `true` | Mostra/nasconde il nome del form. |
|
|
147
|
+
| `showBackButton` | `boolean` | `true` | Mostra/nasconde il pulsante indietro. |
|
|
148
|
+
| `showSaveButton` | `boolean` | `true` | Mostra/nasconde il pulsante salva. |
|
|
149
|
+
| `values` | `Record[]` | `null` | Record pre-caricati per la modalità LIST. |
|
|
150
|
+
| `FormJSON` | `string` | `""` | JSON del form per la modalità REPAIR. |
|
|
151
|
+
| `formulaObject` | `any` | `{}` | Oggetto contesto per le formule (es. `{ role, user }`). |
|
|
152
|
+
| `selectedRecord` | `Record \| string` | `null` | Record pre-selezionato (oggetto o ID). |
|
|
153
|
+
| `externalButtons` | `RecordButton[]` | `[]` | Pulsanti extra nel menu azioni record. |
|
|
154
|
+
| `actionButtons` | `ActionButton[]` | `[]` | Pulsanti azione per i campi di tipo `Bottone`. |
|
|
155
|
+
| `defaultListActions` | `DynamicModuleListFormRecordActionsDefault` | tutti `true` | Azioni default lista: add, view, edit, duplicate, delete, graphs. |
|
|
156
|
+
| `listViewRecordTitle` | `string[]` | `[]` | Chiavi dei campi che compongono il titolo accordion. |
|
|
157
|
+
| `defaultListViewFunction` | `Function` | `null` | Funzione custom al caricamento della lista. |
|
|
158
|
+
| `onSaveBackToList` | `boolean` | `false` | Torna alla LIST dopo il salvataggio. |
|
|
159
|
+
| `onBackTo` | `DynamicModuleViewModeEnum` | `null` | Modalità di destinazione del pulsante indietro. |
|
|
160
|
+
| `numberOfColumns` | `number` | `3` | Numero di colonne del layout. |
|
|
161
|
+
| `showHiddenFields` | `boolean` | `true` | Mostra/nasconde i campi marcati come nascosti. |
|
|
162
|
+
| `filterResultViewMode` | `DynamicModuleFilterResultViewModeEnum` | `INTERNAL_EQPTABLE` | Modalità visualizzazione risultati filtro. |
|
|
163
|
+
| `additionalParams` | `any` | `null` | Parametri extra per le chiamate filtro server. |
|
|
164
|
+
| `additionalInfo` | `any` | `null` | Dati extra per operazioni client-side. |
|
|
165
|
+
| `prefilterParams` | `any` | `null` | Parametri pre-filtro. |
|
|
166
|
+
| `updateInfo` | `any` | `null` | Dati per aggiornare i valori delle risposte. |
|
|
167
|
+
| `contestualizationParams` | `any` | `null` | Parametri di contestualizzazione della lista risultati. |
|
|
168
|
+
| `showNewSearchButton` | `boolean` | `true` | Mostra/nasconde il pulsante "nuova ricerca". |
|
|
169
|
+
| `highlightFilter` | `any` | — | Configurazione evidenziazione righe/campi. |
|
|
170
|
+
| `isDraggableListView` | `boolean` | `true` | Abilita drag-and-drop nella lista. |
|
|
171
|
+
| `Statistic` | `FilterStatistic` | `null` | Configurazione statistiche e filtri. |
|
|
172
|
+
| `QueryEditorComponent` | `any` | — | Componente query editor custom per i lookup. |
|
|
173
|
+
| `debugMode` | `boolean` | `false` | Abilita log dettagliati in console. |
|
|
174
|
+
|
|
175
|
+
**Output**
|
|
176
|
+
|
|
177
|
+
| Output | Payload | Descrizione |
|
|
164
178
|
|--------|---------|-------------|
|
|
165
|
-
| `(saveRecord)` | `Record` |
|
|
166
|
-
| `(afterSaveRecord)` | `Record` |
|
|
167
|
-
| `(deleteRecord)` | `Record` |
|
|
168
|
-
| `(afterDeleteRecord)` | `Record` |
|
|
169
|
-
| `(SaveJSON)` | `string` |
|
|
170
|
-
| `(afterFilter)` | `DynRecord[]` |
|
|
171
|
-
| `(dragStarted)` | `Record` |
|
|
172
|
-
| `(dragReleased)` | `void` |
|
|
173
|
-
| `(clickDragIndicator)` | `Record` |
|
|
174
|
-
| `(out)` | `eventOut` |
|
|
175
|
-
| `(fireTrigger)` | `FireTrigger` |
|
|
176
|
-
| `(afterOutputExternalFilters)` | `FilterStatistic` |
|
|
179
|
+
| `(saveRecord)` | `Record` | Emesso al salvataggio **senza** endpoint configurato. |
|
|
180
|
+
| `(afterSaveRecord)` | `Record` | Emesso dopo la chiamata server di salvataggio. |
|
|
181
|
+
| `(deleteRecord)` | `Record` | Emesso all'eliminazione **senza** endpoint configurato. |
|
|
182
|
+
| `(afterDeleteRecord)` | `Record` | Emesso dopo la chiamata server di eliminazione. |
|
|
183
|
+
| `(SaveJSON)` | `string` | Emesso all'esportazione del JSON del form. |
|
|
184
|
+
| `(afterFilter)` | `DynRecord[]` | Emesso dopo l'applicazione di un filtro. |
|
|
185
|
+
| `(dragStarted)` | `Record` | Emesso all'inizio di un drag. |
|
|
186
|
+
| `(dragReleased)` | `void` | Emesso al rilascio del drag. |
|
|
187
|
+
| `(clickDragIndicator)` | `Record` | Emesso al click sull'icona drag. |
|
|
188
|
+
| `(out)` | `eventOut` | Output generico per comunicazione esterna. |
|
|
189
|
+
| `(fireTrigger)` | `FireTrigger` | Emesso quando scatta un trigger. |
|
|
190
|
+
| `(afterOutputExternalFilters)` | `FilterStatistic` | Emesso dopo filtri esterni applicati. |
|
|
177
191
|
|
|
178
192
|
---
|
|
179
193
|
|
|
180
|
-
|
|
194
|
+
#### `eqp-dynamic-module-configurator` — Builder form
|
|
181
195
|
|
|
182
|
-
|
|
196
|
+
Designer no-code per creare e modificare definizioni form.
|
|
183
197
|
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
##### 1. Create a new form
|
|
198
|
+
**Modalità d'uso**
|
|
187
199
|
|
|
188
200
|
```typescript
|
|
201
|
+
// Nuovo form
|
|
189
202
|
const specific = new DynamicModuleConfiguratorSpecificConfig();
|
|
190
203
|
specific.UserID = this.currentUser.id;
|
|
191
204
|
specific.orgaID = this.currentOrga.id;
|
|
192
|
-
|
|
193
205
|
const general = new DynamicModuleGeneralConfig(this.baseServerUrl, this.userToken, this.context, null);
|
|
194
|
-
|
|
195
|
-
this.configuratorConfig = new DynamicModuleConfiguratorConfig(general, specific);
|
|
206
|
+
this.config = new DynamicModuleConfiguratorConfig(general, specific);
|
|
196
207
|
```
|
|
197
208
|
|
|
198
209
|
```html
|
|
210
|
+
<!-- Nuovo form -->
|
|
199
211
|
<eqp-dynamic-module-configurator
|
|
200
|
-
*ngIf="
|
|
201
|
-
[configurations]="
|
|
202
|
-
(saveFormEvent)="
|
|
203
|
-
(afterSaveFormEvent)="onFormAfterSaved($event)">
|
|
212
|
+
*ngIf="config"
|
|
213
|
+
[configurations]="config"
|
|
214
|
+
(saveFormEvent)="onSalvaForm($event)">
|
|
204
215
|
</eqp-dynamic-module-configurator>
|
|
205
|
-
```
|
|
206
|
-
|
|
207
|
-
##### 2. Edit an existing form
|
|
208
|
-
|
|
209
|
-
```typescript
|
|
210
|
-
this.formID = 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'; // existing form ID
|
|
211
|
-
// same config setup as above
|
|
212
|
-
```
|
|
213
216
|
|
|
214
|
-
|
|
217
|
+
<!-- Modifica form esistente -->
|
|
215
218
|
<eqp-dynamic-module-configurator
|
|
216
|
-
*ngIf="
|
|
217
|
-
[configurations]="
|
|
219
|
+
*ngIf="config"
|
|
220
|
+
[configurations]="config"
|
|
218
221
|
[formID]="formID"
|
|
219
|
-
(saveFormEvent)="
|
|
222
|
+
(saveFormEvent)="onSalvaForm($event)">
|
|
220
223
|
</eqp-dynamic-module-configurator>
|
|
221
|
-
```
|
|
222
|
-
|
|
223
|
-
##### 3. Export a form by ID
|
|
224
224
|
|
|
225
|
-
|
|
225
|
+
<!-- Esportazione -->
|
|
226
226
|
<eqp-dynamic-module-configurator
|
|
227
|
-
|
|
228
|
-
[configurations]="configuratorConfig"
|
|
227
|
+
[configurations]="config"
|
|
229
228
|
[formID]="formID"
|
|
230
229
|
[viewMode]="'Export'"
|
|
231
|
-
(saveFormEvent)="
|
|
230
|
+
(saveFormEvent)="onSalvaForm($event)">
|
|
231
|
+
</eqp-dynamic-module-configurator>
|
|
232
|
+
|
|
233
|
+
<!-- Importazione da JSON -->
|
|
234
|
+
<eqp-dynamic-module-configurator
|
|
235
|
+
[configurations]="config"
|
|
236
|
+
[formID]="null"
|
|
237
|
+
[viewMode]="'Export'"
|
|
238
|
+
(saveFormEvent)="onSalvaForm($event)">
|
|
232
239
|
</eqp-dynamic-module-configurator>
|
|
233
240
|
```
|
|
234
241
|
|
|
235
|
-
|
|
242
|
+
**Input**
|
|
243
|
+
|
|
244
|
+
| Input | Tipo | Default | Descrizione |
|
|
245
|
+
|-------|------|---------|-------------|
|
|
246
|
+
| `configurations` | `DynamicModuleConfiguratorConfig` | — | **Obbligatorio.** Contenitore configurazione. |
|
|
247
|
+
| `formID` | `string` | `null` | ID del form da modificare. `null` crea un nuovo form. |
|
|
248
|
+
| `viewMode` | `string` | `"addOrEdit"` | `"addOrEdit"` per creare/modificare, `"Export"` per esportare/importare. |
|
|
249
|
+
| `fieldsExtraConfig` | `FieldExtraConfig[]` | — | Configurazione extra per campi specifici. |
|
|
250
|
+
| `triggers` | `any` | — | Definizioni trigger disponibili nell'editor. |
|
|
251
|
+
| `actionButtons` | `any` | — | Definizioni action button disponibili. |
|
|
252
|
+
| `contestualization` | `Contestualization[]` | — | Opzioni di contestualizzazione per lookup e filtri. |
|
|
253
|
+
| `formulaObject` | `any` | — | Contesto per l'anteprima delle formule. |
|
|
254
|
+
| `QueryEditorComponent` | `DynamicLoaderDirectiveData` | — | Componente query editor custom. |
|
|
255
|
+
| `debugMode` | `boolean` | `false` | Abilita log dettagliati. |
|
|
256
|
+
|
|
257
|
+
**Output**
|
|
258
|
+
|
|
259
|
+
| Output | Payload | Descrizione |
|
|
260
|
+
|--------|---------|-------------|
|
|
261
|
+
| `(saveFormEvent)` | `Form` | Emesso al salvataggio **senza** endpoint configurato. |
|
|
262
|
+
| `(afterSaveFormEvent)` | `Form` | Emesso dopo la chiamata server di salvataggio. |
|
|
263
|
+
| `(out)` | `eventOut` | Output generico per comunicazione esterna. |
|
|
264
|
+
| `(fireTrigger)` | `FireTrigger` | Emesso quando scatta un trigger. |
|
|
265
|
+
|
|
266
|
+
---
|
|
267
|
+
|
|
268
|
+
### Modelli di configurazione
|
|
269
|
+
|
|
270
|
+
#### `DynamicModuleGeneralConfig`
|
|
236
271
|
|
|
237
272
|
```typescript
|
|
238
|
-
|
|
239
|
-
|
|
273
|
+
const general = new DynamicModuleGeneralConfig(
|
|
274
|
+
'https://api.esempio.it/api', // baseServerUrl
|
|
275
|
+
userToken, // token autenticazione
|
|
276
|
+
context, // oggetto Context
|
|
277
|
+
null // EndPointConfiguration (null = usa default)
|
|
278
|
+
);
|
|
240
279
|
```
|
|
241
280
|
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
281
|
+
| Proprietà | Tipo | Descrizione |
|
|
282
|
+
|-----------|------|-------------|
|
|
283
|
+
| `baseServerUrl` | `string` | URL base API. Usato per costruire automaticamente gli endpoint se `endPointConfiguration` è `null`. |
|
|
284
|
+
| `userToken` | `string` | Token di autenticazione inviato con ogni chiamata. |
|
|
285
|
+
| `endPointConfiguration` | `EndPointConfiguration \| null` | Override completo degli endpoint. `null` usa le rotte standard. |
|
|
286
|
+
| `context` | `Context` | Contesto applicativo. |
|
|
287
|
+
|
|
288
|
+
#### `DynamicModuleListFormRecordActionsDefault`
|
|
289
|
+
|
|
290
|
+
```typescript
|
|
291
|
+
const actions = new DynamicModuleListFormRecordActionsDefault();
|
|
292
|
+
actions.add = true; // Pulsante "Aggiungi" nell'header lista
|
|
293
|
+
actions.view = true; // Visualizza record (solo lettura)
|
|
294
|
+
actions.edit = true; // Modifica record
|
|
295
|
+
actions.duplicate = false; // Duplica record
|
|
296
|
+
actions.delete = true; // Elimina record
|
|
297
|
+
actions.graphs = false; // Grafici record
|
|
250
298
|
```
|
|
251
299
|
|
|
252
|
-
|
|
300
|
+
---
|
|
253
301
|
|
|
254
|
-
|
|
255
|
-
|-------|------|---------|-------------|
|
|
256
|
-
| `configurations` | `DynamicModuleConfiguratorConfig` | — | **Required.** Configuration container. |
|
|
257
|
-
| `formID` | `string` | `null` | ID of the form to edit. `null` creates a new form. |
|
|
258
|
-
| `viewMode` | `string` | `"addOrEdit"` | `"addOrEdit"` for create/edit, `"Export"` for export/import. |
|
|
259
|
-
| `fieldsExtraConfig` | `FieldExtraConfig[]` | — | Extra configuration applied to specific fields. |
|
|
260
|
-
| `triggers` | `any` | — | Trigger definitions available in the trigger editor. |
|
|
261
|
-
| `actionButtons` | `any` | — | Action button definitions available in the button editor. |
|
|
262
|
-
| `contestualization` | `Contestualization[]` | — | Contextualisation options for lookup and filter fields. |
|
|
263
|
-
| `formulaObject` | `any` | — | Context object for formula preview and evaluation. |
|
|
264
|
-
| `QueryEditorComponent` | `DynamicLoaderDirectiveData` | — | Custom query editor component for lookup fields. |
|
|
265
|
-
| `debugMode` | `boolean` | `false` | Enable verbose console logging. |
|
|
302
|
+
### Modalità di visualizzazione
|
|
266
303
|
|
|
267
|
-
|
|
304
|
+
```typescript
|
|
305
|
+
import { DynamicModuleViewModeEnum } from '@eqproject/eqp-dynamic-module';
|
|
268
306
|
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
307
|
+
enum DynamicModuleViewModeEnum {
|
|
308
|
+
NONE = 0, // Nessuna visualizzazione
|
|
309
|
+
VIEW = 1, // Sola lettura
|
|
310
|
+
COMPILE = 2, // Compilazione / modifica
|
|
311
|
+
LIST = 3, // Lista record
|
|
312
|
+
REPAIR = 4, // Revisione form
|
|
313
|
+
LISTWIEW = 5, // Lista compatta alternativa
|
|
314
|
+
FILTER = 6, // Filtro / ricerca
|
|
315
|
+
GRAPHS = 7, // Statistiche e grafici
|
|
316
|
+
HLIST = 8, // Lista orizzontale
|
|
317
|
+
EXTERNAL_FILTER = 9 // Filtro guidato dal componente padre
|
|
318
|
+
}
|
|
319
|
+
```
|
|
320
|
+
|
|
321
|
+
---
|
|
322
|
+
|
|
323
|
+
### Configurazione endpoint
|
|
324
|
+
|
|
325
|
+
Per default la libreria costruisce tutti gli URL dagli endpoint a partire da `baseServerUrl`. Passa un `EndPointConfiguration` custom per sovrascrivere singole rotte.
|
|
326
|
+
|
|
327
|
+
```typescript
|
|
328
|
+
import { EndPointConfiguration, EndPointData, RequestMethodEnum, ParamTypeEnum } from '@eqproject/eqp-dynamic-module';
|
|
329
|
+
|
|
330
|
+
const endPoints = new EndPointConfiguration();
|
|
331
|
+
endPoints.Records.SaveEndPoint = new EndPointData();
|
|
332
|
+
endPoints.Records.SaveEndPoint.Url = 'https://custom-api.esempio.it/records/save';
|
|
333
|
+
endPoints.Records.SaveEndPoint.RequestMethod = RequestMethodEnum.POST;
|
|
334
|
+
endPoints.Records.SaveEndPoint.Params = [{
|
|
335
|
+
ParamName: 'orgId',
|
|
336
|
+
ParamValue: this.orgaId,
|
|
337
|
+
ParamType: ParamTypeEnum['Query param']
|
|
338
|
+
}];
|
|
339
|
+
```
|
|
340
|
+
|
|
341
|
+
**Endpoint Records disponibili:** `GetWithContextualizationByFormCodeEndPoint`, `GetByFormIDEndPoint`, `GetByFormCodeEndPoint`, `GetAllByEntAndUserIDEndPoint`, `GetByIDEndPoint`, `SaveEndPoint`, `DuplicateEndPoint`, `DeleteEndPoint`, `RepairEndPoint`, `ApplyFilter`, `GetAllAttachmentsEndPoint`.
|
|
342
|
+
|
|
343
|
+
**Endpoint Forms disponibili:** `GetByIDEndPoint`, `GetAllFormEndPoint`, `GetByIDAndVersionEndPoint`, `SaveEndPoint`, `SaveAttachmentEndPoint`, `ExportByIDEndPoint`, `GetAttachmentWithBases64`, `SpeechToFormEditEndPoint`.
|
|
344
|
+
|
|
345
|
+
---
|
|
346
|
+
|
|
347
|
+
### Modelli dati
|
|
348
|
+
|
|
349
|
+
#### `Record`
|
|
350
|
+
|
|
351
|
+
| Proprietà | Tipo | Descrizione |
|
|
352
|
+
|-----------|------|-------------|
|
|
353
|
+
| `ID` | `string` | Identificatore unico. |
|
|
354
|
+
| `EntID` | `string` | ID del form (entità) di appartenenza. |
|
|
355
|
+
| `Version` | `number` | Versione del form al momento della compilazione. |
|
|
356
|
+
| `userID` | `string` | ID utente che ha creato il record. |
|
|
357
|
+
| `AnswerDate` | `string` | Data di compilazione (ISO). |
|
|
358
|
+
| `HTMLreadableValues` | `string` | Valori in formato HTML leggibile. |
|
|
359
|
+
| `AdditionalParams` | `any` | Parametri aggiuntivi. |
|
|
360
|
+
| `AdditionalInfo` | `any` | Informazioni aggiuntive. |
|
|
361
|
+
|
|
362
|
+
---
|
|
363
|
+
|
|
364
|
+
### Tipi di campo
|
|
365
|
+
|
|
366
|
+
| Valore | Chiave | Descrizione |
|
|
367
|
+
|--------|--------|-------------|
|
|
368
|
+
| `1` | `Campo di testo` | Input testo singola riga. |
|
|
369
|
+
| `2` | `Area di testo` | Textarea multiriga. |
|
|
370
|
+
| `3` | `Booleano` | Checkbox / toggle. |
|
|
371
|
+
| `4` | `Data e/ora` | Selettore data e/o ora. |
|
|
372
|
+
| `5` | `Campo numerico` | Input numerico con maschera. |
|
|
373
|
+
| `6` | `Allegato` | Upload file. |
|
|
374
|
+
| `7` | `Immagine` | Upload immagine con crop. |
|
|
375
|
+
| `8` | `Elenco generico` | Dropdown / selezione multipla. |
|
|
376
|
+
| `9` | `Lookup` | Lookup server-side con query configurabile. |
|
|
377
|
+
| `10` | `Form di dettaglio` | Form di dettaglio annidato. |
|
|
378
|
+
| `11` | `Elenco immagini` | Selettore lista immagini. |
|
|
379
|
+
| `12` | `Etichetta` | Solo visualizzazione. |
|
|
380
|
+
| `13` | `Immagine con markers` | Immagine con annotazioni interattive. |
|
|
381
|
+
| `14` | `Bottone` | Campo pulsante azione. |
|
|
382
|
+
|
|
383
|
+
---
|
|
384
|
+
|
|
385
|
+
## English version
|
|
386
|
+
|
|
387
|
+
- [Overview](#overview)
|
|
388
|
+
- [Prerequisites](#prerequisites)
|
|
389
|
+
- [Installation](#installation)
|
|
390
|
+
- [Module Setup](#module-setup)
|
|
391
|
+
- [Components](#components)
|
|
392
|
+
- [eqp-dynamic-module — Form Viewer/Filler](#eqp-dynamic-module--form-viewerfiller)
|
|
393
|
+
- [eqp-dynamic-module-configurator — Form Builder](#eqp-dynamic-module-configurator--form-builder)
|
|
394
|
+
- [Configuration Models](#configuration-models)
|
|
395
|
+
- [View Modes](#view-modes)
|
|
396
|
+
- [Endpoint Configuration](#endpoint-configuration)
|
|
397
|
+
- [Data Models](#data-models)
|
|
398
|
+
- [Field Types Reference](#field-types-reference)
|
|
399
|
+
|
|
400
|
+
---
|
|
401
|
+
|
|
402
|
+
### Overview
|
|
403
|
+
|
|
404
|
+
`@eqproject/eqp-dynamic-module` exposes **two public components**:
|
|
405
|
+
|
|
406
|
+
| Component | Purpose |
|
|
407
|
+
|-----------|---------|
|
|
408
|
+
| `<eqp-dynamic-module>` | Runtime form viewer, filler, list, filter and graphs |
|
|
409
|
+
| `<eqp-dynamic-module-configurator>` | No-code form builder (create, edit, import, export) |
|
|
410
|
+
|
|
411
|
+
Forms are defined as JSON structures stored server-side and fetched at runtime. The library handles rendering, validation, data retrieval, CRUD operations and advanced features like formulas, triggers, action buttons and speech-to-text.
|
|
275
412
|
|
|
276
413
|
---
|
|
277
414
|
|
|
278
|
-
|
|
415
|
+
### Prerequisites
|
|
416
|
+
|
|
417
|
+
```bash
|
|
418
|
+
npm install @angular/cdk@^15.1.2 @angular/material@^15.1.2 @angular/material-luxon-adapter@^15.2.9 --legacy-peer-deps
|
|
419
|
+
npm install @angular-material-components/datetime-picker@^15.0.0 @angular-material-components/moment-adapter@^15.0.0 --legacy-peer-deps
|
|
420
|
+
npm install moment@^2.29.4 sweetalert2@^11.4.24 --legacy-peer-deps
|
|
421
|
+
```
|
|
422
|
+
|
|
423
|
+
> All `npm install` commands for this library require `--legacy-peer-deps`.
|
|
424
|
+
|
|
425
|
+
---
|
|
426
|
+
|
|
427
|
+
### Installation
|
|
428
|
+
|
|
429
|
+
```bash
|
|
430
|
+
npm install @eqproject/eqp-dynamic-module --legacy-peer-deps
|
|
431
|
+
```
|
|
279
432
|
|
|
280
|
-
|
|
433
|
+
---
|
|
281
434
|
|
|
282
|
-
|
|
435
|
+
### Module Setup
|
|
283
436
|
|
|
284
437
|
```typescript
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
438
|
+
import { EqpDynamicModuleModule } from '@eqproject/eqp-dynamic-module';
|
|
439
|
+
|
|
440
|
+
@NgModule({
|
|
441
|
+
imports: [EqpDynamicModuleModule]
|
|
442
|
+
})
|
|
443
|
+
export class AppModule {}
|
|
291
444
|
```
|
|
292
445
|
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
446
|
+
Add Angular Material theme to `angular.json` styles:
|
|
447
|
+
|
|
448
|
+
```json
|
|
449
|
+
"styles": [
|
|
450
|
+
"node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
|
|
451
|
+
"src/styles.css"
|
|
452
|
+
]
|
|
453
|
+
```
|
|
299
454
|
|
|
300
455
|
---
|
|
301
456
|
|
|
302
|
-
###
|
|
457
|
+
### Components
|
|
303
458
|
|
|
304
|
-
|
|
459
|
+
#### `eqp-dynamic-module` — Form Viewer/Filler
|
|
305
460
|
|
|
306
|
-
|
|
307
|
-
|----------|------|-------------|
|
|
308
|
-
| `dynamicModuleGeneralConfig` | `DynamicModuleGeneralConfig` | Server connection settings. |
|
|
309
|
-
| `dynamicModuleCompileConfig` | `DynamicModuleCompileConfig` | COMPILE mode settings. |
|
|
310
|
-
| `dynamicModuleListConfig` | `DynamicModuleListConfig` | LIST mode settings. |
|
|
311
|
-
| `dynamicModuleRepairConfig` | `DynamicModuleRepairConfig` | REPAIR mode settings. |
|
|
461
|
+
**Basic usage**
|
|
312
462
|
|
|
313
|
-
|
|
463
|
+
```typescript
|
|
464
|
+
import { DynamicModuleGeneralConfig, DynamicModuleViewModeEnum } from '@eqproject/eqp-dynamic-module';
|
|
314
465
|
|
|
315
|
-
|
|
316
|
-
|
|
466
|
+
generalConfig = new DynamicModuleGeneralConfig(
|
|
467
|
+
'https://your-api.example.com/api',
|
|
468
|
+
this.userToken,
|
|
469
|
+
this.context,
|
|
470
|
+
null
|
|
471
|
+
);
|
|
472
|
+
```
|
|
473
|
+
|
|
474
|
+
```html
|
|
475
|
+
<eqp-dynamic-module
|
|
476
|
+
[configurations]="generalConfig"
|
|
477
|
+
[formID]="'your-form-id'"
|
|
478
|
+
[starterViewMode]="DynamicModuleViewModeEnum.LIST"
|
|
479
|
+
[userID]="currentUser.id"
|
|
480
|
+
(saveRecord)="onSave($event)"
|
|
481
|
+
(afterSaveRecord)="onAfterSave($event)">
|
|
482
|
+
</eqp-dynamic-module>
|
|
483
|
+
```
|
|
484
|
+
|
|
485
|
+
**Inputs**
|
|
486
|
+
|
|
487
|
+
| Input | Type | Default | Description |
|
|
488
|
+
|-------|------|---------|-------------|
|
|
489
|
+
| `configurations` | `DynamicModuleGeneralConfig` | — | **Required.** Server connection configuration. |
|
|
490
|
+
| `formID` | `string` | — | **Required.** ID of the form to display. |
|
|
491
|
+
| `starterViewMode` | `DynamicModuleViewModeEnum` | `LIST` | Initial view mode. |
|
|
492
|
+
| `userID` | `string` | `"0"` | User ID stamped on saved records. |
|
|
493
|
+
| `orgaID` | `string` | `"0"` | Organization ID. |
|
|
317
494
|
| `showTitle` | `boolean` | `true` | Show/hide the form name. |
|
|
318
|
-
| `showSaveButton` | `boolean` | `true` | Show/hide the save button. |
|
|
319
495
|
| `showBackButton` | `boolean` | `true` | Show/hide the back button. |
|
|
320
|
-
| `
|
|
321
|
-
| `
|
|
322
|
-
| `
|
|
496
|
+
| `showSaveButton` | `boolean` | `true` | Show/hide the save button. |
|
|
497
|
+
| `values` | `Record[]` | `null` | Pre-loaded records for LIST mode. |
|
|
498
|
+
| `FormJSON` | `string` | `""` | Form JSON string for REPAIR mode. |
|
|
499
|
+
| `formulaObject` | `any` | `{}` | Context object for formula evaluation. |
|
|
500
|
+
| `selectedRecord` | `Record \| string` | `null` | Pre-select a record by object or ID. |
|
|
501
|
+
| `externalButtons` | `RecordButton[]` | `[]` | Extra buttons in the record action menu. |
|
|
502
|
+
| `actionButtons` | `ActionButton[]` | `[]` | Action buttons for `Bottone` field type. |
|
|
503
|
+
| `defaultListActions` | `DynamicModuleListFormRecordActionsDefault` | all `true` | Toggle default list actions. |
|
|
504
|
+
| `listViewRecordTitle` | `string[]` | `[]` | Field keys composing the accordion title. |
|
|
505
|
+
| `defaultListViewFunction` | `Function` | `null` | Custom function called on list load. |
|
|
506
|
+
| `onSaveBackToList` | `boolean` | `false` | Return to LIST after save. |
|
|
507
|
+
| `onBackTo` | `DynamicModuleViewModeEnum` | `null` | View mode for the back button. |
|
|
508
|
+
| `numberOfColumns` | `number` | `3` | Number of layout columns. |
|
|
509
|
+
| `showHiddenFields` | `boolean` | `true` | Show/hide hidden fields. |
|
|
510
|
+
| `filterResultViewMode` | `DynamicModuleFilterResultViewModeEnum` | `INTERNAL_EQPTABLE` | Filter results display mode. |
|
|
511
|
+
| `additionalParams` | `any` | `null` | Extra params for server filter calls. |
|
|
512
|
+
| `additionalInfo` | `any` | `null` | Extra data for client-side operations. |
|
|
323
513
|
| `prefilterParams` | `any` | `null` | Pre-filter parameters. |
|
|
514
|
+
| `updateInfo` | `any` | `null` | Data to update response values after load. |
|
|
515
|
+
| `contestualizationParams` | `any` | `null` | Contextualisation parameters. |
|
|
324
516
|
| `showNewSearchButton` | `boolean` | `true` | Show/hide the new search button. |
|
|
517
|
+
| `highlightFilter` | `any` | — | Row/field highlighting configuration. |
|
|
518
|
+
| `isDraggableListView` | `boolean` | `true` | Enable drag-and-drop in list view. |
|
|
519
|
+
| `Statistic` | `FilterStatistic` | `null` | Statistics and filter configuration. |
|
|
520
|
+
| `QueryEditorComponent` | `any` | — | Custom query editor component for lookups. |
|
|
521
|
+
| `debugMode` | `boolean` | `false` | Enable verbose console logging. |
|
|
325
522
|
|
|
326
|
-
|
|
523
|
+
**Outputs**
|
|
327
524
|
|
|
328
|
-
|
|
|
329
|
-
|
|
330
|
-
| `
|
|
331
|
-
| `
|
|
332
|
-
| `
|
|
333
|
-
| `
|
|
334
|
-
| `
|
|
335
|
-
| `
|
|
336
|
-
| `
|
|
337
|
-
| `
|
|
525
|
+
| Output | Payload | Description |
|
|
526
|
+
|--------|---------|-------------|
|
|
527
|
+
| `(saveRecord)` | `Record` | Emitted on save when **no** save endpoint is configured. |
|
|
528
|
+
| `(afterSaveRecord)` | `Record` | Emitted after server save call completes. |
|
|
529
|
+
| `(deleteRecord)` | `Record` | Emitted on delete when **no** delete endpoint is configured. |
|
|
530
|
+
| `(afterDeleteRecord)` | `Record` | Emitted after server delete call completes. |
|
|
531
|
+
| `(SaveJSON)` | `string` | Emitted when form JSON is exported. |
|
|
532
|
+
| `(afterFilter)` | `DynRecord[]` | Emitted after filter operation with result set. |
|
|
533
|
+
| `(dragStarted)` | `Record` | Emitted when drag starts. |
|
|
534
|
+
| `(dragReleased)` | `void` | Emitted when drag ends. |
|
|
535
|
+
| `(clickDragIndicator)` | `Record` | Emitted when drag handle is clicked. |
|
|
536
|
+
| `(out)` | `eventOut` | General-purpose external output. |
|
|
537
|
+
| `(fireTrigger)` | `FireTrigger` | Emitted when a trigger fires. |
|
|
538
|
+
| `(afterOutputExternalFilters)` | `FilterStatistic` | Emitted after external filters applied. |
|
|
338
539
|
|
|
339
|
-
|
|
540
|
+
---
|
|
340
541
|
|
|
341
|
-
|
|
342
|
-
|----------|------|-------------|
|
|
343
|
-
| `FormJSON` | `string` | JSON string of the form to review/repair. |
|
|
542
|
+
#### `eqp-dynamic-module-configurator` — Form Builder
|
|
344
543
|
|
|
345
|
-
|
|
544
|
+
**Usage modes**
|
|
346
545
|
|
|
347
|
-
|
|
546
|
+
```html
|
|
547
|
+
<!-- Create new form -->
|
|
548
|
+
<eqp-dynamic-module-configurator
|
|
549
|
+
*ngIf="config"
|
|
550
|
+
[configurations]="config"
|
|
551
|
+
(saveFormEvent)="onFormSaved($event)">
|
|
552
|
+
</eqp-dynamic-module-configurator>
|
|
348
553
|
|
|
349
|
-
|
|
554
|
+
<!-- Edit existing form -->
|
|
555
|
+
<eqp-dynamic-module-configurator
|
|
556
|
+
[configurations]="config"
|
|
557
|
+
[formID]="formID"
|
|
558
|
+
(saveFormEvent)="onFormSaved($event)">
|
|
559
|
+
</eqp-dynamic-module-configurator>
|
|
350
560
|
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
561
|
+
<!-- Export form -->
|
|
562
|
+
<eqp-dynamic-module-configurator
|
|
563
|
+
[configurations]="config"
|
|
564
|
+
[formID]="formID"
|
|
565
|
+
[viewMode]="'Export'"
|
|
566
|
+
(saveFormEvent)="onFormSaved($event)">
|
|
567
|
+
</eqp-dynamic-module-configurator>
|
|
568
|
+
|
|
569
|
+
<!-- Import from JSON -->
|
|
570
|
+
<eqp-dynamic-module-configurator
|
|
571
|
+
[configurations]="config"
|
|
572
|
+
[formID]="null"
|
|
573
|
+
[viewMode]="'Export'"
|
|
574
|
+
(saveFormEvent)="onFormSaved($event)">
|
|
575
|
+
</eqp-dynamic-module-configurator>
|
|
576
|
+
```
|
|
355
577
|
|
|
356
|
-
|
|
578
|
+
**Inputs**
|
|
357
579
|
|
|
358
|
-
|
|
|
359
|
-
|
|
360
|
-
| `
|
|
361
|
-
| `
|
|
362
|
-
| `
|
|
363
|
-
| `
|
|
364
|
-
| `
|
|
580
|
+
| Input | Type | Default | Description |
|
|
581
|
+
|-------|------|---------|-------------|
|
|
582
|
+
| `configurations` | `DynamicModuleConfiguratorConfig` | — | **Required.** Configuration container. |
|
|
583
|
+
| `formID` | `string` | `null` | Form ID to edit. `null` creates a new form. |
|
|
584
|
+
| `viewMode` | `string` | `"addOrEdit"` | `"addOrEdit"` or `"Export"`. |
|
|
585
|
+
| `fieldsExtraConfig` | `FieldExtraConfig[]` | — | Extra configuration for specific fields. |
|
|
586
|
+
| `triggers` | `any` | — | Trigger definitions for the editor. |
|
|
587
|
+
| `actionButtons` | `any` | — | Action button definitions. |
|
|
588
|
+
| `contestualization` | `Contestualization[]` | — | Contextualisation options. |
|
|
589
|
+
| `formulaObject` | `any` | — | Context for formula preview. |
|
|
590
|
+
| `QueryEditorComponent` | `DynamicLoaderDirectiveData` | — | Custom query editor component. |
|
|
591
|
+
| `debugMode` | `boolean` | `false` | Enable verbose logging. |
|
|
592
|
+
|
|
593
|
+
**Outputs**
|
|
594
|
+
|
|
595
|
+
| Output | Payload | Description |
|
|
596
|
+
|--------|---------|-------------|
|
|
597
|
+
| `(saveFormEvent)` | `Form` | Emitted on save when **no** save endpoint is configured. |
|
|
598
|
+
| `(afterSaveFormEvent)` | `Form` | Emitted after server save call completes. |
|
|
599
|
+
| `(out)` | `eventOut` | General-purpose external output. |
|
|
600
|
+
| `(fireTrigger)` | `FireTrigger` | Emitted when a trigger fires. |
|
|
365
601
|
|
|
366
602
|
---
|
|
367
603
|
|
|
368
|
-
###
|
|
604
|
+
### Configuration Models
|
|
369
605
|
|
|
370
|
-
|
|
606
|
+
#### `DynamicModuleGeneralConfig`
|
|
607
|
+
|
|
608
|
+
```typescript
|
|
609
|
+
const general = new DynamicModuleGeneralConfig(
|
|
610
|
+
baseServerUrl, // string — e.g. "https://api.example.com/api"
|
|
611
|
+
userToken, // string — auth token
|
|
612
|
+
context, // Context
|
|
613
|
+
endPointConfiguration // EndPointConfiguration | null
|
|
614
|
+
);
|
|
615
|
+
```
|
|
616
|
+
|
|
617
|
+
#### `DynamicModuleListFormRecordActionsDefault`
|
|
371
618
|
|
|
372
619
|
```typescript
|
|
373
620
|
const actions = new DynamicModuleListFormRecordActionsDefault();
|
|
374
|
-
actions.add = true;
|
|
375
|
-
actions.view = true;
|
|
376
|
-
actions.edit = true;
|
|
377
|
-
actions.duplicate = false;
|
|
378
|
-
actions.delete = true;
|
|
379
|
-
actions.graphs = false;
|
|
621
|
+
actions.add = true;
|
|
622
|
+
actions.view = true;
|
|
623
|
+
actions.edit = true;
|
|
624
|
+
actions.duplicate = false;
|
|
625
|
+
actions.delete = true;
|
|
626
|
+
actions.graphs = false;
|
|
380
627
|
```
|
|
381
628
|
|
|
382
629
|
---
|
|
383
630
|
|
|
384
|
-
|
|
631
|
+
### View Modes
|
|
385
632
|
|
|
386
633
|
```typescript
|
|
387
|
-
import { DynamicModuleViewModeEnum } from '@eqproject/eqp-dynamic-module';
|
|
388
|
-
|
|
389
634
|
enum DynamicModuleViewModeEnum {
|
|
390
|
-
NONE = 0,
|
|
391
|
-
VIEW = 1,
|
|
392
|
-
COMPILE = 2,
|
|
393
|
-
LIST = 3,
|
|
394
|
-
REPAIR = 4,
|
|
395
|
-
LISTWIEW = 5,
|
|
396
|
-
FILTER = 6,
|
|
397
|
-
GRAPHS = 7,
|
|
398
|
-
HLIST = 8,
|
|
399
|
-
EXTERNAL_FILTER = 9
|
|
635
|
+
NONE = 0,
|
|
636
|
+
VIEW = 1,
|
|
637
|
+
COMPILE = 2,
|
|
638
|
+
LIST = 3,
|
|
639
|
+
REPAIR = 4,
|
|
640
|
+
LISTWIEW = 5,
|
|
641
|
+
FILTER = 6,
|
|
642
|
+
GRAPHS = 7,
|
|
643
|
+
HLIST = 8,
|
|
644
|
+
EXTERNAL_FILTER = 9
|
|
400
645
|
}
|
|
401
646
|
```
|
|
402
647
|
|
|
403
648
|
---
|
|
404
649
|
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
By default the library builds all endpoint URLs from `baseServerUrl` using a standard convention. Pass a custom `EndPointConfiguration` to override individual routes.
|
|
650
|
+
### Endpoint Configuration
|
|
408
651
|
|
|
409
652
|
```typescript
|
|
410
|
-
import {
|
|
411
|
-
EndPointConfiguration,
|
|
412
|
-
EndPointData,
|
|
413
|
-
EndPointDataParams,
|
|
414
|
-
RequestMethodEnum,
|
|
415
|
-
ParamTypeEnum
|
|
416
|
-
} from '@eqproject/eqp-dynamic-module';
|
|
417
|
-
|
|
418
653
|
const endPoints = new EndPointConfiguration();
|
|
419
|
-
|
|
420
|
-
// Override the "save record" endpoint
|
|
421
654
|
endPoints.Records.SaveEndPoint = new EndPointData();
|
|
422
655
|
endPoints.Records.SaveEndPoint.Url = 'https://custom-api.example.com/records/save';
|
|
423
656
|
endPoints.Records.SaveEndPoint.RequestMethod = RequestMethodEnum.POST;
|
|
424
|
-
endPoints.Records.SaveEndPoint.Params = [
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
}
|
|
430
|
-
];
|
|
431
|
-
|
|
657
|
+
endPoints.Records.SaveEndPoint.Params = [{
|
|
658
|
+
ParamName: 'orgId',
|
|
659
|
+
ParamValue: this.orgaId,
|
|
660
|
+
ParamType: ParamTypeEnum['Query param']
|
|
661
|
+
}];
|
|
432
662
|
const general = new DynamicModuleGeneralConfig(baseUrl, token, context, endPoints);
|
|
433
663
|
```
|
|
434
664
|
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
#### `EndPointConfiguration.Records`
|
|
438
|
-
|
|
439
|
-
| Key | Default route | Description |
|
|
440
|
-
|-----|--------------|-------------|
|
|
441
|
-
| `GetWithContextualizationByFormCodeEndPoint` | `GET /records/getbyformcode` | Fetch records with contextualisation by form code. |
|
|
442
|
-
| `GetByFormIDEndPoint` | `GET /records/getbyformid` | Fetch records by form ID. |
|
|
443
|
-
| `GetByFormCodeEndPoint` | `GET /records/getbyformcode` | Fetch records by form code. |
|
|
444
|
-
| `GetAllByEntAndUserIDEndPoint` | `GET /records/getallbyentanduserid` | Fetch all records for an entity + user. |
|
|
445
|
-
| `GetByIDEndPoint` | `GET /records/getbyid` | Fetch a single record by its ID. |
|
|
446
|
-
| `SaveEndPoint` | `POST /records/save` | Create or update a record. |
|
|
447
|
-
| `DuplicateEndPoint` | `POST /records/duplicate` | Duplicate an existing record. |
|
|
448
|
-
| `DeleteEndPoint` | `DELETE /records/delete` | Delete a record. |
|
|
449
|
-
| `RepairEndPoint` | `POST /records/repair` | Repair/review a form record. |
|
|
450
|
-
| `ApplyFilter` | `POST /records/filter` | Apply server-side filter. |
|
|
451
|
-
| `GetAllAttachmentsEndPoint` | `GET /records/attachments` | Fetch all attachments for a record. |
|
|
452
|
-
|
|
453
|
-
#### `EndPointConfiguration.Forms`
|
|
454
|
-
|
|
455
|
-
| Key | Default route | Description |
|
|
456
|
-
|-----|--------------|-------------|
|
|
457
|
-
| `GetByIDEndPoint` | `GET /forms/getbyid` | Fetch a form definition by ID. |
|
|
458
|
-
| `GetAllFormEndPoint` | `GET /forms/getall` | Fetch all form definitions. |
|
|
459
|
-
| `GetByIDAndVersionEndPoint` | `GET /forms/getbyidandversion` | Fetch a specific form version. |
|
|
460
|
-
| `SaveEndPoint` | `POST /forms/save` | Save a form definition. |
|
|
461
|
-
| `SaveAttachmentEndPoint` | `POST /forms/saveattachment` | Save a form attachment. |
|
|
462
|
-
| `ExportByIDEndPoint` | `GET /forms/exportbyid` | Export a form definition by ID. |
|
|
463
|
-
| `GetAttachmentWithBases64` | `GET /forms/attachment` | Fetch attachment with Base64 encoding. |
|
|
464
|
-
| `SpeechToFormEditEndPoint` | `POST /forms/speechtoedit` | Apply speech-to-text edits to a form. |
|
|
465
|
-
|
|
466
|
-
### `EndPointData`
|
|
467
|
-
|
|
468
|
-
| Property | Type | Description |
|
|
469
|
-
|----------|------|-------------|
|
|
470
|
-
| `Url` | `string` | Full endpoint URL. |
|
|
471
|
-
| `Token` | `string` | Per-endpoint auth token (overrides the general `userToken`). |
|
|
472
|
-
| `RequestMethod` | `RequestMethodEnum` | `GET`, `POST`, `PUT` or `DELETE`. |
|
|
473
|
-
| `Params` | `EndPointDataParams[]` | Parameters to include with the request. |
|
|
474
|
-
|
|
475
|
-
### `EndPointDataParams`
|
|
665
|
+
**Available Records endpoints:** `GetWithContextualizationByFormCodeEndPoint`, `GetByFormIDEndPoint`, `GetByFormCodeEndPoint`, `GetAllByEntAndUserIDEndPoint`, `GetByIDEndPoint`, `SaveEndPoint`, `DuplicateEndPoint`, `DeleteEndPoint`, `RepairEndPoint`, `ApplyFilter`, `GetAllAttachmentsEndPoint`.
|
|
476
666
|
|
|
477
|
-
|
|
478
|
-
|----------|------|-------------|
|
|
479
|
-
| `ParamName` | `string` | Parameter name. |
|
|
480
|
-
| `ParamValue` | `any` | Parameter value. |
|
|
481
|
-
| `ParamType` | `ParamTypeEnum` | `1` = query string, `2` = route segment, `3` = request body. |
|
|
667
|
+
**Available Forms endpoints:** `GetByIDEndPoint`, `GetAllFormEndPoint`, `GetByIDAndVersionEndPoint`, `SaveEndPoint`, `SaveAttachmentEndPoint`, `ExportByIDEndPoint`, `GetAttachmentWithBases64`, `SpeechToFormEditEndPoint`.
|
|
482
668
|
|
|
483
669
|
---
|
|
484
670
|
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
### `Record`
|
|
671
|
+
### Data Models
|
|
488
672
|
|
|
489
|
-
|
|
673
|
+
#### `Record`
|
|
490
674
|
|
|
491
675
|
| Property | Type | Description |
|
|
492
676
|
|----------|------|-------------|
|
|
493
677
|
| `ID` | `string` | Unique record identifier. |
|
|
494
|
-
| `EntID` | `string` | ID of the form
|
|
495
|
-
| `Version` | `number` | Form version at
|
|
678
|
+
| `EntID` | `string` | ID of the form this record belongs to. |
|
|
679
|
+
| `Version` | `number` | Form version at compilation time. |
|
|
496
680
|
| `userID` | `string` | ID of the user who created the record. |
|
|
497
|
-
| `AnswerDate` | `string` | ISO date string of
|
|
498
|
-
| `HTMLreadableValues` | `string` | Pre-rendered HTML
|
|
499
|
-
| `AdditionalParams` | `any` | Extra parameters
|
|
500
|
-
| `AdditionalInfo` | `any` | Extra information
|
|
501
|
-
|
|
502
|
-
### `Form`
|
|
503
|
-
|
|
504
|
-
Describes a form definition returned by `(saveFormEvent)`.
|
|
505
|
-
|
|
506
|
-
| Property | Type | Description |
|
|
507
|
-
|----------|------|-------------|
|
|
508
|
-
| `ID` | `string` | Unique form identifier (GUID). |
|
|
509
|
-
| `Code` | `string` | Short form code (uppercase, no special characters). |
|
|
510
|
-
| `Name` | `string` | Display name. |
|
|
511
|
-
| `Description` | `string` | Optional description. |
|
|
512
|
-
| `Version` | `number` | Form version number. |
|
|
513
|
-
| `OrgaID` | `string` | Owning organisation ID. |
|
|
514
|
-
| `FormScalarType` | `FormScalarTypeEnum` | Layout: `Semplice` (1), `A step` (2), `In tab` (3), `In accordion` (4). |
|
|
515
|
-
| `Fields` | `BaseField[]` | Ordered array of form fields. |
|
|
516
|
-
| `Triggers` | `Trigger[]` | Automation triggers. |
|
|
517
|
-
| `ActionButtons` | `ActionButton[]` | Action buttons. |
|
|
518
|
-
| `InnerForms` | `Form[]` | Nested detail forms. |
|
|
681
|
+
| `AnswerDate` | `string` | ISO date string of compilation. |
|
|
682
|
+
| `HTMLreadableValues` | `string` | Pre-rendered HTML of field values. |
|
|
683
|
+
| `AdditionalParams` | `any` | Extra parameters. |
|
|
684
|
+
| `AdditionalInfo` | `any` | Extra information. |
|
|
519
685
|
|
|
520
686
|
---
|
|
521
687
|
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
The `FieldTypeEnum` describes every field type available in the form builder.
|
|
688
|
+
### Field Types Reference
|
|
525
689
|
|
|
526
690
|
| Value | Key | Description |
|
|
527
691
|
|-------|-----|-------------|
|
|
@@ -539,12 +703,3 @@ The `FieldTypeEnum` describes every field type available in the form builder.
|
|
|
539
703
|
| `12` | `Etichetta` | Display-only label. |
|
|
540
704
|
| `13` | `Immagine con markers` | Image with interactive annotation markers. |
|
|
541
705
|
| `14` | `Bottone` | Action button field. |
|
|
542
|
-
|
|
543
|
-
### Field value sources (`DataGetterTypeEnum`)
|
|
544
|
-
|
|
545
|
-
| Value | Description |
|
|
546
|
-
|-------|-------------|
|
|
547
|
-
| `Manuale` (1) | User enters the value manually. |
|
|
548
|
-
| `Formula` (2) | Value is computed from a formula expression. |
|
|
549
|
-
| `Da database` (3) | Value is fetched from a database query. |
|
|
550
|
-
| `Da modulo dinamico` (4) | Value is pulled from another dynamic form record. |
|