@progressive-development/pd-order 0.6.7 → 0.6.9
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/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/pd-order-contacts.d.ts +3 -4
- package/dist/pd-order-contacts.d.ts.map +1 -1
- package/dist/pd-order-contacts.js +156 -133
- package/dist/pd-order-summary.d.ts +10 -7
- package/dist/pd-order-summary.d.ts.map +1 -1
- package/dist/pd-order-summary.js +65 -49
- package/dist/stories/pd-order-contacts.stories.d.ts.map +1 -1
- package/dist/stories/pd-order-summary.stories.d.ts +4 -4
- package/dist/stories/pd-order-summary.stories.d.ts.map +1 -1
- package/dist/stories/test-impl/test-summary.d.ts +8 -0
- package/dist/stories/test-impl/test-summary.d.ts.map +1 -0
- package/dist/types.d.ts +5 -16
- package/dist/types.d.ts.map +1 -1
- package/package.json +5 -5
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { PdOrderContacts } from './pd-order-contacts.js';
|
|
2
2
|
export { PdOrderSummary } from './pd-order-summary.js';
|
|
3
|
+
export type { PdOrderContactData, PdOrderStep } from './types.js';
|
|
3
4
|
export { templates as beTemplates } from './generated/locales/be.js';
|
|
4
5
|
export { templates as deTemplates } from './generated/locales/de.js';
|
|
5
6
|
export { templates as enTemplates } from './generated/locales/en.js';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAElE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { LitElement, CSSResultGroup } from 'lit';
|
|
1
|
+
import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
|
|
2
2
|
import { PdContactData, PdContactMatch } from '@progressive-development/pd-contact';
|
|
3
3
|
/**
|
|
4
4
|
* Renders and manages contact input sections for order processing.
|
|
@@ -26,7 +26,6 @@ export declare class PdOrderContacts extends LitElement {
|
|
|
26
26
|
withPayment: boolean;
|
|
27
27
|
/** Aktiviert die Option zur Verwaltung von Vermieterinformationen */
|
|
28
28
|
withPropertyOwner: boolean;
|
|
29
|
-
/** Aktiviert die Option zur Eingabe eines Wunschdatums für den Immobilientermin */
|
|
30
29
|
withPropertyDate: boolean;
|
|
31
30
|
/** Optionaler Match-Parameter zur Feldvalidierung oder Mapping-Zwecken */
|
|
32
31
|
match?: PdContactMatch;
|
|
@@ -34,13 +33,13 @@ export declare class PdOrderContacts extends LitElement {
|
|
|
34
33
|
private _ownAdminContact;
|
|
35
34
|
private _isPropertyOwner;
|
|
36
35
|
static styles: CSSResultGroup;
|
|
37
|
-
|
|
38
|
-
protected updated(changed: Map<string | number | symbol, unknown>): void;
|
|
36
|
+
update(changedProps: PropertyValues<this>): void;
|
|
39
37
|
protected render(): import('lit-html').TemplateResult<1>;
|
|
40
38
|
private _renderEditContacts;
|
|
41
39
|
private _renderSummary;
|
|
42
40
|
get valid(): boolean;
|
|
43
41
|
triggerValidate(): Promise<boolean>;
|
|
42
|
+
getValues(): any;
|
|
44
43
|
private _getCollapseMap;
|
|
45
44
|
}
|
|
46
45
|
//# sourceMappingURL=pd-order-contacts.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pd-order-contacts.d.ts","sourceRoot":"","sources":["../src/pd-order-contacts.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"pd-order-contacts.d.ts","sourceRoot":"","sources":["../src/pd-order-contacts.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAIV,cAAc,EACd,cAAc,EACf,MAAM,KAAK,CAAC;AAIb,OAAO,uDAAuD,CAAC;AAC/D,OAAO,iDAAiD,CAAC;AACzD,OAAO,gDAAgD,CAAC;AACxD,OAAO,+CAA+C,CAAC;AAKvD,OAAO,EAEL,aAAa,EACb,cAAc,EACf,MAAM,qCAAqC,CAAC;AAE7C;;;;;;GAMG;AACH,qBAEa,eAAgB,SAAQ,UAAU;IAC7C,gEAAgE;IAEhE,OAAO,UAAS;IAEhB,uDAAuD;IAEvD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAE1C,6EAA6E;IAE7E,cAAc,EAAE,MAAM,EAAE,CAAM;IAE9B,uCAAuC;IAEvC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,0CAA0C;IAE1C,cAAc,CAAC,EAAE,aAAa,CAAC;IAE/B,mCAAmC;IAEnC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,8CAA8C;IAE9C,eAAe,CAAC,EAAE,aAAa,CAAC;IAEhC,0DAA0D;IAE1D,WAAW,UAAS;IAEpB,qEAAqE;IAErE,iBAAiB,UAAS;IAG1B,gBAAgB,UAAS;IAEzB,0EAA0E;IAE1E,KAAK,CAAC,EAAE,cAAc,CAAC;IAGvB,OAAO,CAAC,kBAAkB,CAAS;IAGnC,OAAO,CAAC,gBAAgB,CAAS;IAGjC,OAAO,CAAC,gBAAgB,CAAS;IAEjC,OAAgB,MAAM,EAAE,cAAc,CAgDpC;IAEO,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAazD,SAAS,CAAC,MAAM;IAIhB,OAAO,CAAC,mBAAmB;IA4J3B,OAAO,CAAC,cAAc;IA+CtB,IAAI,KAAK,IAAI,OAAO,CASnB;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IAkCzC,SAAS;IAWhB,OAAO,CAAC,eAAe;CAoBxB"}
|
|
@@ -29,162 +29,158 @@ let PdOrderContacts = class extends LitElement {
|
|
|
29
29
|
this._ownAdminContact = false;
|
|
30
30
|
this._isPropertyOwner = false;
|
|
31
31
|
}
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
this.addEventListener("toggle-accordion", (e) => {
|
|
35
|
-
var _a;
|
|
36
|
-
const origin = e.composedPath()[0];
|
|
37
|
-
(_a = this.shadowRoot) == null ? void 0 : _a.querySelectorAll("pd-collapse").forEach((el) => {
|
|
38
|
-
if (el !== origin) el.close();
|
|
39
|
-
});
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
updated(changed) {
|
|
43
|
-
if (changed.has("billingContact")) {
|
|
32
|
+
update(changedProps) {
|
|
33
|
+
if (changedProps.has("billingContact")) {
|
|
44
34
|
this._ownBillingContact = !!this.billingContact;
|
|
45
35
|
}
|
|
46
|
-
if (
|
|
36
|
+
if (changedProps.has("adminContact")) {
|
|
47
37
|
this._ownAdminContact = !!this.adminContact;
|
|
48
38
|
}
|
|
49
|
-
if (
|
|
39
|
+
if (changedProps.has("propertyContact")) {
|
|
50
40
|
this._isPropertyOwner = !!this.propertyContact;
|
|
51
41
|
}
|
|
42
|
+
super.update(changedProps);
|
|
52
43
|
}
|
|
53
44
|
render() {
|
|
54
45
|
return this.summary ? this._renderSummary() : this._renderEditContacts();
|
|
55
46
|
}
|
|
56
47
|
_renderEditContacts() {
|
|
57
48
|
return html`
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
49
|
+
<pd-collapse-group>
|
|
50
|
+
<pd-collapse id="orderContactCollapseId">
|
|
51
|
+
<div slot="header">
|
|
52
|
+
${this.contactTitle.orderInputContact ?? msg("Adresse", {
|
|
53
|
+
id: "pd.order.contacts.orderContact.inputHeader"
|
|
54
|
+
})}
|
|
55
|
+
</div>
|
|
56
|
+
<pd-contact
|
|
57
|
+
id="orderContactId"
|
|
58
|
+
class="collapse-contact"
|
|
59
|
+
slot="content"
|
|
60
|
+
.requiredFields=${this.requiredFields}
|
|
61
|
+
.contact=${this.orderContact}
|
|
62
|
+
.match=${this.match}
|
|
63
|
+
?withPropertyDate=${!this._isPropertyOwner && this.withPropertyDate}
|
|
64
|
+
></pd-contact>
|
|
65
|
+
</pd-collapse>
|
|
74
66
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
67
|
+
${this.withPayment ? html`
|
|
68
|
+
<pd-collapse id="billingContactCollapseId">
|
|
69
|
+
<div slot="header">
|
|
70
|
+
${this.contactTitle.billingInputContact ?? msg("Rechnungsadresse (optional)", {
|
|
79
71
|
id: "pd.order.contacts.billingContact.inputHeader"
|
|
80
72
|
})}
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
73
|
+
</div>
|
|
74
|
+
<div slot="content">
|
|
75
|
+
${this._ownBillingContact ? html`
|
|
76
|
+
<p>
|
|
77
|
+
<a @click=${() => this._ownBillingContact = false}
|
|
78
|
+
>${msg(
|
|
87
79
|
"Kundenadresse als Rechnungsadresse verwenden"
|
|
88
80
|
)}</a
|
|
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
|
-
|
|
81
|
+
>
|
|
82
|
+
</p>
|
|
83
|
+
<pd-contact
|
|
84
|
+
id="billingContactId"
|
|
85
|
+
class="collapse-contact"
|
|
86
|
+
.requiredFields=${this.requiredFields}
|
|
87
|
+
.contact=${this.billingContact}
|
|
88
|
+
></pd-contact>
|
|
89
|
+
` : html`
|
|
90
|
+
<p>
|
|
91
|
+
${msg(
|
|
92
|
+
"Rechnungsadresse entspricht der Kundenadresse."
|
|
93
|
+
)}
|
|
94
|
+
</p>
|
|
95
|
+
<p>
|
|
96
|
+
<a @click=${() => this._ownBillingContact = true}
|
|
97
|
+
>${msg("Neue Rechnungsadresse hinzufügen")}</a
|
|
98
|
+
>
|
|
99
|
+
</p>
|
|
100
|
+
`}
|
|
101
|
+
</div>
|
|
102
|
+
</pd-collapse>
|
|
103
|
+
` : nothing}
|
|
104
|
+
${this.withPropertyOwner ? html`
|
|
105
|
+
<div class="property-owner-box">
|
|
106
|
+
<pd-checkbox
|
|
107
|
+
id="isPropertyOwnerId"
|
|
108
|
+
initValue=${this._isPropertyOwner}
|
|
109
|
+
@pd-form-element-change="${(e) => {
|
|
110
|
+
this._isPropertyOwner = e.detail.value === "true";
|
|
111
|
+
}}"
|
|
112
|
+
>
|
|
113
|
+
${msg("Ist der Kunde Vermieter?", {
|
|
118
114
|
id: "pd.order.contacts.propertyContact.checkBox"
|
|
119
115
|
})}
|
|
120
|
-
|
|
116
|
+
</pd-checkbox>
|
|
121
117
|
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
118
|
+
${this._isPropertyOwner ? html`
|
|
119
|
+
<pd-collapse
|
|
120
|
+
id="propertyContactCollapseId"
|
|
121
|
+
style="padding-top: 20px;"
|
|
122
|
+
>
|
|
123
|
+
<div slot="header">
|
|
124
|
+
${this.contactTitle.propertyInputContact ?? msg("Adresse der Immobilie")}
|
|
125
|
+
</div>
|
|
126
|
+
<div slot="content">
|
|
127
|
+
<pd-contact
|
|
128
|
+
id="propertyContactId"
|
|
129
|
+
class="collapse-contact"
|
|
130
|
+
.requiredFields=${[
|
|
135
131
|
"street",
|
|
136
132
|
"streetNr",
|
|
137
133
|
"zip",
|
|
138
134
|
"city"
|
|
139
135
|
]}
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
136
|
+
.inputFields=${["street", "city", "additionalHint"]}
|
|
137
|
+
.contact=${this.propertyContact}
|
|
138
|
+
?withPropertyDate=${this.withPropertyDate}
|
|
139
|
+
></pd-contact>
|
|
140
|
+
</div>
|
|
141
|
+
</pd-collapse>
|
|
146
142
|
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
143
|
+
<pd-collapse id="adminContactCollapseId">
|
|
144
|
+
<div slot="header">
|
|
145
|
+
${this.contactTitle.adminInputContact ?? msg("Adresse der Verwaltung (optional)")}
|
|
146
|
+
</div>
|
|
147
|
+
<div slot="content">
|
|
148
|
+
${this._ownAdminContact ? html`
|
|
149
|
+
<p>
|
|
150
|
+
<a
|
|
151
|
+
@click=${() => this._ownAdminContact = false}
|
|
152
|
+
>${msg(
|
|
157
153
|
"Kundenadresse als Verwaltungsadresse verwenden"
|
|
158
154
|
)}</a
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
155
|
+
>
|
|
156
|
+
</p>
|
|
157
|
+
<pd-contact
|
|
158
|
+
id="adminContactId"
|
|
159
|
+
class="collapse-contact"
|
|
160
|
+
.requiredFields=${this.requiredFields}
|
|
161
|
+
.contact=${this.adminContact}
|
|
162
|
+
></pd-contact>
|
|
163
|
+
` : html`
|
|
164
|
+
<p>
|
|
165
|
+
${msg(
|
|
170
166
|
"Verwaltungsadresse entspricht der Kundenadresse."
|
|
171
167
|
)}
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
168
|
+
</p>
|
|
169
|
+
<p>
|
|
170
|
+
<a
|
|
171
|
+
@click=${() => this._ownAdminContact = true}
|
|
172
|
+
>${msg(
|
|
177
173
|
"Neue Verwaltungsadresse hinzufügen"
|
|
178
174
|
)}</a
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
175
|
+
>
|
|
176
|
+
</p>
|
|
177
|
+
`}
|
|
178
|
+
</div>
|
|
179
|
+
</pd-collapse>
|
|
180
|
+
` : nothing}
|
|
181
|
+
</div>
|
|
182
|
+
` : nothing}
|
|
183
|
+
</pd-collapse-group>
|
|
188
184
|
`;
|
|
189
185
|
}
|
|
190
186
|
_renderSummary() {
|
|
@@ -222,24 +218,51 @@ let PdOrderContacts = class extends LitElement {
|
|
|
222
218
|
`;
|
|
223
219
|
}
|
|
224
220
|
get valid() {
|
|
225
|
-
var _a
|
|
226
|
-
let isValid = false;
|
|
221
|
+
var _a;
|
|
227
222
|
for (const { id, collapse, condition = true } of this._getCollapseMap()) {
|
|
228
223
|
if (!condition) continue;
|
|
229
|
-
|
|
224
|
+
const element = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById(id);
|
|
225
|
+
if (!(element == null ? void 0 : element.valid)) {
|
|
226
|
+
return false;
|
|
227
|
+
}
|
|
230
228
|
}
|
|
231
|
-
return
|
|
229
|
+
return true;
|
|
232
230
|
}
|
|
233
231
|
async triggerValidate() {
|
|
234
232
|
var _a, _b;
|
|
235
|
-
|
|
236
|
-
|
|
233
|
+
let firstInvalidCollapseId = null;
|
|
234
|
+
const collapseMap = this._getCollapseMap();
|
|
235
|
+
console.log("Map: ", collapseMap);
|
|
236
|
+
for (const { id, collapse, condition = true } of collapseMap) {
|
|
237
237
|
if (!condition) continue;
|
|
238
|
-
|
|
239
|
-
|
|
238
|
+
const element = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById(id);
|
|
239
|
+
if (!element) continue;
|
|
240
|
+
const result = await element.triggerValidate();
|
|
241
|
+
console.log("PdContact triggerValidate: ", result);
|
|
242
|
+
if (!result && !firstInvalidCollapseId) {
|
|
243
|
+
firstInvalidCollapseId = collapse;
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
if (firstInvalidCollapseId) {
|
|
247
|
+
console.log("PdContact open failed: ", firstInvalidCollapseId);
|
|
248
|
+
const collapseEl = (_b = this.shadowRoot) == null ? void 0 : _b.getElementById(
|
|
249
|
+
firstInvalidCollapseId
|
|
240
250
|
);
|
|
251
|
+
if (collapseEl) {
|
|
252
|
+
collapseEl.active = true;
|
|
253
|
+
}
|
|
254
|
+
return false;
|
|
255
|
+
}
|
|
256
|
+
return true;
|
|
257
|
+
}
|
|
258
|
+
getValues() {
|
|
259
|
+
var _a, _b;
|
|
260
|
+
const contactValues = {};
|
|
261
|
+
for (const { id, collapse, condition = true } of this._getCollapseMap()) {
|
|
262
|
+
if (!condition) continue;
|
|
263
|
+
contactValues[id] = (_b = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById(id)) == null ? void 0 : _b.getValues();
|
|
241
264
|
}
|
|
242
|
-
return
|
|
265
|
+
return contactValues;
|
|
243
266
|
}
|
|
244
267
|
_getCollapseMap() {
|
|
245
268
|
return [
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { LitElement, CSSResultGroup } from 'lit';
|
|
2
|
-
import {
|
|
1
|
+
import { LitElement, CSSResultGroup, TemplateResult } from 'lit';
|
|
2
|
+
import { PdOrderStep } from './types.js';
|
|
3
3
|
/**
|
|
4
4
|
* Komponente zur Darstellung der Bestellübersicht
|
|
5
5
|
*
|
|
@@ -23,13 +23,16 @@ export declare class PdOrderSummary extends LitElement {
|
|
|
23
23
|
/**
|
|
24
24
|
* Die vollständigen Bestelldaten inklusive Postleitzahl, Kontakten und Preisinformationen.
|
|
25
25
|
*/
|
|
26
|
-
order?:
|
|
26
|
+
order?: any;
|
|
27
|
+
private _agreeForm;
|
|
27
28
|
static styles: CSSResultGroup;
|
|
28
29
|
firstUpdated(): void;
|
|
29
|
-
render():
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
30
|
+
render(): TemplateResult<1>;
|
|
31
|
+
get valid(): boolean;
|
|
32
|
+
triggerValidate(): Promise<boolean>;
|
|
33
|
+
protected _mapOrderStepSummary(step: PdOrderStep, index: number): TemplateResult;
|
|
34
|
+
protected _renderCustomOrderStepSummary(step: PdOrderStep, index: number): TemplateResult | null;
|
|
35
|
+
protected _getContactsSummary(index: number, step: PdOrderStep): TemplateResult<1>;
|
|
33
36
|
private _openTermsAndConditions;
|
|
34
37
|
}
|
|
35
38
|
//# sourceMappingURL=pd-order-summary.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pd-order-summary.d.ts","sourceRoot":"","sources":["../src/pd-order-summary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"pd-order-summary.d.ts","sourceRoot":"","sources":["../src/pd-order-summary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5E,OAAO,qDAAqD,CAAC;AAC7D,OAAO,+CAA+C,CAAC;AACvD,OAAO,+CAA+C,CAAC;AAEvD,OAAO,iDAAiD,CAAC;AACzD,OAAO,6CAA6C,CAAC;AACrD,OAAO,qDAAqD,CAAC;AAO7D,OAAO,EAAsB,WAAW,EAAE,MAAM,YAAY,CAAC;AAE7D,OAAO,wBAAwB,CAAC;AAGhC;;;;;GAKG;AACH,qBAEa,cAAe,SAAQ,UAAU;IAC5C;;;OAGG;IAEH,UAAU,EAAE,WAAW,EAAE,CAAM;IAE/B;;OAEG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,KAAK,CAAC,EAAE,GAAG,CAAC;IAGZ,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAgB,MAAM,EAAE,cAAc,CAqDpC;IAEO,YAAY,IAAI,IAAI;IAYpB,MAAM;IA0Df,IAAI,KAAK,YAER;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IA6BhD,SAAS,CAAC,oBAAoB,CAC5B,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc;IAkBjB,SAAS,CAAC,6BAA6B,CACrC,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc,GAAG,IAAI;IAUxB,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW;IAoB9D,OAAO,CAAC,uBAAuB;CAOhC"}
|
package/dist/pd-order-summary.js
CHANGED
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { css, LitElement, html } from "lit";
|
|
2
|
-
import { property, customElement } from "lit/decorators.js";
|
|
2
|
+
import { property, query, customElement } from "lit/decorators.js";
|
|
3
3
|
import { localized, msg } from "@lit/localize";
|
|
4
|
-
import { format } from "fecha";
|
|
5
|
-
import "@progressive-development/pd-forms/pd-checkbox";
|
|
6
|
-
import "@progressive-development/pd-forms/pd-radio-group";
|
|
7
4
|
import "@progressive-development/pd-forms/pd-form-container";
|
|
8
5
|
import "@progressive-development/pd-forms/pd-form-row";
|
|
6
|
+
import "@progressive-development/pd-forms/pd-checkbox";
|
|
9
7
|
import "@progressive-development/pd-price/pd-pricetable";
|
|
10
8
|
import "@progressive-development/pd-dialog/pd-popup";
|
|
11
9
|
import "@progressive-development/pd-content/pd-edit-content";
|
|
@@ -38,32 +36,15 @@ let PdOrderSummary = class extends LitElement {
|
|
|
38
36
|
})
|
|
39
37
|
);
|
|
40
38
|
});
|
|
41
|
-
this.addEventListener("validate-form", this._validateForm);
|
|
42
39
|
}
|
|
43
40
|
render() {
|
|
44
41
|
if (!this.order) return html`<p>No order is set</p>`;
|
|
45
42
|
return html`
|
|
46
43
|
<h3>${msg("Übersicht", { id: "pd.order.summary.title" })}</h3>
|
|
47
44
|
<div class="edit-summary-container">
|
|
48
|
-
${this.orderSteps.map(
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
case "booking":
|
|
52
|
-
return this._getBookingSummary(index + 1, step);
|
|
53
|
-
case "contacts":
|
|
54
|
-
return this._getContactsSummary(index + 1, step);
|
|
55
|
-
default:
|
|
56
|
-
return html`
|
|
57
|
-
<pd-edit-content
|
|
58
|
-
contentTitle="${step.name}"
|
|
59
|
-
stepNumber="${index + 1}"
|
|
60
|
-
.data="${step.data}"
|
|
61
|
-
>
|
|
62
|
-
<slot name="${step.key}"></slot>
|
|
63
|
-
</pd-edit-content>
|
|
64
|
-
`;
|
|
65
|
-
}
|
|
66
|
-
})}
|
|
45
|
+
${this.orderSteps.map(
|
|
46
|
+
(step, index) => this._mapOrderStepSummary(step, index)
|
|
47
|
+
)}
|
|
67
48
|
</div>
|
|
68
49
|
|
|
69
50
|
${this.order.priceData ? html`
|
|
@@ -108,42 +89,74 @@ let PdOrderSummary = class extends LitElement {
|
|
|
108
89
|
` : ""}
|
|
109
90
|
`;
|
|
110
91
|
}
|
|
111
|
-
|
|
112
|
-
var _a
|
|
113
|
-
|
|
114
|
-
(_b = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("submitSummaryFormId")) == null ? void 0 : _b.dispatchEvent(new CustomEvent("validate-form", { detail: e.detail }));
|
|
115
|
-
}
|
|
92
|
+
get valid() {
|
|
93
|
+
var _a;
|
|
94
|
+
return !this.withAgreement || ((_a = this._agreeForm) == null ? void 0 : _a.valid) === true;
|
|
116
95
|
}
|
|
117
|
-
|
|
118
|
-
var _a
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
96
|
+
async triggerValidate() {
|
|
97
|
+
var _a;
|
|
98
|
+
return (_a = this._agreeForm) == null ? void 0 : _a.triggerValidate();
|
|
99
|
+
}
|
|
100
|
+
/*
|
|
101
|
+
For Booking:
|
|
102
|
+
case "zip":
|
|
103
|
+
case "booking":
|
|
104
|
+
return this._getBookingSummary(index + 1, step);
|
|
105
|
+
|
|
106
|
+
private _getBookingSummary(index: number, step: PdOrderStep) {
|
|
107
|
+
const date = this.order?.selectedDate
|
|
108
|
+
? format(this.order.selectedDate, "DD/MM/YYYY")
|
|
109
|
+
: undefined;
|
|
110
|
+
const bookingData = [{ name: "Postcode:", val: this.order?.zip }];
|
|
111
|
+
if (date) {
|
|
112
|
+
bookingData.push({ name: "Datum van herstelling:", val: date });
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
return html`
|
|
116
|
+
<pd-edit-content
|
|
117
|
+
contentTitle="${step.name}"
|
|
118
|
+
stepNumber="${index}"
|
|
119
|
+
.data="${bookingData}"
|
|
120
|
+
></pd-edit-content>
|
|
121
|
+
`;
|
|
122
|
+
}
|
|
123
|
+
*/
|
|
124
|
+
_mapOrderStepSummary(step, index) {
|
|
125
|
+
const custom = this._renderCustomOrderStepSummary(step, index);
|
|
126
|
+
if (custom) {
|
|
127
|
+
return custom;
|
|
123
128
|
}
|
|
124
129
|
return html`
|
|
125
130
|
<pd-edit-content
|
|
126
131
|
contentTitle="${step.name}"
|
|
127
|
-
stepNumber="${index}"
|
|
128
|
-
.data="${
|
|
129
|
-
|
|
132
|
+
stepNumber="${index + 1}"
|
|
133
|
+
.data="${step.data}"
|
|
134
|
+
>
|
|
135
|
+
<slot name="${step.key}"></slot>
|
|
136
|
+
</pd-edit-content>
|
|
130
137
|
`;
|
|
131
138
|
}
|
|
139
|
+
_renderCustomOrderStepSummary(step, index) {
|
|
140
|
+
switch (step.key) {
|
|
141
|
+
case "contacts":
|
|
142
|
+
return this._getContactsSummary(index + 1, step);
|
|
143
|
+
default:
|
|
144
|
+
return null;
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
// ?editDisabled="${this.order?.withLogin}" => Alter code, von ticomi-web
|
|
132
148
|
_getContactsSummary(index, step) {
|
|
133
|
-
var _a
|
|
149
|
+
var _a;
|
|
150
|
+
const contactData = (_a = this.order) == null ? void 0 : _a.contacts;
|
|
134
151
|
return html`
|
|
135
|
-
<pd-edit-content
|
|
136
|
-
|
|
137
|
-
stepNumber="${index}"
|
|
138
|
-
?editDisabled="${(_a = this.order) == null ? void 0 : _a.withLogin}"
|
|
139
|
-
>
|
|
140
|
-
${((_b = this.order) == null ? void 0 : _b.contacts) ? html`
|
|
152
|
+
<pd-edit-content contentTitle="${step.name}" stepNumber="${index}">
|
|
153
|
+
${contactData ? html`
|
|
141
154
|
<pd-order-contacts
|
|
142
155
|
?withPayment="${this.withPayment}"
|
|
143
|
-
.orderContact="${
|
|
144
|
-
.billingContact="${
|
|
145
|
-
.adminContact="${
|
|
146
|
-
.propertyContact="${
|
|
156
|
+
.orderContact="${contactData.orderContact}"
|
|
157
|
+
.billingContact="${contactData.billingContact}"
|
|
158
|
+
.adminContact="${contactData.adminContact}"
|
|
159
|
+
.propertyContact="${contactData.propertyContact}"
|
|
147
160
|
summary
|
|
148
161
|
></pd-order-contacts>
|
|
149
162
|
` : ""}
|
|
@@ -225,6 +238,9 @@ __decorateClass([
|
|
|
225
238
|
__decorateClass([
|
|
226
239
|
property({ type: Object })
|
|
227
240
|
], PdOrderSummary.prototype, "order", 2);
|
|
241
|
+
__decorateClass([
|
|
242
|
+
query("#submitSummaryFormId")
|
|
243
|
+
], PdOrderSummary.prototype, "_agreeForm", 2);
|
|
228
244
|
PdOrderSummary = __decorateClass([
|
|
229
245
|
customElement("pd-order-summary"),
|
|
230
246
|
localized()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pd-order-contacts.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-order-contacts.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,sBAAsB,CAAC;wBAMzB,IAAI,CAAC,eAAe,CAAC;AAJ1B,wBAI2B;
|
|
1
|
+
{"version":3,"file":"pd-order-contacts.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-order-contacts.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,sBAAsB,CAAC;wBAMzB,IAAI,CAAC,eAAe,CAAC;AAJ1B,wBAI2B;AA8E3B,eAAO,MAAM,OAAO,0BAAoB,CAAC;AAKzC,eAAO,MAAM,gBAAgB,0BAAoB,CAAC;AAMlD,eAAO,MAAM,cAAc,0BAAoB,CAAC;AAiBhD,eAAO,MAAM,WAAW,0BAAoB,CAAC;AAM7C,eAAO,MAAM,mBAAmB,0BAAoB,CAAC;AAOrD,eAAO,MAAM,4BAA4B,0BAAoB,CAAC;AAQ9D,eAAO,MAAM,QAAQ,0BAAoB,CAAC;AAM1C,eAAO,MAAM,eAAe,0BAAoB,CAAC;AAOjD,eAAO,MAAM,uBAAuB,0BAAoB,CAAC;AASzD,eAAO,MAAM,MAAM,0BAAoB,CAAC;AAQxC,eAAO,MAAM,eAAe,0BAAoB,CAAC;AAWjD,eAAO,MAAM,sBAAsB,0BAAoB,CAAC"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { Meta, StoryFn } from '@storybook/web-components';
|
|
2
|
-
import {
|
|
3
|
-
declare const _default: Meta<
|
|
2
|
+
import { TestSummary } from './test-impl/test-summary.js';
|
|
3
|
+
declare const _default: Meta<TestSummary>;
|
|
4
4
|
export default _default;
|
|
5
|
-
export declare const OrderSummary: StoryFn<
|
|
5
|
+
export declare const OrderSummary: StoryFn<TestSummary & {
|
|
6
6
|
orderContact: any;
|
|
7
7
|
billingContact?: any;
|
|
8
8
|
}>;
|
|
9
|
-
export declare const OrderSummaryEmptyBilling: StoryFn<
|
|
9
|
+
export declare const OrderSummaryEmptyBilling: StoryFn<TestSummary & {
|
|
10
10
|
orderContact: any;
|
|
11
11
|
billingContact?: any;
|
|
12
12
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pd-order-summary.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-order-summary.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAI/D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"pd-order-summary.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-order-summary.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAI/D,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,6BAA6B,CAAC;wBAMhC,IAAI,CAAC,WAAW,CAAC;AAJtB,wBAIuB;AA0EvB,eAAO,MAAM,YAAY;kBAxCP,GAAG;qBACA,GAAG;EAuCqB,CAAC;AAuB9C,eAAO,MAAM,wBAAwB;kBA/DnB,GAAG;qBACA,GAAG;EA8DiC,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { TemplateResult } from 'lit';
|
|
2
|
+
import { PdOrderSummary } from '../../pd-order-summary';
|
|
3
|
+
import { PdOrderStep } from '../../types';
|
|
4
|
+
export declare class TestSummary extends PdOrderSummary {
|
|
5
|
+
_renderCustomOrderStepSummary(step: PdOrderStep, index: number): TemplateResult | null;
|
|
6
|
+
private _getBookingSummary;
|
|
7
|
+
}
|
|
8
|
+
//# sourceMappingURL=test-summary.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"test-summary.d.ts","sourceRoot":"","sources":["../../../src/stories/test-impl/test-summary.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAI3C,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,qBACa,WAAY,SAAQ,cAAc;IACpC,6BAA6B,CACpC,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc,GAAG,IAAI;IAYxB,OAAO,CAAC,kBAAkB;CAiB3B"}
|
package/dist/types.d.ts
CHANGED
|
@@ -10,21 +10,10 @@ export interface PdOrderStep {
|
|
|
10
10
|
val: string;
|
|
11
11
|
}[];
|
|
12
12
|
}
|
|
13
|
-
export interface
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
/** Gibt an, ob ein Benutzerlogin vorliegt (steuert z.B. Bearbeitbarkeit) */
|
|
19
|
-
withLogin?: boolean;
|
|
20
|
-
/** Optionale Kontaktinformationen für alle Kontaktrollen */
|
|
21
|
-
contacts?: {
|
|
22
|
-
orderContact?: PdContactData;
|
|
23
|
-
billingContact?: PdContactData;
|
|
24
|
-
adminContact?: PdContactData;
|
|
25
|
-
propertyContact?: PdContactData;
|
|
26
|
-
};
|
|
27
|
-
/** Preisstruktur für die Bestellung */
|
|
28
|
-
priceData?: unknown;
|
|
13
|
+
export interface PdOrderContactData {
|
|
14
|
+
orderContact?: PdContactData;
|
|
15
|
+
billingContact?: PdContactData;
|
|
16
|
+
adminContact?: PdContactData;
|
|
17
|
+
propertyContact?: PdContactData;
|
|
29
18
|
}
|
|
30
19
|
//# sourceMappingURL=types.d.ts.map
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAEpE,MAAM,WAAW,WAAW;IAC1B,qEAAqE;IACrE,GAAG,EAAE,MAAM,CAAC;IACZ,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAEpE,MAAM,WAAW,WAAW;IAC1B,qEAAqE;IACrE,GAAG,EAAE,MAAM,CAAC;IACZ,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,kBAAkB;IACjC,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,eAAe,CAAC,EAAE,aAAa,CAAC;CACjC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progressive-development/pd-order",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.9",
|
|
4
4
|
"description": "Progressive Development Order Component",
|
|
5
5
|
"author": "PD Progressive Development",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE",
|
|
@@ -41,10 +41,10 @@
|
|
|
41
41
|
"dependencies": {
|
|
42
42
|
"@lit/localize": "^0.12.2",
|
|
43
43
|
"@progressive-development/pd-calendar": "^0.6.7",
|
|
44
|
-
"@progressive-development/pd-contact": "^0.6.
|
|
45
|
-
"@progressive-development/pd-content": "^0.7.
|
|
46
|
-
"@progressive-development/pd-dialog": "^0.6.
|
|
47
|
-
"@progressive-development/pd-forms": "^0.7.
|
|
44
|
+
"@progressive-development/pd-contact": "^0.6.10",
|
|
45
|
+
"@progressive-development/pd-content": "^0.7.2",
|
|
46
|
+
"@progressive-development/pd-dialog": "^0.6.10",
|
|
47
|
+
"@progressive-development/pd-forms": "^0.7.3",
|
|
48
48
|
"@progressive-development/pd-price": "^0.6.3",
|
|
49
49
|
"@progressive-development/pd-shared-styles": "^0.2.5",
|
|
50
50
|
"fecha": "^4.2.3",
|