@everymatrix/general-registration 1.10.1 → 1.10.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/checkbox-input_11.cjs.entry.js +28186 -770
- package/dist/cjs/general-registration.cjs.js +2 -2
- package/dist/cjs/{index-c04f4a2a.js → index-9a07d1e9.js} +5 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/components/general-registration/general-registration.js +299 -224
- package/dist/components/checkbox-input2.js +10 -5
- package/dist/components/date-input2.js +6493 -19
- package/dist/components/email-input2.js +7 -20
- package/dist/components/general-input2.js +11 -9
- package/dist/components/general-registration.js +299 -223
- package/dist/components/locale.utils.js +2 -1
- package/dist/components/number-input2.js +7 -20
- package/dist/components/password-input2.js +9 -1
- package/dist/components/radio-input2.js +3 -12
- package/dist/components/select-input2.js +16 -19
- package/dist/components/tel-input2.js +35 -21
- package/dist/components/text-input2.js +5 -4
- package/dist/components/vaadin-combo-box.js +4423 -0
- package/dist/components/virtual-keyboard-controller.js +16466 -0
- package/dist/esm/checkbox-input_11.entry.js +28193 -777
- package/dist/esm/general-registration.js +2 -2
- package/dist/esm/{index-79f297c1.js → index-0505440f.js} +5 -1
- package/dist/esm/loader.js +2 -2
- package/dist/general-registration/general-registration.esm.js +1 -1
- package/dist/general-registration/p-1a88a312.js +1 -0
- package/dist/general-registration/p-7c69629f.entry.js +3164 -0
- package/dist/types/Users/{user/workspace/everymatrix → adrian.pripon/Documents/Work/stencil}/widgets-stencil/packages/general-registration/.stencil/packages/general-input/src/utils/types.d.ts +8 -0
- package/dist/types/Users/adrian.pripon/Documents/Work/stencil/widgets-stencil/packages/general-registration/.stencil/packages/general-registration/stencil.config.d.ts +2 -0
- package/dist/types/components/general-registration/general-registration.d.ts +267 -11
- package/package.json +6 -4
- package/dist/general-registration/p-0e7175cd.js +0 -1
- package/dist/general-registration/p-cadaffbe.entry.js +0 -1
- package/dist/types/Users/user/workspace/everymatrix/widgets-stencil/packages/general-registration/.stencil/packages/general-registration/stencil.config.d.ts +0 -2
- /package/dist/types/Users/{user/workspace/everymatrix → adrian.pripon/Documents/Work/stencil}/widgets-stencil/packages/general-registration/.stencil/packages/general-input/src/utils/locale.utils.d.ts +0 -0
|
@@ -20,196 +20,192 @@ export class GeneralRegistration {
|
|
|
20
20
|
"autofill": false
|
|
21
21
|
},
|
|
22
22
|
{
|
|
23
|
-
"name": "
|
|
24
|
-
"displayName": "
|
|
23
|
+
"name": "lastName",
|
|
24
|
+
"displayName": "Last name",
|
|
25
25
|
"defaultValue": null,
|
|
26
26
|
"validate": {
|
|
27
27
|
"mandatory": true,
|
|
28
28
|
"minLength": 3,
|
|
29
29
|
"maxLength": 20
|
|
30
30
|
},
|
|
31
|
-
"autofill": false
|
|
32
31
|
},
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
// },
|
|
211
|
-
// "inputType" : "dropdown"
|
|
212
|
-
// }
|
|
32
|
+
{
|
|
33
|
+
"name": "telephone",
|
|
34
|
+
"displayName": "Telephone",
|
|
35
|
+
"action": "GET https://demo-api.stage.norway.everymatrix.com/v1/player/phonecodes",
|
|
36
|
+
"defaultValue": null,
|
|
37
|
+
"validate": {
|
|
38
|
+
"mandatory": true
|
|
39
|
+
},
|
|
40
|
+
"autofill": false,
|
|
41
|
+
"inputType": "tel"
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
"name": "dateOfBirth",
|
|
45
|
+
"displayName": "Date of Birth",
|
|
46
|
+
"defaultValue": null,
|
|
47
|
+
"validate": {
|
|
48
|
+
"min": "2022-05-01",
|
|
49
|
+
"max": "2022-05-29",
|
|
50
|
+
"mandatory": true,
|
|
51
|
+
},
|
|
52
|
+
"inputType": "datetime"
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
"name": "email",
|
|
56
|
+
"displayName": "Email",
|
|
57
|
+
"defaultValue": 'a@a.com',
|
|
58
|
+
"validate": {
|
|
59
|
+
"mandatory": true,
|
|
60
|
+
"custom": [
|
|
61
|
+
{
|
|
62
|
+
"rule": "regex",
|
|
63
|
+
"pattern": "^[a-zA-Z0-9._%+-]+@[a-zA-Z-9.-]+\\.[a-zA-Z]{2,3}$",
|
|
64
|
+
"errorMessage": "Please enter a valid email address"
|
|
65
|
+
}
|
|
66
|
+
]
|
|
67
|
+
},
|
|
68
|
+
"inputType": "email"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"name": "password",
|
|
72
|
+
"displayName": "Password",
|
|
73
|
+
"defaultValue": null,
|
|
74
|
+
"validate": {
|
|
75
|
+
"mandatory": true,
|
|
76
|
+
"minLength": 3,
|
|
77
|
+
"maxLength": 20,
|
|
78
|
+
"type": "password",
|
|
79
|
+
"custom": [
|
|
80
|
+
{
|
|
81
|
+
"rule": "regex",
|
|
82
|
+
"pattern": "(?=.*\\d+)(?=.*[A-Za-z]+).{8,20}",
|
|
83
|
+
"errorMessage": "Password must contain at least 1 letter and 1 digit, and its minimal length is 8."
|
|
84
|
+
}
|
|
85
|
+
]
|
|
86
|
+
},
|
|
87
|
+
"inputType": "password"
|
|
88
|
+
},
|
|
89
|
+
{
|
|
90
|
+
"name": "email",
|
|
91
|
+
"displayName": "Email",
|
|
92
|
+
"defaultValue": null,
|
|
93
|
+
"validate": {
|
|
94
|
+
"mandatory": true,
|
|
95
|
+
"type": "email",
|
|
96
|
+
"custom": [
|
|
97
|
+
{
|
|
98
|
+
"rule": "unique-email",
|
|
99
|
+
"errorMessage": "Please check your email"
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
"rule": "regex",
|
|
103
|
+
"pattern": "^[a-zA-Z0-9._%+-]+@[a-zA-Z-9.-]+\\.[a-zA-Z]{2,3}$",
|
|
104
|
+
"errorMessage": "Please enter a valid email address"
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
"rule": "duplicate-input",
|
|
108
|
+
"displayName": "pt al doilea input gen: Confirm Email",
|
|
109
|
+
"errorMessage": "Different Email! Pls."
|
|
110
|
+
}
|
|
111
|
+
]
|
|
112
|
+
}
|
|
113
|
+
},
|
|
114
|
+
{
|
|
115
|
+
"name": "termsAndConditions",
|
|
116
|
+
"displayName": "Terms and Conditions",
|
|
117
|
+
"validate": {
|
|
118
|
+
"mandatory": true,
|
|
119
|
+
"type": "boolean"
|
|
120
|
+
},
|
|
121
|
+
"inputType": "checkbox"
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
"name": "pepCheck",
|
|
125
|
+
"validate": {
|
|
126
|
+
"mandatory": true
|
|
127
|
+
},
|
|
128
|
+
"inputType": "checkbox"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"name": "gender",
|
|
132
|
+
"data": {
|
|
133
|
+
"values": [
|
|
134
|
+
{
|
|
135
|
+
"label": "🍆",
|
|
136
|
+
"value": "m"
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
"label": "🍑",
|
|
140
|
+
"value": "f"
|
|
141
|
+
}
|
|
142
|
+
]
|
|
143
|
+
},
|
|
144
|
+
"validate": {
|
|
145
|
+
"mandatory": true
|
|
146
|
+
},
|
|
147
|
+
"inputType": "radio"
|
|
148
|
+
},
|
|
149
|
+
{
|
|
150
|
+
"name": "dateOfBirth",
|
|
151
|
+
"validate": {
|
|
152
|
+
"mandatory": true,
|
|
153
|
+
"custom": [
|
|
154
|
+
{
|
|
155
|
+
"rule": "regex",
|
|
156
|
+
"pattern": "(?:19\\d{2}|20[01][0-9]|2020)[-/.](?:0[1-9]|1[012])[-/.](?:0[1-9]|[12][0-9]|3[01])",
|
|
157
|
+
"errorMessage": "Invalid date format"
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
"rule": "min-18-years",
|
|
161
|
+
"errorMessage": "Not old enough to ride the roller coaster"
|
|
162
|
+
}
|
|
163
|
+
]
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"name": "city",
|
|
168
|
+
"displayName": "Cities",
|
|
169
|
+
"action": null,
|
|
170
|
+
"data": {
|
|
171
|
+
"values": [
|
|
172
|
+
{
|
|
173
|
+
"label": "Budapest",
|
|
174
|
+
"value": "Budapest"
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
"label": "Debrecen",
|
|
178
|
+
"value": "Debrecen"
|
|
179
|
+
},
|
|
180
|
+
{
|
|
181
|
+
"label": "Miskolc",
|
|
182
|
+
"value": "Miskolc"
|
|
183
|
+
},
|
|
184
|
+
{
|
|
185
|
+
"label": "Szeged",
|
|
186
|
+
"value": "Szeged"
|
|
187
|
+
},
|
|
188
|
+
{
|
|
189
|
+
"label": "Zuglo",
|
|
190
|
+
"value": "Zuglo"
|
|
191
|
+
}
|
|
192
|
+
]
|
|
193
|
+
},
|
|
194
|
+
"validate": {
|
|
195
|
+
"mandatory": true
|
|
196
|
+
},
|
|
197
|
+
"inputType": "dropdown"
|
|
198
|
+
},
|
|
199
|
+
{
|
|
200
|
+
"name": "city",
|
|
201
|
+
"displayName": "Cities",
|
|
202
|
+
"data": null,
|
|
203
|
+
"action": "GET https://demo-api.stage.norway.everymatrix.com/v1/player/countries",
|
|
204
|
+
"validate": {
|
|
205
|
+
"mandatory": true
|
|
206
|
+
},
|
|
207
|
+
"inputType": "dropdown"
|
|
208
|
+
}
|
|
213
209
|
],
|
|
214
210
|
"actions": [
|
|
215
211
|
"get-next-step",
|
|
@@ -224,57 +220,102 @@ export class GeneralRegistration {
|
|
|
224
220
|
this.language = 'en';
|
|
225
221
|
this.emitValue = false;
|
|
226
222
|
this.listOfInputs = [];
|
|
227
|
-
this.isLoading =
|
|
223
|
+
this.isLoading = true;
|
|
228
224
|
this.listOfInputValues = [];
|
|
229
225
|
this.listOfActions = [];
|
|
230
|
-
this.
|
|
226
|
+
this.steps = [];
|
|
227
|
+
this.registrationStepsState = {
|
|
228
|
+
regId: null
|
|
229
|
+
};
|
|
231
230
|
}
|
|
232
|
-
|
|
233
|
-
console.log(
|
|
234
|
-
this.buttonReference.disabled = this.isFormValid ? false : true;
|
|
231
|
+
logger() {
|
|
232
|
+
console.log(this.registrationStep);
|
|
235
233
|
}
|
|
236
234
|
checkInputsValidityHandler(event) {
|
|
237
|
-
console.log('se ajunge aici');
|
|
238
235
|
// Set isValid state of the input in the list.
|
|
239
236
|
this.listOfInputs.find(input => input.name == event.detail.name).isValid = event.detail.valid;
|
|
240
237
|
// Check if any one is invalid.
|
|
241
238
|
this.isFormValid = !this.getInvalidStatus(this.listOfInputs);
|
|
242
239
|
}
|
|
243
240
|
getInputsValueHandler(event) {
|
|
244
|
-
|
|
245
|
-
this.listOfInputValues.find(input => input.name == event.detail.name).inputValue = event.detail.value;
|
|
241
|
+
this.listOfInputValues.find(input => input.name == event.detail.name).value = event.detail.value;
|
|
246
242
|
/*Note to self: -- what about the inputs that received a default value.
|
|
247
243
|
They will send an undefined because there was no input
|
|
248
244
|
Handle it somehow!!!!!, one idea can be that value equals defaultValue but dependes on how the api wants stuff*/
|
|
249
|
-
|
|
250
|
-
connectedCallback() {
|
|
245
|
+
this.stepsStateMachine({ event: 'set', type: 'values' });
|
|
251
246
|
}
|
|
252
247
|
componentWillLoad() {
|
|
253
248
|
// const mockCall = Promise.resolve(this.data);
|
|
254
249
|
// return mockCall.then((data) => {
|
|
255
250
|
// this.listOfInputs = data.content.fields.map((field) => {
|
|
251
|
+
// this.isLoading = false;
|
|
256
252
|
// return { ...field, isValid: false };
|
|
257
253
|
// });
|
|
258
254
|
// });
|
|
259
|
-
// Initial Fetch
|
|
260
255
|
return this.getRegisterConfig().then((config) => {
|
|
261
256
|
this.formatConfig(config);
|
|
257
|
+
this.stepsStateMachine({ event: 'set', type: 'inputs' });
|
|
262
258
|
});
|
|
263
259
|
}
|
|
264
260
|
nextHandler(e) {
|
|
265
261
|
e.preventDefault();
|
|
266
262
|
// Trigger events in subwidgets.
|
|
267
263
|
this.emitValue = true;
|
|
268
|
-
|
|
269
|
-
|
|
264
|
+
this.setRegisterStep();
|
|
265
|
+
}
|
|
266
|
+
backHandler(e) {
|
|
267
|
+
e.preventDefault();
|
|
268
|
+
this.steps.pop();
|
|
269
|
+
this.registrationStep = this.steps.at(-1);
|
|
270
|
+
this.stepsStateMachine({ event: 'get', type: 'inputs' });
|
|
271
|
+
this.stepsStateMachine({ event: 'get', type: 'values' });
|
|
272
|
+
}
|
|
273
|
+
stepsStateMachine(state) {
|
|
274
|
+
switch (state.event) {
|
|
275
|
+
case 'set':
|
|
276
|
+
if (state.type == 'inputs') {
|
|
277
|
+
this.registrationStepsState[this.registrationStep].fields = this.listOfInputs;
|
|
278
|
+
}
|
|
279
|
+
if (state.type == 'values') {
|
|
280
|
+
this.registrationStepsState[this.registrationStep].registerUserData = this.listOfInputValues.reduce((acc, curr) => {
|
|
281
|
+
// @TODO remove this once GMCore is smart enough to understand the concept of UNIQUE KEYS
|
|
282
|
+
if (curr.value != null) {
|
|
283
|
+
acc[curr.name] = curr.value;
|
|
284
|
+
}
|
|
285
|
+
return acc;
|
|
286
|
+
}, {});
|
|
287
|
+
}
|
|
288
|
+
localStorage.setItem('registrationStepsState', JSON.stringify(this.registrationStepsState));
|
|
289
|
+
break;
|
|
290
|
+
case 'get':
|
|
291
|
+
const savedUserData = JSON.parse(localStorage.getItem('registrationStepsState'));
|
|
292
|
+
if (!savedUserData)
|
|
293
|
+
return;
|
|
294
|
+
if (state.type == 'inputs') {
|
|
295
|
+
this.listOfInputs = this.registrationStepsState[this.registrationStep].fields;
|
|
296
|
+
}
|
|
297
|
+
if (state.type == 'values') {
|
|
298
|
+
const savedValues = savedUserData[this.registrationStep].registerUserData;
|
|
299
|
+
this.listOfInputValues = Object.keys(savedValues).map(name => {
|
|
300
|
+
return { name, value: savedValues[name] };
|
|
301
|
+
});
|
|
302
|
+
// Give to each field the user input as the default value.
|
|
303
|
+
this.listOfInputValues.forEach(inputValue => {
|
|
304
|
+
const input = this.listOfInputs.find(input => input.name === inputValue.name);
|
|
305
|
+
if (input) {
|
|
306
|
+
input.defaultValue = inputValue.value;
|
|
307
|
+
}
|
|
308
|
+
});
|
|
309
|
+
}
|
|
310
|
+
break;
|
|
270
311
|
}
|
|
271
312
|
}
|
|
272
313
|
getRegisterConfig(registrationID) {
|
|
273
|
-
const url = new URL(`${this.endpoint}/
|
|
314
|
+
const url = new URL(`${this.endpoint}/v1/player/legislation/registration/config`);
|
|
274
315
|
const headers = new Headers();
|
|
275
|
-
headers.append('X-Tenant-ID', this.tenantId);
|
|
276
|
-
headers.append('X-Client-ID', this.clientId);
|
|
277
|
-
headers.append('X-Api-Key', this.apiKey);
|
|
316
|
+
// headers.append('X-Tenant-ID', this.tenantId);
|
|
317
|
+
// headers.append('X-Client-ID', this.clientId);
|
|
318
|
+
// headers.append('X-Api-Key', this.apiKey);
|
|
278
319
|
headers.append('Content-Type', 'application/json');
|
|
279
320
|
headers.append('Accept', 'application/json');
|
|
280
321
|
if (registrationID) {
|
|
@@ -299,20 +340,24 @@ export class GeneralRegistration {
|
|
|
299
340
|
});
|
|
300
341
|
}
|
|
301
342
|
setRegisterStep() {
|
|
302
|
-
this.
|
|
303
|
-
const url = new URL(`${this.endpoint}/
|
|
343
|
+
this.isLoading = true;
|
|
344
|
+
const url = new URL(`${this.endpoint}/v1/player/legislation/registration/step`);
|
|
304
345
|
const registerStep = {
|
|
305
346
|
registrationId: this.registrationID,
|
|
306
347
|
registerUserDto: this.listOfInputValues.reduce((acc, curr) => {
|
|
307
|
-
|
|
348
|
+
// @TODO remove this once GMCore is smart enough to understand the concept of UNIQUE KEYS
|
|
349
|
+
if (curr.value != null) {
|
|
350
|
+
acc[curr.name] = curr.value;
|
|
351
|
+
}
|
|
308
352
|
return acc;
|
|
309
353
|
}, {}),
|
|
310
354
|
step: this.registrationStep,
|
|
311
355
|
};
|
|
356
|
+
console.log(registerStep);
|
|
312
357
|
const headers = new Headers();
|
|
313
|
-
headers.append('X-Tenant-ID', this.tenantId);
|
|
314
|
-
headers.append('X-Client-ID', this.clientId);
|
|
315
|
-
headers.append('X-Api-Key', this.apiKey);
|
|
358
|
+
// headers.append('X-Tenant-ID', this.tenantId);
|
|
359
|
+
// headers.append('X-Client-ID', this.clientId);
|
|
360
|
+
// headers.append('X-Api-Key', this.apiKey);
|
|
316
361
|
headers.append('Content-Type', 'application/json');
|
|
317
362
|
headers.append('Accept', 'application/json');
|
|
318
363
|
const options = {
|
|
@@ -320,11 +365,13 @@ export class GeneralRegistration {
|
|
|
320
365
|
body: JSON.stringify(registerStep),
|
|
321
366
|
headers
|
|
322
367
|
};
|
|
368
|
+
console.log(options.body);
|
|
323
369
|
fetch(url.href, options)
|
|
324
370
|
.then((res) => {
|
|
325
371
|
if (res.status >= 300) {
|
|
326
372
|
throw new Error('err');
|
|
327
373
|
}
|
|
374
|
+
return res.json();
|
|
328
375
|
})
|
|
329
376
|
.then((data) => {
|
|
330
377
|
this.registrationID = data.registrationId;
|
|
@@ -332,25 +379,34 @@ export class GeneralRegistration {
|
|
|
332
379
|
this.setRegister();
|
|
333
380
|
}
|
|
334
381
|
else {
|
|
335
|
-
this.getRegisterConfig(this.registrationID).then((config) =>
|
|
382
|
+
this.getRegisterConfig(this.registrationID).then((config) => {
|
|
383
|
+
// Format the new step config.
|
|
384
|
+
this.formatConfig(config);
|
|
385
|
+
// Set it in local storage
|
|
386
|
+
this.stepsStateMachine({ event: 'set', type: 'inputs' });
|
|
387
|
+
});
|
|
336
388
|
}
|
|
337
389
|
})
|
|
338
390
|
.catch((err) => {
|
|
339
391
|
console.error(err);
|
|
392
|
+
})
|
|
393
|
+
.finally(() => {
|
|
394
|
+
this.isLoading = false;
|
|
340
395
|
});
|
|
341
396
|
}
|
|
342
397
|
setRegister() {
|
|
343
|
-
|
|
398
|
+
this.isLoading = true;
|
|
399
|
+
const url = new URL(`${this.endpoint}/v1/player/legislation/register`);
|
|
344
400
|
const headers = new Headers();
|
|
345
|
-
headers.append('X-Tenant-ID', this.tenantId);
|
|
346
|
-
headers.append('X-Client-ID', this.clientId);
|
|
347
|
-
headers.append('X-Api-Key', this.apiKey);
|
|
401
|
+
// headers.append('X-Tenant-ID', this.tenantId);
|
|
402
|
+
// headers.append('X-Client-ID', this.clientId);
|
|
403
|
+
// headers.append('X-Api-Key', this.apiKey);
|
|
348
404
|
headers.append('Content-Type', 'application/json');
|
|
349
405
|
headers.append('Accept', 'application/json');
|
|
350
406
|
const registerStep = {
|
|
351
407
|
registrationId: this.registrationID,
|
|
352
408
|
registerUserDto: this.listOfInputValues.reduce((acc, curr) => {
|
|
353
|
-
acc[curr.name] = curr.
|
|
409
|
+
acc[curr.name] = curr.value;
|
|
354
410
|
return acc;
|
|
355
411
|
}, {}),
|
|
356
412
|
step: this.registrationStep,
|
|
@@ -365,12 +421,18 @@ export class GeneralRegistration {
|
|
|
365
421
|
if (res.status >= 300) {
|
|
366
422
|
throw new Error('err');
|
|
367
423
|
}
|
|
424
|
+
return res.json();
|
|
368
425
|
})
|
|
369
426
|
.then((data) => {
|
|
370
|
-
|
|
427
|
+
if (data.userId) {
|
|
428
|
+
alert(`User registered - the user ID is ${data.userId}`);
|
|
429
|
+
}
|
|
371
430
|
})
|
|
372
431
|
.catch((err) => {
|
|
373
|
-
console.
|
|
432
|
+
console.error(err);
|
|
433
|
+
})
|
|
434
|
+
.finally(() => {
|
|
435
|
+
this.isLoading = false;
|
|
374
436
|
});
|
|
375
437
|
}
|
|
376
438
|
formatConfig(config) {
|
|
@@ -380,29 +442,40 @@ export class GeneralRegistration {
|
|
|
380
442
|
});
|
|
381
443
|
// Populate the list of inputs values and set as null in the beginning
|
|
382
444
|
this.listOfInputValues = config.content.fields.map(field => {
|
|
383
|
-
return { name: field.name,
|
|
445
|
+
return { name: field.name, value: null };
|
|
384
446
|
});
|
|
385
447
|
// Set the list of actions
|
|
386
448
|
this.listOfActions = config.content.actions.map(action => action);
|
|
449
|
+
this.isLastStep = this.listOfActions.some(action => action == '/register');
|
|
387
450
|
this.registrationID = config.content.registrationID;
|
|
388
451
|
this.registrationStep = config.content.step;
|
|
452
|
+
this.steps.push(this.registrationStep);
|
|
453
|
+
// Add the step to the registrationStepsData
|
|
454
|
+
this.registrationStepsState.regId = this.registrationID;
|
|
455
|
+
if (!this.registrationStepsState[this.registrationStep]) {
|
|
456
|
+
this.registrationStepsState[this.registrationStep] = {
|
|
457
|
+
fields: [],
|
|
458
|
+
registerUserData: {}
|
|
459
|
+
};
|
|
460
|
+
}
|
|
389
461
|
}
|
|
390
462
|
getInvalidStatus(listOfInputs) {
|
|
391
463
|
return listOfInputs.filter(input => input.isValid == false).length > 0;
|
|
392
464
|
}
|
|
393
465
|
renderInputs() {
|
|
394
|
-
|
|
395
|
-
this.listOfInputs
|
|
396
|
-
this.listOfInputs = aux;*/
|
|
397
|
-
return (this.listOfInputs.map(input => h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data ? input.data.values : [], defaultValue: input.defaultValue, emitValue: this.emitValue, language: this.language })));
|
|
466
|
+
console.log(this.listOfInputs);
|
|
467
|
+
return (this.listOfInputs.map(input => h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data ? input.data.values : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language })));
|
|
398
468
|
}
|
|
399
469
|
;
|
|
400
470
|
renderButtons() {
|
|
401
471
|
return (h("div", { class: 'registration__buttons-wrapper' },
|
|
402
|
-
h("button", { class: 'registration__button'
|
|
403
|
-
h("button", { class: 'registration__button' }, translate('backButton', this.language))));
|
|
472
|
+
h("button", { class: `registration__button ${this.isLastStep ? 'registration__button--done' : ''}`, type: 'submit', form: 'RegistrationForm', onClick: (e) => this.nextHandler(e) }, this.isLastStep ? translate('doneButton', this.language) : translate('nextButton', this.language)),
|
|
473
|
+
this.registrationStep !== 'Step1' && h("button", { class: 'registration__button', onClick: (e) => this.backHandler(e) }, translate('backButton', this.language))));
|
|
404
474
|
}
|
|
405
475
|
render() {
|
|
476
|
+
if (this.isLoading) {
|
|
477
|
+
return h("p", null, "Please wait, loading ...");
|
|
478
|
+
}
|
|
406
479
|
return (h("div", { class: 'registration' },
|
|
407
480
|
h("form", { action: '.', id: 'RegistrationForm', class: 'registration__form' }, this.renderInputs()),
|
|
408
481
|
this.renderButtons()));
|
|
@@ -507,11 +580,13 @@ export class GeneralRegistration {
|
|
|
507
580
|
"errorMessage": {},
|
|
508
581
|
"emitValue": {},
|
|
509
582
|
"isFormValid": {},
|
|
510
|
-
"listOfInputs": {}
|
|
583
|
+
"listOfInputs": {},
|
|
584
|
+
"isLoading": {},
|
|
585
|
+
"registrationStep": {}
|
|
511
586
|
}; }
|
|
512
587
|
static get watchers() { return [{
|
|
513
|
-
"propName": "
|
|
514
|
-
"methodName": "
|
|
588
|
+
"propName": "registrationStep",
|
|
589
|
+
"methodName": "logger"
|
|
515
590
|
}]; }
|
|
516
591
|
static get listeners() { return [{
|
|
517
592
|
"name": "sendValidityState",
|