tek-ms-recap 1.0.11 → 1.0.13
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/Recap/index.d.ts +4 -1
- package/dist/ms-recap.js +30 -14
- package/package.json +1 -1
package/dist/Recap/index.d.ts
CHANGED
|
@@ -15,10 +15,11 @@ export interface Customer {
|
|
|
15
15
|
export interface RenderInterfaceRecap {
|
|
16
16
|
items: RecapItem[];
|
|
17
17
|
customers: Customer[];
|
|
18
|
-
onConfirm: (items: RecapItem[], customer: Customer) => void;
|
|
18
|
+
onConfirm: (items: RecapItem[], customer: Customer | null) => void;
|
|
19
19
|
onCancel: (items: RecapItem[]) => void;
|
|
20
20
|
onSaveCustomer?: (customer: Customer) => void;
|
|
21
21
|
selectedCustomer?: (customer: Customer) => void;
|
|
22
|
+
defaultCustomer?: Customer | null;
|
|
22
23
|
}
|
|
23
24
|
export declare class RecapSheet {
|
|
24
25
|
private el;
|
|
@@ -29,6 +30,7 @@ export declare class RecapSheet {
|
|
|
29
30
|
private customers;
|
|
30
31
|
private clientSearchTerm;
|
|
31
32
|
private selectedCustomer;
|
|
33
|
+
private reminderShown;
|
|
32
34
|
private onConfirm?;
|
|
33
35
|
private onCancel?;
|
|
34
36
|
private onSaveCustomer?;
|
|
@@ -46,6 +48,7 @@ export declare class RecapSheet {
|
|
|
46
48
|
private renderItems;
|
|
47
49
|
private renderRecapTotal;
|
|
48
50
|
private renderClientBlock;
|
|
51
|
+
private remindSelectCustomer;
|
|
49
52
|
private renderClientSheet;
|
|
50
53
|
private renderClientResults;
|
|
51
54
|
private selectCustomer;
|
package/dist/ms-recap.js
CHANGED
|
@@ -26,6 +26,7 @@ var t = [
|
|
|
26
26
|
customers = [];
|
|
27
27
|
clientSearchTerm = "";
|
|
28
28
|
selectedCustomer = null;
|
|
29
|
+
reminderShown = !1;
|
|
29
30
|
onConfirm;
|
|
30
31
|
onCancel;
|
|
31
32
|
onSaveCustomer;
|
|
@@ -46,7 +47,7 @@ var t = [
|
|
|
46
47
|
this.total = e;
|
|
47
48
|
}
|
|
48
49
|
onClose() {
|
|
49
|
-
this.setItems([]), this.selectedCustomer = null, this.el.innerHTML = "", this.resetClientSheet(), this.resetClientOverlay();
|
|
50
|
+
this.setItems([]), this.selectedCustomer = null, this.reminderShown = !1, this.el.innerHTML = "", this.resetClientSheet(), this.resetClientOverlay();
|
|
50
51
|
}
|
|
51
52
|
removeFromCartItems(e) {
|
|
52
53
|
let t = this.getItems();
|
|
@@ -61,7 +62,7 @@ var t = [
|
|
|
61
62
|
return t[n % t.length];
|
|
62
63
|
}
|
|
63
64
|
render(t) {
|
|
64
|
-
this.setItems(t.items), this.customers = t.customers, this.onConfirm = t.onConfirm, this.onCancel = t.onCancel, this.onSaveCustomer = t.onSaveCustomer, this.setSelectedCustomer = t.selectedCustomer, this.selectedCustomer = null, this.el.innerHTML = `
|
|
65
|
+
this.setItems(t.items), this.customers = t.customers, this.onConfirm = t.onConfirm, this.onCancel = t.onCancel, this.onSaveCustomer = t.onSaveCustomer, this.setSelectedCustomer = t.selectedCustomer, this.selectedCustomer = t.defaultCustomer ?? null, this.reminderShown = !1, this.el.innerHTML = `
|
|
65
66
|
<div class="overlay show" id="recap-overlay">
|
|
66
67
|
<div class="sheet modal-recap" style="max-height:88vh;">
|
|
67
68
|
<div class="sheet-handle"></div>
|
|
@@ -80,14 +81,18 @@ var t = [
|
|
|
80
81
|
<div class="payment-hint">Espèces · Mobile Money · Carte</div>
|
|
81
82
|
<div class="sheet-actions">
|
|
82
83
|
<button class="btn-cancel" id="recap-btn-cancel">Modifier</button>
|
|
83
|
-
<button class="btn-confirm" id="recap-btn-confirm"
|
|
84
|
+
<button class="btn-confirm" id="recap-btn-confirm">Confirmer la vente</button>
|
|
84
85
|
</div>
|
|
85
86
|
</div>
|
|
86
87
|
</div>
|
|
87
88
|
`, this.el.querySelector("#recap-btn-cancel")?.addEventListener("click", () => {
|
|
88
89
|
this.onCancel?.(this.getItems()), this.onClose();
|
|
89
90
|
}), this.el.querySelector("#recap-btn-confirm")?.addEventListener("click", () => {
|
|
90
|
-
this.selectedCustomer && this.
|
|
91
|
+
if (!this.selectedCustomer && !this.reminderShown) {
|
|
92
|
+
this.remindSelectCustomer(), this.reminderShown = !0;
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
this.onConfirm?.(this.getItems(), this.selectedCustomer);
|
|
91
96
|
}), this.renderItems(), this.renderRecapTotal(), this.renderClientBlock();
|
|
92
97
|
}
|
|
93
98
|
renderItems() {
|
|
@@ -116,11 +121,10 @@ var t = [
|
|
|
116
121
|
n && (n.innerHTML = e(t)), r && (r.innerHTML = e(t));
|
|
117
122
|
}
|
|
118
123
|
renderClientBlock() {
|
|
119
|
-
let e = this.el.querySelector("#recap-client-block")
|
|
120
|
-
if (e) {
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
this.setSelectedCustomer?.(t), e.innerHTML = `
|
|
124
|
+
let e = this.el.querySelector("#recap-client-block");
|
|
125
|
+
if (e) if (this.selectedCustomer) {
|
|
126
|
+
let t = this.selectedCustomer;
|
|
127
|
+
this.setSelectedCustomer?.(t), this.reminderShown = !1, e.innerHTML = `
|
|
124
128
|
<div style="display:flex; align-items:center; gap:10px; text-align:left;">
|
|
125
129
|
<div class="avatar" style="background:${this.avatarColorFor(t.phone)}; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:11px; flex-shrink:0;">
|
|
126
130
|
${this.getCustomerInitials(t.firstname, t.lastname)}
|
|
@@ -132,13 +136,25 @@ var t = [
|
|
|
132
136
|
<button class="btn-cancel" id="recap-btn-change-client" style="padding:6px 10px; flex-shrink:0;">Changer</button>
|
|
133
137
|
</div>
|
|
134
138
|
`, e.querySelector("#recap-btn-change-client")?.addEventListener("click", () => {
|
|
135
|
-
this.renderClientSheet();
|
|
136
|
-
});
|
|
137
|
-
} else e.innerHTML = "\n <div style=\"font-size:11.5px; color:var(--ink-muted); margin-bottom:8px;\">Aucun client identifié</div>\n <button class=\"btn-cancel\" style=\"width:100%;\" id=\"recap-btn-choose-client\">Choisir un client</button>\n ", e.querySelector("#recap-btn-choose-client")?.addEventListener("click", () => {
|
|
138
139
|
this.renderClientSheet();
|
|
139
140
|
});
|
|
140
|
-
|
|
141
|
-
|
|
141
|
+
} else e.innerHTML = "\n <div style=\"font-size:11.5px; color:var(--ink-muted); margin-bottom:8px;\">Aucun client identifié</div>\n <button class=\"btn-cancel\" style=\"width:100%;\" id=\"recap-btn-choose-client\">Choisir un client</button>\n ", e.querySelector("#recap-btn-choose-client")?.addEventListener("click", () => {
|
|
142
|
+
this.renderClientSheet();
|
|
143
|
+
});
|
|
144
|
+
}
|
|
145
|
+
remindSelectCustomer() {
|
|
146
|
+
let e = this.el.querySelector("#recap-client-block");
|
|
147
|
+
e && (e.style.transition = "background 0.15s ease", e.style.background = "#F7D9D6", e.animate([
|
|
148
|
+
{ transform: "translateX(0)" },
|
|
149
|
+
{ transform: "translateX(-4px)" },
|
|
150
|
+
{ transform: "translateX(4px)" },
|
|
151
|
+
{ transform: "translateX(0)" }
|
|
152
|
+
], {
|
|
153
|
+
duration: 250,
|
|
154
|
+
iterations: 1
|
|
155
|
+
}), setTimeout(() => {
|
|
156
|
+
e.style.background = "var(--paper-deep)";
|
|
157
|
+
}, 600));
|
|
142
158
|
}
|
|
143
159
|
renderClientSheet() {
|
|
144
160
|
this.clientSearchTerm = "", this.clientOverlayEl.innerHTML = "\n <div class=\"overlay show\">\n <div class=\"sheet\" style=\"max-height:88vh;\">\n <div class=\"sheet-handle\"></div>\n <h3>Identifier la cliente</h3>\n <div class=\"catalog-price\" style=\"margin-bottom:10px;\">Recherchez par nom ou numéro</div>\n\n <div class=\"search-input-wrap\" id=\"client-search-wrap\" style=\"margin-bottom:12px;\">\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\"><circle cx=\"11\" cy=\"11\" r=\"7\"/><line x1=\"21\" y1=\"21\" x2=\"16.4\" y2=\"16.4\"/></svg>\n <input type=\"text\" id=\"client-search-input\" placeholder=\"Nom ou téléphone...\">\n <button class=\"search-clear\" id=\"client-search-clear\">✕</button>\n </div>\n\n <div class=\"clients-grid\" id=\"client-results-list\" style=\"grid-template-columns:1fr; max-height:38vh; overflow-y:auto; margin-bottom:14px;\"></div>\n\n <button class=\"btn-confirm\" style=\"width:100%;\" id=\"nouveau-client\">+ Nouveau client</button>\n </div>\n </div>\n ", this.clientOverlayEl.querySelector("#nouveau-client")?.addEventListener("click", () => this.renderClientOverlay()), this.clientOverlayEl.querySelector("#client-search-clear")?.addEventListener("click", () => this.clearClientSearch());
|