@formio/js 5.0.0-dev.5717.a2aa09f → 5.0.0-dev.5719.d2d4a61
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/dist/formio.form.js +2 -2
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.full.js +2 -2
- package/dist/formio.full.min.js +1 -1
- package/lib/cjs/components/_classes/nested/NestedComponent.d.ts +1 -2
- package/lib/cjs/components/_classes/nested/NestedComponent.js +1 -4
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.d.ts +2 -0
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js +50 -29
- package/lib/cjs/components/editgrid/fixtures/comp17.d.ts +80 -0
- package/lib/cjs/components/editgrid/fixtures/comp17.js +99 -0
- package/lib/cjs/components/editgrid/fixtures/index.d.ts +2 -1
- package/lib/cjs/components/editgrid/fixtures/index.js +3 -1
- package/lib/mjs/components/_classes/nested/NestedComponent.d.ts +1 -2
- package/lib/mjs/components/_classes/nested/NestedComponent.js +1 -4
- package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.d.ts +2 -0
- package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.js +51 -29
- package/lib/mjs/components/editgrid/fixtures/comp17.d.ts +80 -0
- package/lib/mjs/components/editgrid/fixtures/comp17.js +97 -0
- package/lib/mjs/components/editgrid/fixtures/index.d.ts +2 -1
- package/lib/mjs/components/editgrid/fixtures/index.js +2 -1
- package/package.json +1 -1
|
@@ -211,12 +211,11 @@ export default class NestedComponent extends Field {
|
|
|
211
211
|
calculateValue(data: any, flags: any, row: any): any;
|
|
212
212
|
isLastPage(): boolean;
|
|
213
213
|
isValid(data: any, dirty: any): any;
|
|
214
|
-
validationProcessor({ scope, data, row, instance
|
|
214
|
+
validationProcessor({ scope, data, row, instance }: {
|
|
215
215
|
scope: any;
|
|
216
216
|
data: any;
|
|
217
217
|
row: any;
|
|
218
218
|
instance: any;
|
|
219
|
-
component: any;
|
|
220
219
|
}, flags: any): void;
|
|
221
220
|
/**
|
|
222
221
|
* Perform a validation on all child components of this nested component.
|
|
@@ -681,11 +681,8 @@ class NestedComponent extends Field_1.default {
|
|
|
681
681
|
isValid(data, dirty) {
|
|
682
682
|
return this.getComponents().reduce((valid, comp) => comp.isValid(data, dirty) && valid, super.isValid(data, dirty));
|
|
683
683
|
}
|
|
684
|
-
validationProcessor({ scope, data, row, instance
|
|
684
|
+
validationProcessor({ scope, data, row, instance }, flags) {
|
|
685
685
|
const { dirty } = flags;
|
|
686
|
-
if (this.root.hasExtraPages && this.page !== this.root.page) {
|
|
687
|
-
instance = this.getComponentById(component.id);
|
|
688
|
-
}
|
|
689
686
|
if (!instance) {
|
|
690
687
|
return;
|
|
691
688
|
}
|
|
@@ -12,6 +12,8 @@ export default class NestedArrayComponent extends NestedDataComponent {
|
|
|
12
12
|
hasAddButton(): any;
|
|
13
13
|
getComponent(path: any, fn: any, originalPath: any): any;
|
|
14
14
|
everyComponent(fn: any, rowIndex: any, options?: {}): void;
|
|
15
|
+
_getEmailTableHeader(options: any): string;
|
|
16
|
+
_getEmailTableBody(options: any): string;
|
|
15
17
|
getComponents(rowIndex: any): any;
|
|
16
18
|
}
|
|
17
19
|
import NestedDataComponent from '../nesteddata/NestedDataComponent';
|
|
@@ -149,39 +149,60 @@ class NestedArrayComponent extends NestedDataComponent_1.default {
|
|
|
149
149
|
}
|
|
150
150
|
});
|
|
151
151
|
}
|
|
152
|
+
_getEmailTableHeader(options) {
|
|
153
|
+
let row = '';
|
|
154
|
+
const getHeaderCell = (component) => {
|
|
155
|
+
if (!component.isInputComponent || !component.visible || component.skipInEmail) {
|
|
156
|
+
return '';
|
|
157
|
+
}
|
|
158
|
+
const label = component.label || component.key;
|
|
159
|
+
return `<th style="padding: 5px 10px;">${label}</th>`;
|
|
160
|
+
};
|
|
161
|
+
const components = this.getComponents(0);
|
|
162
|
+
for (const component of components) {
|
|
163
|
+
if (component.isInputComponent) {
|
|
164
|
+
row += getHeaderCell(component);
|
|
165
|
+
}
|
|
166
|
+
else if ((0, utils_1.isLayoutComponent)(component) && typeof component.everyComponent === 'function') {
|
|
167
|
+
component.everyComponent((comp) => {
|
|
168
|
+
row += getHeaderCell(comp);
|
|
169
|
+
}, options);
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
return `<thead><tr>${row}</tr></thead>`;
|
|
173
|
+
}
|
|
174
|
+
_getEmailTableBody(options) {
|
|
175
|
+
const getBodyCell = (component) => {
|
|
176
|
+
if (!component.isInputComponent || !component.visible || component.skipInEmail) {
|
|
177
|
+
return '';
|
|
178
|
+
}
|
|
179
|
+
return `<td style="padding: 5px 10px;">${component.getView(component.dataValue, options)}</td>`;
|
|
180
|
+
};
|
|
181
|
+
const rows = [];
|
|
182
|
+
for (const { components } of this.iteratableRows) {
|
|
183
|
+
let row = '';
|
|
184
|
+
for (const component of components) {
|
|
185
|
+
if (component.isInputComponent) {
|
|
186
|
+
row += getBodyCell(component);
|
|
187
|
+
}
|
|
188
|
+
else if ((0, utils_1.isLayoutComponent)(component) && typeof component.everyComponent === 'function') {
|
|
189
|
+
component.everyComponent((comp) => {
|
|
190
|
+
row += getBodyCell(comp);
|
|
191
|
+
}, options);
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
rows.push(`<tr>${row}</tr>`);
|
|
195
|
+
}
|
|
196
|
+
return `<tbody>${rows.join('')}</tbody>`;
|
|
197
|
+
}
|
|
152
198
|
getValueAsString(value, options) {
|
|
153
|
-
var _a;
|
|
154
199
|
if (options === null || options === void 0 ? void 0 : options.email) {
|
|
155
|
-
|
|
200
|
+
return `
|
|
156
201
|
<table border="1" style="width:100%">
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
`);
|
|
160
|
-
(_a = this.component.components) === null || _a === void 0 ? void 0 : _a.forEach((component) => {
|
|
161
|
-
const label = component.label || component.key;
|
|
162
|
-
result += `<th style="padding: 5px 10px;">${label}</th>`;
|
|
163
|
-
});
|
|
164
|
-
result += (`
|
|
165
|
-
</tr>
|
|
166
|
-
</thead>
|
|
167
|
-
<tbody>
|
|
168
|
-
`);
|
|
169
|
-
this.iteratableRows.forEach(({ components }) => {
|
|
170
|
-
result += '<tr>';
|
|
171
|
-
lodash_1.default.each(components, (component) => {
|
|
172
|
-
result += '<td style="padding:5px 10px;">';
|
|
173
|
-
if (component.isInputComponent && component.visible && !component.skipInEmail) {
|
|
174
|
-
result += component.getView(component.dataValue, options);
|
|
175
|
-
}
|
|
176
|
-
result += '</td>';
|
|
177
|
-
});
|
|
178
|
-
result += '</tr>';
|
|
179
|
-
});
|
|
180
|
-
result += (`
|
|
181
|
-
</tbody>
|
|
202
|
+
${this._getEmailTableHeader(options)}
|
|
203
|
+
${this._getEmailTableBody(options)}
|
|
182
204
|
</table>
|
|
183
|
-
|
|
184
|
-
return result;
|
|
205
|
+
`;
|
|
185
206
|
}
|
|
186
207
|
if (!value || !value.length) {
|
|
187
208
|
return '';
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
declare namespace _default {
|
|
2
|
+
let type: string;
|
|
3
|
+
let display: string;
|
|
4
|
+
let components: ({
|
|
5
|
+
label: string;
|
|
6
|
+
tableView: boolean;
|
|
7
|
+
rowDrafts: boolean;
|
|
8
|
+
key: string;
|
|
9
|
+
type: string;
|
|
10
|
+
input: boolean;
|
|
11
|
+
components: {
|
|
12
|
+
collapsible: boolean;
|
|
13
|
+
key: string;
|
|
14
|
+
type: string;
|
|
15
|
+
label: string;
|
|
16
|
+
input: boolean;
|
|
17
|
+
tableView: boolean;
|
|
18
|
+
components: {
|
|
19
|
+
label: string;
|
|
20
|
+
columns: ({
|
|
21
|
+
components: {
|
|
22
|
+
label: string;
|
|
23
|
+
optionsLabelPosition: string;
|
|
24
|
+
inline: boolean;
|
|
25
|
+
tableView: boolean;
|
|
26
|
+
values: {
|
|
27
|
+
label: string;
|
|
28
|
+
value: string;
|
|
29
|
+
shortcut: string;
|
|
30
|
+
}[];
|
|
31
|
+
key: string;
|
|
32
|
+
type: string;
|
|
33
|
+
input: boolean;
|
|
34
|
+
}[];
|
|
35
|
+
width: number;
|
|
36
|
+
offset: number;
|
|
37
|
+
push: number;
|
|
38
|
+
pull: number;
|
|
39
|
+
size: string;
|
|
40
|
+
currentWidth: number;
|
|
41
|
+
} | {
|
|
42
|
+
components: {
|
|
43
|
+
label: string;
|
|
44
|
+
applyMaskOn: string;
|
|
45
|
+
autoExpand: boolean;
|
|
46
|
+
tableView: boolean;
|
|
47
|
+
key: string;
|
|
48
|
+
conditional: {
|
|
49
|
+
show: boolean;
|
|
50
|
+
conjunction: string;
|
|
51
|
+
};
|
|
52
|
+
type: string;
|
|
53
|
+
input: boolean;
|
|
54
|
+
}[];
|
|
55
|
+
width: number;
|
|
56
|
+
offset: number;
|
|
57
|
+
push: number;
|
|
58
|
+
pull: number;
|
|
59
|
+
size: string;
|
|
60
|
+
currentWidth: number;
|
|
61
|
+
})[];
|
|
62
|
+
key: string;
|
|
63
|
+
type: string;
|
|
64
|
+
input: boolean;
|
|
65
|
+
tableView: boolean;
|
|
66
|
+
}[];
|
|
67
|
+
}[];
|
|
68
|
+
disableOnInvalid?: undefined;
|
|
69
|
+
} | {
|
|
70
|
+
type: string;
|
|
71
|
+
label: string;
|
|
72
|
+
key: string;
|
|
73
|
+
disableOnInvalid: boolean;
|
|
74
|
+
input: boolean;
|
|
75
|
+
tableView: boolean;
|
|
76
|
+
rowDrafts?: undefined;
|
|
77
|
+
components?: undefined;
|
|
78
|
+
})[];
|
|
79
|
+
}
|
|
80
|
+
export default _default;
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.default = {
|
|
4
|
+
type: 'form',
|
|
5
|
+
display: 'form',
|
|
6
|
+
components: [
|
|
7
|
+
{
|
|
8
|
+
label: 'Edit Grid',
|
|
9
|
+
tableView: false,
|
|
10
|
+
rowDrafts: false,
|
|
11
|
+
key: 'editGrid',
|
|
12
|
+
type: 'editgrid',
|
|
13
|
+
input: true,
|
|
14
|
+
components: [
|
|
15
|
+
{
|
|
16
|
+
collapsible: false,
|
|
17
|
+
key: 'panel',
|
|
18
|
+
type: 'panel',
|
|
19
|
+
label: 'Panel',
|
|
20
|
+
input: false,
|
|
21
|
+
tableView: false,
|
|
22
|
+
components: [
|
|
23
|
+
{
|
|
24
|
+
label: 'Columns',
|
|
25
|
+
columns: [
|
|
26
|
+
{
|
|
27
|
+
components: [
|
|
28
|
+
{
|
|
29
|
+
label: 'Radio',
|
|
30
|
+
optionsLabelPosition: 'right',
|
|
31
|
+
inline: false,
|
|
32
|
+
tableView: true,
|
|
33
|
+
values: [
|
|
34
|
+
{
|
|
35
|
+
label: 'yes',
|
|
36
|
+
value: 'yes',
|
|
37
|
+
shortcut: ''
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
label: 'no',
|
|
41
|
+
value: 'no',
|
|
42
|
+
shortcut: ''
|
|
43
|
+
}
|
|
44
|
+
],
|
|
45
|
+
key: 'radio',
|
|
46
|
+
type: 'radio',
|
|
47
|
+
input: true
|
|
48
|
+
}
|
|
49
|
+
],
|
|
50
|
+
width: 6,
|
|
51
|
+
offset: 0,
|
|
52
|
+
push: 0,
|
|
53
|
+
pull: 0,
|
|
54
|
+
size: 'md',
|
|
55
|
+
currentWidth: 6
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
components: [
|
|
59
|
+
{
|
|
60
|
+
label: 'Text Area',
|
|
61
|
+
applyMaskOn: 'change',
|
|
62
|
+
autoExpand: false,
|
|
63
|
+
tableView: true,
|
|
64
|
+
key: 'textArea',
|
|
65
|
+
conditional: {
|
|
66
|
+
show: true,
|
|
67
|
+
conjunction: 'all'
|
|
68
|
+
},
|
|
69
|
+
type: 'textarea',
|
|
70
|
+
input: true
|
|
71
|
+
}
|
|
72
|
+
],
|
|
73
|
+
width: 6,
|
|
74
|
+
offset: 0,
|
|
75
|
+
push: 0,
|
|
76
|
+
pull: 0,
|
|
77
|
+
size: 'md',
|
|
78
|
+
currentWidth: 6
|
|
79
|
+
}
|
|
80
|
+
],
|
|
81
|
+
key: 'columns',
|
|
82
|
+
type: 'columns',
|
|
83
|
+
input: false,
|
|
84
|
+
tableView: false
|
|
85
|
+
}
|
|
86
|
+
]
|
|
87
|
+
}
|
|
88
|
+
]
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
type: 'button',
|
|
92
|
+
label: 'Submit',
|
|
93
|
+
key: 'submit',
|
|
94
|
+
disableOnInvalid: true,
|
|
95
|
+
input: true,
|
|
96
|
+
tableView: false
|
|
97
|
+
}
|
|
98
|
+
]
|
|
99
|
+
};
|
|
@@ -14,8 +14,9 @@ import comp7 from './comp7';
|
|
|
14
14
|
import comp8 from './comp8';
|
|
15
15
|
import comp9 from './comp9';
|
|
16
16
|
import comp16 from './comp16';
|
|
17
|
+
import comp17 from './comp17';
|
|
17
18
|
import compOpenWhenEmpty from './comp-openWhenEmpty';
|
|
18
19
|
import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenEmpty';
|
|
19
20
|
import compWithCustomDefaultValue from './comp-with-custom-default-value';
|
|
20
21
|
import compTestEvents from './comp-test-events';
|
|
21
|
-
export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
|
|
22
|
+
export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
|
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.compTestEvents = exports.compWithCustomDefaultValue = exports.withOpenWhenEmptyAndConditions = exports.compOpenWhenEmpty = exports.comp16 = exports.comp9 = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp15 = exports.comp14 = exports.comp13 = exports.comp12 = exports.comp11 = exports.comp10 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
|
|
6
|
+
exports.compTestEvents = exports.compWithCustomDefaultValue = exports.withOpenWhenEmptyAndConditions = exports.compOpenWhenEmpty = exports.comp17 = exports.comp16 = exports.comp9 = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp15 = exports.comp14 = exports.comp13 = exports.comp12 = exports.comp11 = exports.comp10 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
|
|
7
7
|
const comp1_1 = __importDefault(require("./comp1"));
|
|
8
8
|
exports.comp1 = comp1_1.default;
|
|
9
9
|
const comp2_1 = __importDefault(require("./comp2"));
|
|
@@ -36,6 +36,8 @@ const comp15_1 = __importDefault(require("./comp15"));
|
|
|
36
36
|
exports.comp15 = comp15_1.default;
|
|
37
37
|
const comp16_1 = __importDefault(require("./comp16"));
|
|
38
38
|
exports.comp16 = comp16_1.default;
|
|
39
|
+
const comp17_1 = __importDefault(require("./comp17"));
|
|
40
|
+
exports.comp17 = comp17_1.default;
|
|
39
41
|
const comp_with_conditions_and_openWhenEmpty_1 = __importDefault(require("./comp-with-conditions-and-openWhenEmpty"));
|
|
40
42
|
exports.withOpenWhenEmptyAndConditions = comp_with_conditions_and_openWhenEmpty_1.default;
|
|
41
43
|
const comp_openWhenEmpty_1 = __importDefault(require("./comp-openWhenEmpty"));
|
|
@@ -211,12 +211,11 @@ export default class NestedComponent extends Field {
|
|
|
211
211
|
calculateValue(data: any, flags: any, row: any): any;
|
|
212
212
|
isLastPage(): boolean;
|
|
213
213
|
isValid(data: any, dirty: any): any;
|
|
214
|
-
validationProcessor({ scope, data, row, instance
|
|
214
|
+
validationProcessor({ scope, data, row, instance }: {
|
|
215
215
|
scope: any;
|
|
216
216
|
data: any;
|
|
217
217
|
row: any;
|
|
218
218
|
instance: any;
|
|
219
|
-
component: any;
|
|
220
219
|
}, flags: any): void;
|
|
221
220
|
/**
|
|
222
221
|
* Perform a validation on all child components of this nested component.
|
|
@@ -677,11 +677,8 @@ export default class NestedComponent extends Field {
|
|
|
677
677
|
isValid(data, dirty) {
|
|
678
678
|
return this.getComponents().reduce((valid, comp) => comp.isValid(data, dirty) && valid, super.isValid(data, dirty));
|
|
679
679
|
}
|
|
680
|
-
validationProcessor({ scope, data, row, instance
|
|
680
|
+
validationProcessor({ scope, data, row, instance }, flags) {
|
|
681
681
|
const { dirty } = flags;
|
|
682
|
-
if (this.root.hasExtraPages && this.page !== this.root.page) {
|
|
683
|
-
instance = this.getComponentById(component.id);
|
|
684
|
-
}
|
|
685
682
|
if (!instance) {
|
|
686
683
|
return;
|
|
687
684
|
}
|
|
@@ -12,6 +12,8 @@ export default class NestedArrayComponent extends NestedDataComponent {
|
|
|
12
12
|
hasAddButton(): any;
|
|
13
13
|
getComponent(path: any, fn: any, originalPath: any): any;
|
|
14
14
|
everyComponent(fn: any, rowIndex: any, options?: {}): void;
|
|
15
|
+
_getEmailTableHeader(options: any): string;
|
|
16
|
+
_getEmailTableBody(options: any): string;
|
|
15
17
|
getComponents(rowIndex: any): any;
|
|
16
18
|
}
|
|
17
19
|
import NestedDataComponent from '../nesteddata/NestedDataComponent';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
import _ from 'lodash';
|
|
3
|
-
import { componentValueTypes, getStringFromComponentPath } from '../../../utils/utils';
|
|
3
|
+
import { componentValueTypes, getStringFromComponentPath, isLayoutComponent } from '../../../utils/utils';
|
|
4
4
|
import Component from '../component/Component';
|
|
5
5
|
import NestedDataComponent from '../nesteddata/NestedDataComponent';
|
|
6
6
|
export default class NestedArrayComponent extends NestedDataComponent {
|
|
@@ -145,38 +145,60 @@ export default class NestedArrayComponent extends NestedDataComponent {
|
|
|
145
145
|
}
|
|
146
146
|
});
|
|
147
147
|
}
|
|
148
|
+
_getEmailTableHeader(options) {
|
|
149
|
+
let row = '';
|
|
150
|
+
const getHeaderCell = (component) => {
|
|
151
|
+
if (!component.isInputComponent || !component.visible || component.skipInEmail) {
|
|
152
|
+
return '';
|
|
153
|
+
}
|
|
154
|
+
const label = component.label || component.key;
|
|
155
|
+
return `<th style="padding: 5px 10px;">${label}</th>`;
|
|
156
|
+
};
|
|
157
|
+
const components = this.getComponents(0);
|
|
158
|
+
for (const component of components) {
|
|
159
|
+
if (component.isInputComponent) {
|
|
160
|
+
row += getHeaderCell(component);
|
|
161
|
+
}
|
|
162
|
+
else if (isLayoutComponent(component) && typeof component.everyComponent === 'function') {
|
|
163
|
+
component.everyComponent((comp) => {
|
|
164
|
+
row += getHeaderCell(comp);
|
|
165
|
+
}, options);
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
return `<thead><tr>${row}</tr></thead>`;
|
|
169
|
+
}
|
|
170
|
+
_getEmailTableBody(options) {
|
|
171
|
+
const getBodyCell = (component) => {
|
|
172
|
+
if (!component.isInputComponent || !component.visible || component.skipInEmail) {
|
|
173
|
+
return '';
|
|
174
|
+
}
|
|
175
|
+
return `<td style="padding: 5px 10px;">${component.getView(component.dataValue, options)}</td>`;
|
|
176
|
+
};
|
|
177
|
+
const rows = [];
|
|
178
|
+
for (const { components } of this.iteratableRows) {
|
|
179
|
+
let row = '';
|
|
180
|
+
for (const component of components) {
|
|
181
|
+
if (component.isInputComponent) {
|
|
182
|
+
row += getBodyCell(component);
|
|
183
|
+
}
|
|
184
|
+
else if (isLayoutComponent(component) && typeof component.everyComponent === 'function') {
|
|
185
|
+
component.everyComponent((comp) => {
|
|
186
|
+
row += getBodyCell(comp);
|
|
187
|
+
}, options);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
rows.push(`<tr>${row}</tr>`);
|
|
191
|
+
}
|
|
192
|
+
return `<tbody>${rows.join('')}</tbody>`;
|
|
193
|
+
}
|
|
148
194
|
getValueAsString(value, options) {
|
|
149
195
|
if (options?.email) {
|
|
150
|
-
|
|
196
|
+
return `
|
|
151
197
|
<table border="1" style="width:100%">
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
`);
|
|
155
|
-
this.component.components?.forEach((component) => {
|
|
156
|
-
const label = component.label || component.key;
|
|
157
|
-
result += `<th style="padding: 5px 10px;">${label}</th>`;
|
|
158
|
-
});
|
|
159
|
-
result += (`
|
|
160
|
-
</tr>
|
|
161
|
-
</thead>
|
|
162
|
-
<tbody>
|
|
163
|
-
`);
|
|
164
|
-
this.iteratableRows.forEach(({ components }) => {
|
|
165
|
-
result += '<tr>';
|
|
166
|
-
_.each(components, (component) => {
|
|
167
|
-
result += '<td style="padding:5px 10px;">';
|
|
168
|
-
if (component.isInputComponent && component.visible && !component.skipInEmail) {
|
|
169
|
-
result += component.getView(component.dataValue, options);
|
|
170
|
-
}
|
|
171
|
-
result += '</td>';
|
|
172
|
-
});
|
|
173
|
-
result += '</tr>';
|
|
174
|
-
});
|
|
175
|
-
result += (`
|
|
176
|
-
</tbody>
|
|
198
|
+
${this._getEmailTableHeader(options)}
|
|
199
|
+
${this._getEmailTableBody(options)}
|
|
177
200
|
</table>
|
|
178
|
-
|
|
179
|
-
return result;
|
|
201
|
+
`;
|
|
180
202
|
}
|
|
181
203
|
if (!value || !value.length) {
|
|
182
204
|
return '';
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
declare namespace _default {
|
|
2
|
+
let type: string;
|
|
3
|
+
let display: string;
|
|
4
|
+
let components: ({
|
|
5
|
+
label: string;
|
|
6
|
+
tableView: boolean;
|
|
7
|
+
rowDrafts: boolean;
|
|
8
|
+
key: string;
|
|
9
|
+
type: string;
|
|
10
|
+
input: boolean;
|
|
11
|
+
components: {
|
|
12
|
+
collapsible: boolean;
|
|
13
|
+
key: string;
|
|
14
|
+
type: string;
|
|
15
|
+
label: string;
|
|
16
|
+
input: boolean;
|
|
17
|
+
tableView: boolean;
|
|
18
|
+
components: {
|
|
19
|
+
label: string;
|
|
20
|
+
columns: ({
|
|
21
|
+
components: {
|
|
22
|
+
label: string;
|
|
23
|
+
optionsLabelPosition: string;
|
|
24
|
+
inline: boolean;
|
|
25
|
+
tableView: boolean;
|
|
26
|
+
values: {
|
|
27
|
+
label: string;
|
|
28
|
+
value: string;
|
|
29
|
+
shortcut: string;
|
|
30
|
+
}[];
|
|
31
|
+
key: string;
|
|
32
|
+
type: string;
|
|
33
|
+
input: boolean;
|
|
34
|
+
}[];
|
|
35
|
+
width: number;
|
|
36
|
+
offset: number;
|
|
37
|
+
push: number;
|
|
38
|
+
pull: number;
|
|
39
|
+
size: string;
|
|
40
|
+
currentWidth: number;
|
|
41
|
+
} | {
|
|
42
|
+
components: {
|
|
43
|
+
label: string;
|
|
44
|
+
applyMaskOn: string;
|
|
45
|
+
autoExpand: boolean;
|
|
46
|
+
tableView: boolean;
|
|
47
|
+
key: string;
|
|
48
|
+
conditional: {
|
|
49
|
+
show: boolean;
|
|
50
|
+
conjunction: string;
|
|
51
|
+
};
|
|
52
|
+
type: string;
|
|
53
|
+
input: boolean;
|
|
54
|
+
}[];
|
|
55
|
+
width: number;
|
|
56
|
+
offset: number;
|
|
57
|
+
push: number;
|
|
58
|
+
pull: number;
|
|
59
|
+
size: string;
|
|
60
|
+
currentWidth: number;
|
|
61
|
+
})[];
|
|
62
|
+
key: string;
|
|
63
|
+
type: string;
|
|
64
|
+
input: boolean;
|
|
65
|
+
tableView: boolean;
|
|
66
|
+
}[];
|
|
67
|
+
}[];
|
|
68
|
+
disableOnInvalid?: undefined;
|
|
69
|
+
} | {
|
|
70
|
+
type: string;
|
|
71
|
+
label: string;
|
|
72
|
+
key: string;
|
|
73
|
+
disableOnInvalid: boolean;
|
|
74
|
+
input: boolean;
|
|
75
|
+
tableView: boolean;
|
|
76
|
+
rowDrafts?: undefined;
|
|
77
|
+
components?: undefined;
|
|
78
|
+
})[];
|
|
79
|
+
}
|
|
80
|
+
export default _default;
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
type: 'form',
|
|
3
|
+
display: 'form',
|
|
4
|
+
components: [
|
|
5
|
+
{
|
|
6
|
+
label: 'Edit Grid',
|
|
7
|
+
tableView: false,
|
|
8
|
+
rowDrafts: false,
|
|
9
|
+
key: 'editGrid',
|
|
10
|
+
type: 'editgrid',
|
|
11
|
+
input: true,
|
|
12
|
+
components: [
|
|
13
|
+
{
|
|
14
|
+
collapsible: false,
|
|
15
|
+
key: 'panel',
|
|
16
|
+
type: 'panel',
|
|
17
|
+
label: 'Panel',
|
|
18
|
+
input: false,
|
|
19
|
+
tableView: false,
|
|
20
|
+
components: [
|
|
21
|
+
{
|
|
22
|
+
label: 'Columns',
|
|
23
|
+
columns: [
|
|
24
|
+
{
|
|
25
|
+
components: [
|
|
26
|
+
{
|
|
27
|
+
label: 'Radio',
|
|
28
|
+
optionsLabelPosition: 'right',
|
|
29
|
+
inline: false,
|
|
30
|
+
tableView: true,
|
|
31
|
+
values: [
|
|
32
|
+
{
|
|
33
|
+
label: 'yes',
|
|
34
|
+
value: 'yes',
|
|
35
|
+
shortcut: ''
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
label: 'no',
|
|
39
|
+
value: 'no',
|
|
40
|
+
shortcut: ''
|
|
41
|
+
}
|
|
42
|
+
],
|
|
43
|
+
key: 'radio',
|
|
44
|
+
type: 'radio',
|
|
45
|
+
input: true
|
|
46
|
+
}
|
|
47
|
+
],
|
|
48
|
+
width: 6,
|
|
49
|
+
offset: 0,
|
|
50
|
+
push: 0,
|
|
51
|
+
pull: 0,
|
|
52
|
+
size: 'md',
|
|
53
|
+
currentWidth: 6
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
components: [
|
|
57
|
+
{
|
|
58
|
+
label: 'Text Area',
|
|
59
|
+
applyMaskOn: 'change',
|
|
60
|
+
autoExpand: false,
|
|
61
|
+
tableView: true,
|
|
62
|
+
key: 'textArea',
|
|
63
|
+
conditional: {
|
|
64
|
+
show: true,
|
|
65
|
+
conjunction: 'all'
|
|
66
|
+
},
|
|
67
|
+
type: 'textarea',
|
|
68
|
+
input: true
|
|
69
|
+
}
|
|
70
|
+
],
|
|
71
|
+
width: 6,
|
|
72
|
+
offset: 0,
|
|
73
|
+
push: 0,
|
|
74
|
+
pull: 0,
|
|
75
|
+
size: 'md',
|
|
76
|
+
currentWidth: 6
|
|
77
|
+
}
|
|
78
|
+
],
|
|
79
|
+
key: 'columns',
|
|
80
|
+
type: 'columns',
|
|
81
|
+
input: false,
|
|
82
|
+
tableView: false
|
|
83
|
+
}
|
|
84
|
+
]
|
|
85
|
+
}
|
|
86
|
+
]
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
type: 'button',
|
|
90
|
+
label: 'Submit',
|
|
91
|
+
key: 'submit',
|
|
92
|
+
disableOnInvalid: true,
|
|
93
|
+
input: true,
|
|
94
|
+
tableView: false
|
|
95
|
+
}
|
|
96
|
+
]
|
|
97
|
+
};
|
|
@@ -14,8 +14,9 @@ import comp7 from './comp7';
|
|
|
14
14
|
import comp8 from './comp8';
|
|
15
15
|
import comp9 from './comp9';
|
|
16
16
|
import comp16 from './comp16';
|
|
17
|
+
import comp17 from './comp17';
|
|
17
18
|
import compOpenWhenEmpty from './comp-openWhenEmpty';
|
|
18
19
|
import withOpenWhenEmptyAndConditions from './comp-with-conditions-and-openWhenEmpty';
|
|
19
20
|
import compWithCustomDefaultValue from './comp-with-custom-default-value';
|
|
20
21
|
import compTestEvents from './comp-test-events';
|
|
21
|
-
export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
|
|
22
|
+
export { comp1, comp2, comp3, comp10, comp11, comp12, comp13, comp14, comp15, comp4, comp5, comp6, comp7, comp8, comp9, comp16, comp17, compOpenWhenEmpty, withOpenWhenEmptyAndConditions, compWithCustomDefaultValue, compTestEvents };
|