@consilioweb/payload-support 0.6.0 → 0.6.2
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/{styles/theme.css → components/TicketConversation.css} +13 -326
- package/dist/components/TicketConversation.js +3004 -0
- package/dist/index.cjs +11 -11
- package/dist/index.js +11 -11
- package/dist/views/BillingView/client.cjs +209 -0
- package/dist/views/BillingView/index.cjs +34 -0
- package/dist/views/ChatView/client.cjs +253 -0
- package/dist/views/ChatView/index.cjs +34 -0
- package/dist/views/CrmView/client.cjs +233 -0
- package/dist/views/CrmView/index.cjs +34 -0
- package/dist/views/EmailTrackingView/client.cjs +159 -0
- package/dist/views/EmailTrackingView/index.cjs +34 -0
- package/dist/views/ImportConversationView/client.cjs +205 -0
- package/dist/views/ImportConversationView/index.cjs +34 -0
- package/dist/views/LogsView/client.cjs +149 -0
- package/dist/views/LogsView/index.cjs +32 -0
- package/dist/views/NewTicketView/client.cjs +229 -0
- package/dist/views/NewTicketView/index.cjs +32 -0
- package/dist/views/PendingEmailsView/client.cjs +173 -0
- package/dist/views/PendingEmailsView/index.cjs +34 -0
- package/dist/views/SupportDashboardView/client.cjs +301 -0
- package/dist/views/SupportDashboardView/index.cjs +34 -0
- package/dist/views/TicketDetailView/client.cjs +850 -0
- package/dist/views/TicketDetailView/index.cjs +34 -0
- package/dist/views/TicketInboxView/client.cjs +299 -0
- package/dist/views/TicketInboxView/index.cjs +32 -0
- package/dist/views/TicketingSettingsView/client.cjs +733 -0
- package/dist/views/TicketingSettingsView/index.cjs +34 -0
- package/dist/views/TimeDashboardView/client.cjs +169 -0
- package/dist/views/TimeDashboardView/index.cjs +34 -0
- package/dist/views/shared/AdminViewHeader.cjs +68 -0
- package/dist/views/shared/ErrorBoundary.cjs +55 -0
- package/dist/views/shared/Skeleton.cjs +77 -0
- package/dist/views/shared/adminTokens.cjs +34 -0
- package/dist/views/shared/adminTokens.js +0 -1
- package/dist/{components/TicketConversation/config.js → views/shared/config.cjs} +5 -2
- package/dist/views/shared/config.js +0 -1
- package/dist/views/shared/index.cjs +58 -0
- package/dist/views/shared/index.js +0 -1
- package/dist/views.cjs +86 -0
- package/dist/views.d.cts +13 -0
- package/dist/views.d.ts +13 -0
- package/dist/views.js +13 -0
- package/package.json +14 -7
- package/src/plugin.ts +11 -11
- package/src/views.ts +17 -0
- package/dist/components/TicketConversation/components/AISummaryPanel.js +0 -76
- package/dist/components/TicketConversation/components/ActionPanels.js +0 -118
- package/dist/components/TicketConversation/components/ActivityLog.js +0 -23
- package/dist/components/TicketConversation/components/ClientBar.js +0 -42
- package/dist/components/TicketConversation/components/ClientHistory.js +0 -137
- package/dist/components/TicketConversation/components/CodeBlock.js +0 -152
- package/dist/components/TicketConversation/components/CodeBlockInserter.js +0 -155
- package/dist/components/TicketConversation/components/QuickActions.js +0 -65
- package/dist/components/TicketConversation/components/TicketHeader.js +0 -92
- package/dist/components/TicketConversation/components/TimeTrackingPanel.js +0 -133
- package/dist/components/TicketConversation/constants.js +0 -96
- package/dist/components/TicketConversation/context.js +0 -11
- package/dist/components/TicketConversation/hooks/useAI.js +0 -176
- package/dist/components/TicketConversation/hooks/useMessageActions.js +0 -135
- package/dist/components/TicketConversation/hooks/useReply.js +0 -187
- package/dist/components/TicketConversation/hooks/useTicketActions.js +0 -230
- package/dist/components/TicketConversation/hooks/useTimeTracking.js +0 -122
- package/dist/components/TicketConversation/hooks/useTranslation.js +0 -70
- package/dist/components/TicketConversation/index.js +0 -1123
- package/dist/components/TicketConversation/locales/en.json +0 -878
- package/dist/components/TicketConversation/locales/fr.json +0 -878
- package/dist/components/TicketConversation/types.js +0 -2
- package/dist/components/TicketConversation/utils.js +0 -25
- package/dist/styles/BillingView.module.scss +0 -311
- package/dist/styles/ChatView.module.scss +0 -438
- package/dist/styles/CommandPalette.module.scss +0 -160
- package/dist/styles/CrmView.module.scss +0 -554
- package/dist/styles/EmailTracking.module.scss +0 -238
- package/dist/styles/ImportConversation.module.scss +0 -267
- package/dist/styles/Layout.module.scss +0 -55
- package/dist/styles/Logs.module.scss +0 -164
- package/dist/styles/NewTicket.module.scss +0 -143
- package/dist/styles/PendingEmails.module.scss +0 -629
- package/dist/styles/SupportDashboard.module.scss +0 -649
- package/dist/styles/TicketDetail.module.scss +0 -1050
- package/dist/styles/TicketInbox.module.scss +0 -296
- package/dist/styles/TicketingSettings.module.scss +0 -358
- package/dist/styles/TimeDashboard.module.scss +0 -287
- package/dist/styles/_tokens.scss +0 -78
|
@@ -0,0 +1,233 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('react');
|
|
5
|
+
var useTranslation = require('../../components/TicketConversation/hooks/useTranslation');
|
|
6
|
+
|
|
7
|
+
const statusLabelKeys = { open: "ticket.status.open", waiting_client: "ticket.status.waiting_client", resolved: "ticket.status.resolved" };
|
|
8
|
+
const statusColors = { open: "#3b82f6", waiting_client: "#f59e0b", resolved: "#22c55e" };
|
|
9
|
+
function formatDuration(minutes) {
|
|
10
|
+
const h = Math.floor(minutes / 60);
|
|
11
|
+
const m = minutes % 60;
|
|
12
|
+
if (h === 0) return `${m}min`;
|
|
13
|
+
if (m === 0) return `${h}h`;
|
|
14
|
+
return `${h}h${m}m`;
|
|
15
|
+
}
|
|
16
|
+
function timeAgo(dateStr) {
|
|
17
|
+
const diff = Date.now() - new Date(dateStr).getTime();
|
|
18
|
+
const days = Math.floor(diff / 864e5);
|
|
19
|
+
if (days === 0) return "Aujourd'hui";
|
|
20
|
+
if (days === 1) return "Hier";
|
|
21
|
+
if (days < 30) return `Il y a ${days}j`;
|
|
22
|
+
return `Il y a ${Math.floor(days / 30)} mois`;
|
|
23
|
+
}
|
|
24
|
+
const CrmClient = () => {
|
|
25
|
+
const { t } = useTranslation.useTranslation();
|
|
26
|
+
const [clients, setClients] = react.useState([]);
|
|
27
|
+
const [loading, setLoading] = react.useState(true);
|
|
28
|
+
const [search, setSearch] = react.useState("");
|
|
29
|
+
const [selectedId, setSelectedId] = react.useState(null);
|
|
30
|
+
const [detail, setDetail] = react.useState(null);
|
|
31
|
+
const [detailLoading, setDetailLoading] = react.useState(false);
|
|
32
|
+
const [showMerge, setShowMerge] = react.useState(false);
|
|
33
|
+
const [mergeSearch, setMergeSearch] = react.useState("");
|
|
34
|
+
const [mergeResults, setMergeResults] = react.useState([]);
|
|
35
|
+
const [merging, setMerging] = react.useState(false);
|
|
36
|
+
const [mergeSuccess, setMergeSuccess] = react.useState("");
|
|
37
|
+
const fetchClients = react.useCallback(async () => {
|
|
38
|
+
try {
|
|
39
|
+
const params = new URLSearchParams({ limit: "100", sort: "company", depth: "0" });
|
|
40
|
+
if (search) params.set("where[company][like]", search);
|
|
41
|
+
const res = await fetch(`/api/support-clients?${params}`);
|
|
42
|
+
if (res.ok) {
|
|
43
|
+
const json = await res.json();
|
|
44
|
+
setClients(json.docs || []);
|
|
45
|
+
}
|
|
46
|
+
} catch {
|
|
47
|
+
}
|
|
48
|
+
setLoading(false);
|
|
49
|
+
}, [search]);
|
|
50
|
+
react.useEffect(() => {
|
|
51
|
+
const timeout = setTimeout(fetchClients, 300);
|
|
52
|
+
return () => clearTimeout(timeout);
|
|
53
|
+
}, [fetchClients]);
|
|
54
|
+
const fetchDetail = react.useCallback(async (clientId) => {
|
|
55
|
+
setDetailLoading(true);
|
|
56
|
+
try {
|
|
57
|
+
const [clientRes, ticketsRes, projectsRes, timeRes] = await Promise.all([
|
|
58
|
+
fetch(`/api/support-clients/${clientId}?depth=0`),
|
|
59
|
+
fetch(`/api/tickets?where[client][equals]=${clientId}&sort=-createdAt&limit=20&depth=0`),
|
|
60
|
+
fetch(`/api/projects?where[client][equals]=${clientId}&depth=0`),
|
|
61
|
+
fetch(`/api/time-entries?limit=0&depth=0`)
|
|
62
|
+
]);
|
|
63
|
+
const client = clientRes.ok ? await clientRes.json() : null;
|
|
64
|
+
const tickets = ticketsRes.ok ? (await ticketsRes.json()).docs || [] : [];
|
|
65
|
+
const projects = projectsRes.ok ? (await projectsRes.json()).docs || [] : [];
|
|
66
|
+
const ticketIds = tickets.map((t2) => t2.id);
|
|
67
|
+
let totalTimeMinutes = 0;
|
|
68
|
+
if (timeRes.ok) {
|
|
69
|
+
const timeData = await timeRes.json();
|
|
70
|
+
totalTimeMinutes = timeData.docs.filter((e) => ticketIds.includes(e.ticket)).reduce((sum, e) => sum + (e.duration || 0), 0);
|
|
71
|
+
}
|
|
72
|
+
const openTickets = tickets.filter((t2) => ["open", "waiting_client"].includes(t2.status)).length;
|
|
73
|
+
const resolvedTickets = tickets.filter((t2) => t2.status === "resolved").length;
|
|
74
|
+
setDetail({ client, tickets, projects, stats: { totalTickets: tickets.length, openTickets, resolvedTickets, totalTimeMinutes, lastActivity: tickets.length > 0 ? tickets[0].createdAt : null } });
|
|
75
|
+
} catch {
|
|
76
|
+
setDetail(null);
|
|
77
|
+
}
|
|
78
|
+
setDetailLoading(false);
|
|
79
|
+
}, []);
|
|
80
|
+
const selectClient = (id) => {
|
|
81
|
+
setSelectedId(id);
|
|
82
|
+
fetchDetail(id);
|
|
83
|
+
setShowMerge(false);
|
|
84
|
+
setMergeSuccess("");
|
|
85
|
+
};
|
|
86
|
+
react.useEffect(() => {
|
|
87
|
+
if (!mergeSearch || mergeSearch.length < 2) {
|
|
88
|
+
setMergeResults([]);
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
const timer = setTimeout(async () => {
|
|
92
|
+
try {
|
|
93
|
+
const res = await fetch(`/api/support-clients?where[or][0][company][like]=${encodeURIComponent(mergeSearch)}&where[or][1][email][like]=${encodeURIComponent(mergeSearch)}&limit=10&depth=0`);
|
|
94
|
+
if (res.ok) {
|
|
95
|
+
const json = await res.json();
|
|
96
|
+
setMergeResults((json.docs || []).filter((c) => c.id !== selectedId));
|
|
97
|
+
}
|
|
98
|
+
} catch {
|
|
99
|
+
}
|
|
100
|
+
}, 300);
|
|
101
|
+
return () => clearTimeout(timer);
|
|
102
|
+
}, [mergeSearch, selectedId]);
|
|
103
|
+
const handleMerge = async (targetId) => {
|
|
104
|
+
if (!selectedId || !detail) return;
|
|
105
|
+
if (!confirm(`Fusionner ce client dans un autre ? Cette action est irreversible.`)) return;
|
|
106
|
+
setMerging(true);
|
|
107
|
+
try {
|
|
108
|
+
const res = await fetch("/api/support/merge-clients", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ sourceId: selectedId, targetId }) });
|
|
109
|
+
if (res.ok) {
|
|
110
|
+
const data = await res.json();
|
|
111
|
+
setMergeSuccess(data.message);
|
|
112
|
+
setShowMerge(false);
|
|
113
|
+
setSelectedId(targetId);
|
|
114
|
+
fetchDetail(targetId);
|
|
115
|
+
fetchClients();
|
|
116
|
+
} else {
|
|
117
|
+
const err = await res.json().catch(() => ({ error: "Erreur inconnue" }));
|
|
118
|
+
alert(`Erreur : ${err.error}`);
|
|
119
|
+
}
|
|
120
|
+
} catch {
|
|
121
|
+
alert("Erreur reseau");
|
|
122
|
+
}
|
|
123
|
+
setMerging(false);
|
|
124
|
+
};
|
|
125
|
+
const S = {
|
|
126
|
+
page: { padding: "20px 30px", maxWidth: 1200, margin: "0 auto" },
|
|
127
|
+
grid: { display: "grid", gridTemplateColumns: "300px 1fr", gap: 20 },
|
|
128
|
+
sidebar: { borderRight: "1px solid var(--theme-elevation-200)", paddingRight: 16 },
|
|
129
|
+
searchInput: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, marginBottom: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
|
|
130
|
+
clientItem: { padding: "10px 12px", borderRadius: 8, cursor: "pointer", marginBottom: 4, border: "1px solid transparent" },
|
|
131
|
+
clientItemActive: { background: "var(--theme-elevation-50)", borderColor: "var(--theme-elevation-200)" },
|
|
132
|
+
statsGrid: { display: "grid", gridTemplateColumns: "repeat(5, 1fr)", gap: 8, marginBottom: 16 },
|
|
133
|
+
statCard: { padding: "10px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-150)", textAlign: "center" },
|
|
134
|
+
table: { width: "100%", borderCollapse: "collapse", fontSize: 13 },
|
|
135
|
+
th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
|
|
136
|
+
td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
|
|
137
|
+
badge: { padding: "2px 6px", borderRadius: 4, fontSize: 10, fontWeight: 600 }
|
|
138
|
+
};
|
|
139
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.page, children: [
|
|
140
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: 20 }, children: [
|
|
141
|
+
/* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("crm.title") }),
|
|
142
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)", marginTop: 4 }, children: t("crm.subtitle") })
|
|
143
|
+
] }),
|
|
144
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.grid, children: [
|
|
145
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.sidebar, children: [
|
|
146
|
+
/* @__PURE__ */ jsxRuntime.jsx("input", { type: "text", placeholder: t("crm.searchPlaceholder"), value: search, onChange: (e) => setSearch(e.target.value), style: S.searchInput }),
|
|
147
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : clients.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("crm.noClientFound") }) : clients.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("div", { onClick: () => selectClient(c.id), style: { ...S.clientItem, ...selectedId === c.id ? S.clientItemActive : {} }, children: [
|
|
148
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 600, fontSize: 13 }, children: c.company }),
|
|
149
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: [
|
|
150
|
+
c.firstName,
|
|
151
|
+
" ",
|
|
152
|
+
c.lastName
|
|
153
|
+
] }),
|
|
154
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-400)" }, children: c.email })
|
|
155
|
+
] }, c.id)) })
|
|
156
|
+
] }),
|
|
157
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children: !selectedId ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("crm.selectClient") }) : detailLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : detail ? /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
158
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 16 }, children: [
|
|
159
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
160
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 20, fontWeight: 700, margin: 0 }, children: detail.client.company }),
|
|
161
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)" }, children: [
|
|
162
|
+
detail.client.firstName,
|
|
163
|
+
" ",
|
|
164
|
+
detail.client.lastName
|
|
165
|
+
] }),
|
|
166
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-400)" }, children: [
|
|
167
|
+
detail.client.email,
|
|
168
|
+
" ",
|
|
169
|
+
detail.client.phone && `-- ${detail.client.phone}`
|
|
170
|
+
] }),
|
|
171
|
+
detail.client.notes && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)", marginTop: 4, fontStyle: "italic" }, children: detail.client.notes })
|
|
172
|
+
] }),
|
|
173
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: 8 }, children: [
|
|
174
|
+
/* @__PURE__ */ jsxRuntime.jsx("a", { href: `/admin/collections/support-clients/${detail.client.id}`, style: { padding: "6px 14px", borderRadius: 6, background: "#2563eb", color: "#fff", fontSize: 12, fontWeight: 600, textDecoration: "none" }, children: t("crm.editButton") }),
|
|
175
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => {
|
|
176
|
+
setShowMerge(!showMerge);
|
|
177
|
+
setMergeSearch("");
|
|
178
|
+
setMergeResults([]);
|
|
179
|
+
}, style: { padding: "6px 14px", borderRadius: 6, border: "1px solid #d97706", background: "none", color: "#d97706", fontSize: 12, fontWeight: 600, cursor: "pointer" }, children: t("crm.mergeButton") })
|
|
180
|
+
] })
|
|
181
|
+
] }),
|
|
182
|
+
mergeSuccess && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "8px 14px", borderRadius: 6, background: "#dcfce7", color: "#166534", fontSize: 13, marginBottom: 12 }, children: mergeSuccess }),
|
|
183
|
+
showMerge && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 8, border: "1px solid #fde68a", background: "#fefce8", marginBottom: 16 }, children: [
|
|
184
|
+
/* @__PURE__ */ jsxRuntime.jsx("h4", { style: { margin: "0 0 8px", fontSize: 14 }, children: t("crm.mergeTitle") }),
|
|
185
|
+
/* @__PURE__ */ jsxRuntime.jsx("input", { type: "text", value: mergeSearch, onChange: (e) => setMergeSearch(e.target.value), placeholder: t("crm.mergeSearchPlaceholder"), style: S.searchInput }),
|
|
186
|
+
mergeResults.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("button", { onClick: () => handleMerge(c.id), disabled: merging, style: { display: "block", width: "100%", padding: "8px 12px", border: "1px solid var(--theme-elevation-200)", borderRadius: 6, background: "var(--theme-elevation-0)", cursor: "pointer", textAlign: "left", marginBottom: 4, fontSize: 13 }, children: [
|
|
187
|
+
/* @__PURE__ */ jsxRuntime.jsx("strong", { children: c.company }),
|
|
188
|
+
" -- ",
|
|
189
|
+
c.firstName,
|
|
190
|
+
" ",
|
|
191
|
+
c.lastName,
|
|
192
|
+
" ",
|
|
193
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "var(--theme-elevation-400)", fontSize: 11 }, children: c.email })
|
|
194
|
+
] }, c.id))
|
|
195
|
+
] }),
|
|
196
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statsGrid, children: [
|
|
197
|
+
{ label: t("crm.stats.totalTickets"), value: String(detail.stats.totalTickets) },
|
|
198
|
+
{ label: t("crm.stats.openTickets"), value: String(detail.stats.openTickets) },
|
|
199
|
+
{ label: t("crm.stats.resolvedTickets"), value: String(detail.stats.resolvedTickets) },
|
|
200
|
+
{ label: t("crm.stats.timeSpent"), value: formatDuration(detail.stats.totalTimeMinutes) },
|
|
201
|
+
{ label: t("crm.stats.lastActivity"), value: detail.stats.lastActivity ? timeAgo(detail.stats.lastActivity) : "-" }
|
|
202
|
+
].map((stat) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
|
|
203
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-500)", marginBottom: 2 }, children: stat.label }),
|
|
204
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 18, fontWeight: 700, color: "var(--theme-text)" }, children: stat.value })
|
|
205
|
+
] }, stat.label)) }),
|
|
206
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", marginBottom: 16 }, children: [
|
|
207
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h3", { style: { fontSize: 14, fontWeight: 700, margin: "0 0 8px" }, children: [
|
|
208
|
+
t("crm.sections.tickets"),
|
|
209
|
+
" (",
|
|
210
|
+
detail.tickets.length,
|
|
211
|
+
")"
|
|
212
|
+
] }),
|
|
213
|
+
detail.tickets.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#94a3b8", fontSize: 13 }, children: t("crm.noTickets") }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { style: S.table, children: [
|
|
214
|
+
/* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
|
|
215
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.number") }),
|
|
216
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.subject") }),
|
|
217
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.status") }),
|
|
218
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.date") })
|
|
219
|
+
] }) }),
|
|
220
|
+
/* @__PURE__ */ jsxRuntime.jsx("tbody", { children: detail.tickets.map((tk) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
|
|
221
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: `/admin/support/ticket?id=${tk.id}`, style: { color: "#2563eb", fontWeight: 600, textDecoration: "none" }, children: tk.ticketNumber }) }),
|
|
222
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: tk.subject }),
|
|
223
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { ...S.badge, background: `${statusColors[tk.status] || "#94a3b8"}20`, color: statusColors[tk.status] || "#94a3b8" }, children: statusLabelKeys[tk.status] ? t(statusLabelKeys[tk.status]) : tk.status }) }),
|
|
224
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, fontSize: 12, color: "var(--theme-elevation-400)" }, children: timeAgo(tk.createdAt) })
|
|
225
|
+
] }, tk.id)) })
|
|
226
|
+
] })
|
|
227
|
+
] })
|
|
228
|
+
] }) : null })
|
|
229
|
+
] })
|
|
230
|
+
] });
|
|
231
|
+
};
|
|
232
|
+
|
|
233
|
+
exports.CrmClient = CrmClient;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var templates = require('@payloadcms/next/templates');
|
|
7
|
+
var navigation = require('next/navigation');
|
|
8
|
+
var ErrorBoundary = require('../shared/ErrorBoundary');
|
|
9
|
+
var client = require('./client');
|
|
10
|
+
|
|
11
|
+
const CrmView = ({ initPageResult }) => {
|
|
12
|
+
const { req, visibleEntities } = initPageResult;
|
|
13
|
+
if (!req.user) {
|
|
14
|
+
navigation.redirect("/admin/login");
|
|
15
|
+
}
|
|
16
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
17
|
+
templates.DefaultTemplate,
|
|
18
|
+
{
|
|
19
|
+
i18n: req.i18n,
|
|
20
|
+
locale: initPageResult.locale,
|
|
21
|
+
params: {},
|
|
22
|
+
payload: req.payload,
|
|
23
|
+
permissions: initPageResult.permissions,
|
|
24
|
+
searchParams: {},
|
|
25
|
+
user: req.user,
|
|
26
|
+
visibleEntities,
|
|
27
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary.AdminErrorBoundary, { viewName: "CrmView", children: /* @__PURE__ */ jsxRuntime.jsx(client.CrmClient, {}) })
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
};
|
|
31
|
+
var CrmView_default = CrmView;
|
|
32
|
+
|
|
33
|
+
exports.CrmView = CrmView;
|
|
34
|
+
exports.default = CrmView_default;
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var useTranslation = require('../../components/TicketConversation/hooks/useTranslation');
|
|
6
|
+
|
|
7
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
+
|
|
9
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
10
|
+
|
|
11
|
+
const STATUS_CFG = {
|
|
12
|
+
success: { key: "emailTracking.status.success", bg: "#dcfce7", color: "#16a34a" },
|
|
13
|
+
error: { key: "emailTracking.status.error", bg: "#fef2f2", color: "#dc2626" },
|
|
14
|
+
ignored: { key: "emailTracking.status.ignored", bg: "#f3f4f6", color: "#6b7280" }
|
|
15
|
+
};
|
|
16
|
+
function fmtDate(d) {
|
|
17
|
+
return new Date(d).toLocaleDateString("fr-FR", { day: "2-digit", month: "2-digit", year: "2-digit", hour: "2-digit", minute: "2-digit" });
|
|
18
|
+
}
|
|
19
|
+
const EmailTrackingClient = () => {
|
|
20
|
+
const { t } = useTranslation.useTranslation();
|
|
21
|
+
const [logs, setLogs] = React.useState([]);
|
|
22
|
+
const [stats, setStats] = React.useState(null);
|
|
23
|
+
const [loading, setLoading] = React.useState(true);
|
|
24
|
+
const [tab, setTab] = React.useState("all");
|
|
25
|
+
const [dateRange, setDateRange] = React.useState(7);
|
|
26
|
+
const [search, setSearch] = React.useState("");
|
|
27
|
+
const [expandedRow, setExpandedRow] = React.useState(null);
|
|
28
|
+
const [page, setPage] = React.useState(1);
|
|
29
|
+
const [hasMore, setHasMore] = React.useState(false);
|
|
30
|
+
const [totalDocs, setTotalDocs] = React.useState(0);
|
|
31
|
+
const fetchStats = React.useCallback(async () => {
|
|
32
|
+
try {
|
|
33
|
+
const r = await fetch(`/api/support/email-stats?days=${dateRange}`);
|
|
34
|
+
if (r.ok) setStats(await r.json());
|
|
35
|
+
} catch (err) {
|
|
36
|
+
console.warn("[support] fetchStats error:", err);
|
|
37
|
+
}
|
|
38
|
+
}, [dateRange]);
|
|
39
|
+
const fetchLogs = React.useCallback(async () => {
|
|
40
|
+
const cutoff = new Date(Date.now() - dateRange * 864e5).toISOString();
|
|
41
|
+
const where = [`where[createdAt][greater_than]=${cutoff}`];
|
|
42
|
+
if (tab !== "all") where.push(`where[status][equals]=${tab}`);
|
|
43
|
+
if (search.trim()) {
|
|
44
|
+
where.push(`where[or][0][recipientEmail][contains]=${encodeURIComponent(search)}`, `where[or][1][subject][contains]=${encodeURIComponent(search)}`);
|
|
45
|
+
}
|
|
46
|
+
try {
|
|
47
|
+
const r = await fetch(`/api/email-logs?${where.join("&")}&sort=-createdAt&limit=30&page=${page}&depth=0`);
|
|
48
|
+
if (r.ok) {
|
|
49
|
+
const d = await r.json();
|
|
50
|
+
setLogs(d.docs);
|
|
51
|
+
setHasMore(d.hasNextPage);
|
|
52
|
+
setTotalDocs(d.totalDocs);
|
|
53
|
+
}
|
|
54
|
+
} catch (err) {
|
|
55
|
+
console.warn("[support] fetchLogs error:", err);
|
|
56
|
+
}
|
|
57
|
+
setLoading(false);
|
|
58
|
+
}, [dateRange, tab, search, page]);
|
|
59
|
+
React.useEffect(() => {
|
|
60
|
+
setLoading(true);
|
|
61
|
+
setPage(1);
|
|
62
|
+
}, [dateRange, tab, search]);
|
|
63
|
+
React.useEffect(() => {
|
|
64
|
+
fetchStats();
|
|
65
|
+
fetchLogs();
|
|
66
|
+
}, [fetchStats, fetchLogs]);
|
|
67
|
+
const S = {
|
|
68
|
+
page: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" },
|
|
69
|
+
statGrid: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 12, marginBottom: 20 },
|
|
70
|
+
statCard: { padding: "12px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-150)" },
|
|
71
|
+
statLabel: { fontSize: 11, color: "var(--theme-elevation-500)" },
|
|
72
|
+
statValue: { fontSize: 22, fontWeight: 700, color: "var(--theme-text)" },
|
|
73
|
+
filters: { display: "flex", gap: 12, alignItems: "center", marginBottom: 16, flexWrap: "wrap" },
|
|
74
|
+
tab: { padding: "4px 10px", borderRadius: 6, border: "none", background: "none", cursor: "pointer", fontSize: 12, color: "var(--theme-elevation-500)" },
|
|
75
|
+
tabActive: { background: "var(--theme-elevation-100)", fontWeight: 700, color: "var(--theme-text)" },
|
|
76
|
+
dateBtn: { padding: "4px 8px", borderRadius: 4, border: "1px solid var(--theme-elevation-200)", fontSize: 11, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
|
|
77
|
+
dateBtnActive: { background: "#2563eb", color: "#fff", borderColor: "#2563eb" },
|
|
78
|
+
table: { width: "100%", borderCollapse: "collapse", fontSize: 13 },
|
|
79
|
+
th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
|
|
80
|
+
td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
|
|
81
|
+
badge: { padding: "2px 6px", borderRadius: 4, fontSize: 11, fontWeight: 600 },
|
|
82
|
+
btn: { padding: "4px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 11, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" }
|
|
83
|
+
};
|
|
84
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.page, children: [
|
|
85
|
+
/* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 22, fontWeight: 700, marginBottom: 16, color: "var(--theme-text)" }, children: t("emailTracking.title") }),
|
|
86
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statGrid, children: [
|
|
87
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
|
|
88
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statLabel, children: t("emailTracking.stats.emailsSent") }),
|
|
89
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statValue, children: stats?.total ?? "--" })
|
|
90
|
+
] }),
|
|
91
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
|
|
92
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statLabel, children: t("emailTracking.stats.successRate") }),
|
|
93
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statValue, children: stats ? `${stats.successRate}%` : "--" })
|
|
94
|
+
] }),
|
|
95
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
|
|
96
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statLabel, children: t("emailTracking.stats.errors") }),
|
|
97
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statValue, children: stats?.errors ?? "--" })
|
|
98
|
+
] }),
|
|
99
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
|
|
100
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statLabel, children: t("emailTracking.stats.avgTime") }),
|
|
101
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statValue, children: stats ? `${stats.avgProcessingTime}ms` : "--" })
|
|
102
|
+
] })
|
|
103
|
+
] }),
|
|
104
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.filters, children: [
|
|
105
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 4 }, children: ["all", "success", "error", "ignored"].map((st) => /* @__PURE__ */ jsxRuntime.jsx("button", { style: { ...S.tab, ...tab === st ? S.tabActive : {} }, onClick: () => setTab(st), children: t(`emailTracking.tabs.${st === "error" ? "errors" : st}`) }, st)) }),
|
|
106
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 4 }, children: [7, 30, 90].map((v) => /* @__PURE__ */ jsxRuntime.jsxs("button", { style: { ...S.dateBtn, ...dateRange === v ? S.dateBtnActive : {} }, onClick: () => setDateRange(v), children: [
|
|
107
|
+
v,
|
|
108
|
+
"j"
|
|
109
|
+
] }, v)) }),
|
|
110
|
+
/* @__PURE__ */ jsxRuntime.jsx("input", { type: "text", placeholder: t("emailTracking.searchPlaceholder"), value: search, onChange: (e) => setSearch(e.target.value), style: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" } })
|
|
111
|
+
] }),
|
|
112
|
+
loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : logs.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("emailTracking.noLogs") }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { style: S.table, children: [
|
|
113
|
+
/* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
|
|
114
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.date") }),
|
|
115
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.recipient") }),
|
|
116
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.subject") }),
|
|
117
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.ticket") }),
|
|
118
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.status") }),
|
|
119
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("emailTracking.tableHeaders.action") }),
|
|
120
|
+
/* @__PURE__ */ jsxRuntime.jsx("th", { style: { ...S.th, textAlign: "right" }, children: t("emailTracking.tableHeaders.time") })
|
|
121
|
+
] }) }),
|
|
122
|
+
/* @__PURE__ */ jsxRuntime.jsx("tbody", { children: logs.map((log) => /* @__PURE__ */ jsxRuntime.jsxs(React__default.default.Fragment, { children: [
|
|
123
|
+
/* @__PURE__ */ jsxRuntime.jsxs("tr", { onClick: () => log.status === "error" && log.errorMessage ? setExpandedRow(expandedRow === log.id ? null : log.id) : null, style: { cursor: log.status === "error" ? "pointer" : "default" }, children: [
|
|
124
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, fontSize: 12, whiteSpace: "nowrap" }, children: fmtDate(log.createdAt) }),
|
|
125
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, maxWidth: 200, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: log.recipientEmail || "--" }),
|
|
126
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, maxWidth: 250, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: log.subject || "--" }),
|
|
127
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: log.ticketNumber || "--" }),
|
|
128
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { ...S.badge, background: STATUS_CFG[log.status]?.bg, color: STATUS_CFG[log.status]?.color }, children: STATUS_CFG[log.status]?.key ? t(STATUS_CFG[log.status].key) : log.status }) }),
|
|
129
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, fontSize: 12 }, children: log.action || "--" }),
|
|
130
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, textAlign: "right" }, children: log.processingTimeMs != null ? /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontFamily: "monospace", fontSize: 12, color: log.processingTimeMs > 2e3 ? "#dc2626" : "#16a34a" }, children: [
|
|
131
|
+
log.processingTimeMs,
|
|
132
|
+
"ms"
|
|
133
|
+
] }) : "--" })
|
|
134
|
+
] }),
|
|
135
|
+
expandedRow === log.id && log.errorMessage && /* @__PURE__ */ jsxRuntime.jsx("tr", { children: /* @__PURE__ */ jsxRuntime.jsx("td", { colSpan: 7, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "8px 12px", background: "#fef2f2", borderRadius: 6, fontSize: 12, color: "#dc2626" }, children: [
|
|
136
|
+
"Erreur",
|
|
137
|
+
log.httpStatus ? ` (HTTP ${log.httpStatus})` : "",
|
|
138
|
+
": ",
|
|
139
|
+
log.errorMessage
|
|
140
|
+
] }) }) })
|
|
141
|
+
] }, log.id)) })
|
|
142
|
+
] }),
|
|
143
|
+
totalDocs > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "center", gap: 12, marginTop: 16, alignItems: "center" }, children: [
|
|
144
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btn, onClick: () => setPage((p) => Math.max(1, p - 1)), disabled: page <= 1, children: t("common.previous") }),
|
|
145
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: [
|
|
146
|
+
t("common.page"),
|
|
147
|
+
" ",
|
|
148
|
+
page,
|
|
149
|
+
" -- ",
|
|
150
|
+
totalDocs,
|
|
151
|
+
" ",
|
|
152
|
+
t("common.results")
|
|
153
|
+
] }),
|
|
154
|
+
/* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btn, onClick: () => setPage((p) => p + 1), disabled: !hasMore, children: t("common.next") })
|
|
155
|
+
] })
|
|
156
|
+
] });
|
|
157
|
+
};
|
|
158
|
+
|
|
159
|
+
exports.EmailTrackingClient = EmailTrackingClient;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var templates = require('@payloadcms/next/templates');
|
|
7
|
+
var navigation = require('next/navigation');
|
|
8
|
+
var ErrorBoundary = require('../shared/ErrorBoundary');
|
|
9
|
+
var client = require('./client');
|
|
10
|
+
|
|
11
|
+
const EmailTrackingView = ({ initPageResult }) => {
|
|
12
|
+
const { req, visibleEntities } = initPageResult;
|
|
13
|
+
if (!req.user) {
|
|
14
|
+
navigation.redirect("/admin/login");
|
|
15
|
+
}
|
|
16
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
17
|
+
templates.DefaultTemplate,
|
|
18
|
+
{
|
|
19
|
+
i18n: req.i18n,
|
|
20
|
+
locale: initPageResult.locale,
|
|
21
|
+
params: {},
|
|
22
|
+
payload: req.payload,
|
|
23
|
+
permissions: initPageResult.permissions,
|
|
24
|
+
searchParams: {},
|
|
25
|
+
user: req.user,
|
|
26
|
+
visibleEntities,
|
|
27
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary.AdminErrorBoundary, { viewName: "EmailTrackingView", children: /* @__PURE__ */ jsxRuntime.jsx(client.EmailTrackingClient, {}) })
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
};
|
|
31
|
+
var EmailTrackingView_default = EmailTrackingView;
|
|
32
|
+
|
|
33
|
+
exports.EmailTrackingView = EmailTrackingView;
|
|
34
|
+
exports.default = EmailTrackingView_default;
|