@consilioweb/payload-support 0.6.0 → 0.6.1
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.cjs +6184 -0
- package/dist/{views/TicketingSettingsView/TicketingSettings.module.scss → views.css} +66 -138
- package/dist/views.d.cts +30 -0
- package/dist/views.d.ts +30 -0
- package/dist/views.js +6165 -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/config.js +0 -41
- 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
- package/dist/views/BillingView/client.js +0 -204
- package/dist/views/BillingView/index.js +0 -29
- package/dist/views/ChatView/client.js +0 -252
- package/dist/views/ChatView/index.js +0 -29
- package/dist/views/CrmView/client.js +0 -232
- package/dist/views/CrmView/index.js +0 -29
- package/dist/views/EmailTrackingView/client.js +0 -154
- package/dist/views/EmailTrackingView/index.js +0 -29
- package/dist/views/ImportConversationView/client.js +0 -204
- package/dist/views/ImportConversationView/index.js +0 -29
- package/dist/views/LogsView/client.js +0 -148
- package/dist/views/LogsView/index.js +0 -27
- package/dist/views/NewTicketView/client.js +0 -224
- package/dist/views/NewTicketView/index.js +0 -27
- package/dist/views/PendingEmailsView/client.js +0 -172
- package/dist/views/PendingEmailsView/index.js +0 -29
- package/dist/views/SupportDashboardView/client.js +0 -296
- package/dist/views/SupportDashboardView/index.js +0 -29
- package/dist/views/TicketDetailView/client.js +0 -844
- package/dist/views/TicketDetailView/index.js +0 -29
- package/dist/views/TicketInboxView/client.js +0 -294
- package/dist/views/TicketInboxView/index.js +0 -27
- package/dist/views/TicketingSettingsView/client.js +0 -728
- package/dist/views/TicketingSettingsView/index.js +0 -29
- package/dist/views/TimeDashboardView/client.js +0 -164
- package/dist/views/TimeDashboardView/index.js +0 -29
- package/dist/views/shared/AdminViewHeader.js +0 -67
- package/dist/views/shared/ErrorBoundary.js +0 -50
- package/dist/views/shared/Skeleton.js +0 -72
- package/dist/views/shared/adminTokens.js +0 -32
- package/dist/views/shared/config.js +0 -41
- package/dist/views/shared/index.js +0 -6
|
@@ -1,287 +0,0 @@
|
|
|
1
|
-
// TimeDashboard — Clean admin aesthetic, 2026
|
|
2
|
-
|
|
3
|
-
.page {
|
|
4
|
-
max-width: 1920px;
|
|
5
|
-
margin: 0 auto;
|
|
6
|
-
padding: 20px 24px 60px;
|
|
7
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', system-ui, sans-serif;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
// Header
|
|
11
|
-
.header {
|
|
12
|
-
display: flex;
|
|
13
|
-
align-items: flex-start;
|
|
14
|
-
justify-content: space-between;
|
|
15
|
-
margin-bottom: 20px;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.headerLeft {
|
|
19
|
-
display: flex;
|
|
20
|
-
flex-direction: column;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.title {
|
|
24
|
-
font-size: 24px;
|
|
25
|
-
font-weight: 800;
|
|
26
|
-
color: var(--theme-text);
|
|
27
|
-
margin: 0;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.subtitle {
|
|
31
|
-
color: var(--theme-elevation-500);
|
|
32
|
-
margin: 4px 0 0;
|
|
33
|
-
font-size: 14px;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
.newEntryBtn {
|
|
37
|
-
padding: 8px 18px;
|
|
38
|
-
border-radius: 8px;
|
|
39
|
-
border: 1px solid var(--theme-elevation-200);
|
|
40
|
-
background: #2563eb;
|
|
41
|
-
color: #fff;
|
|
42
|
-
font-size: 13px;
|
|
43
|
-
font-weight: 600;
|
|
44
|
-
cursor: pointer;
|
|
45
|
-
text-decoration: none;
|
|
46
|
-
white-space: nowrap;
|
|
47
|
-
transition: opacity 100ms;
|
|
48
|
-
|
|
49
|
-
&:hover { opacity: 0.9; }
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
// Filters
|
|
53
|
-
.filters {
|
|
54
|
-
padding: 14px;
|
|
55
|
-
border: 1px solid var(--theme-elevation-300);
|
|
56
|
-
border-radius: 8px;
|
|
57
|
-
background: var(--theme-elevation-100);
|
|
58
|
-
margin-bottom: 16px;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
.quickPeriod {
|
|
62
|
-
display: flex;
|
|
63
|
-
gap: 8px;
|
|
64
|
-
margin-bottom: 10px;
|
|
65
|
-
flex-wrap: wrap;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
.filterRow {
|
|
69
|
-
display: flex;
|
|
70
|
-
gap: 12px;
|
|
71
|
-
align-items: flex-end;
|
|
72
|
-
flex-wrap: wrap;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.fieldGroup {
|
|
76
|
-
display: flex;
|
|
77
|
-
flex-direction: column;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
.label {
|
|
81
|
-
font-size: 11px;
|
|
82
|
-
font-weight: 700;
|
|
83
|
-
color: var(--theme-elevation-500);
|
|
84
|
-
margin-bottom: 3px;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
.input {
|
|
88
|
-
padding: 6px 10px;
|
|
89
|
-
border-radius: 6px;
|
|
90
|
-
border: 1px solid var(--theme-elevation-300);
|
|
91
|
-
font-size: 13px;
|
|
92
|
-
background: var(--theme-elevation-100);
|
|
93
|
-
color: var(--theme-text);
|
|
94
|
-
transition: border-color 150ms, box-shadow 150ms;
|
|
95
|
-
|
|
96
|
-
&:focus {
|
|
97
|
-
outline: none;
|
|
98
|
-
border-color: #2563eb;
|
|
99
|
-
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.08);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
.select {
|
|
104
|
-
composes: input;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
// Buttons
|
|
108
|
-
.btn {
|
|
109
|
-
padding: 6px 12px;
|
|
110
|
-
border-radius: 6px;
|
|
111
|
-
border: 1px solid var(--theme-elevation-300);
|
|
112
|
-
color: #fff;
|
|
113
|
-
font-weight: 600;
|
|
114
|
-
font-size: 12px;
|
|
115
|
-
cursor: pointer;
|
|
116
|
-
white-space: nowrap;
|
|
117
|
-
transition: opacity 100ms;
|
|
118
|
-
|
|
119
|
-
&:hover { opacity: 0.9; }
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
.btnPrimary { composes: btn; background: #2563eb; }
|
|
123
|
-
.btnSecondary { composes: btn; background: var(--theme-elevation-100); color: var(--theme-text); }
|
|
124
|
-
.btnAmber { composes: btn; background: #d97706; }
|
|
125
|
-
|
|
126
|
-
// KPI cards
|
|
127
|
-
.kpis {
|
|
128
|
-
display: flex;
|
|
129
|
-
gap: 12px;
|
|
130
|
-
margin-bottom: 16px;
|
|
131
|
-
flex-wrap: wrap;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
.kpiCard {
|
|
135
|
-
padding: 10px 16px;
|
|
136
|
-
border-radius: 8px;
|
|
137
|
-
background: var(--theme-elevation-100);
|
|
138
|
-
border: 1px solid var(--theme-elevation-300);
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.kpiCardPrimary { composes: kpiCard; border-color: #2563eb; }
|
|
142
|
-
.kpiCardAmber { composes: kpiCard; border-color: #d97706; }
|
|
143
|
-
.kpiCardOrange { composes: kpiCard; border-color: #ea580c; }
|
|
144
|
-
|
|
145
|
-
.kpiLabel {
|
|
146
|
-
font-size: 10px;
|
|
147
|
-
font-weight: 700;
|
|
148
|
-
text-transform: uppercase;
|
|
149
|
-
color: var(--theme-elevation-500);
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
.kpiValue {
|
|
153
|
-
font-size: 24px;
|
|
154
|
-
font-weight: 600;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
.kpiPrimary { composes: kpiValue; color: #2563eb; }
|
|
158
|
-
.kpiAmber { composes: kpiValue; color: #d97706; }
|
|
159
|
-
.kpiOrange { composes: kpiValue; color: #ea580c; }
|
|
160
|
-
|
|
161
|
-
// Chart
|
|
162
|
-
.chartWrap {
|
|
163
|
-
border: 1px solid #2563eb;
|
|
164
|
-
border-radius: 10px;
|
|
165
|
-
overflow: hidden;
|
|
166
|
-
margin-bottom: 16px;
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
.chartHeader {
|
|
170
|
-
padding: 8px 14px;
|
|
171
|
-
font-size: 12px;
|
|
172
|
-
font-weight: 600;
|
|
173
|
-
text-transform: uppercase;
|
|
174
|
-
background: var(--theme-elevation-50);
|
|
175
|
-
border-bottom: 1px solid var(--theme-elevation-300);
|
|
176
|
-
color: var(--theme-text);
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
.chartBars {
|
|
180
|
-
padding: 14px;
|
|
181
|
-
display: flex;
|
|
182
|
-
align-items: flex-end;
|
|
183
|
-
gap: 2px;
|
|
184
|
-
height: 80px;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.chartBar {
|
|
188
|
-
flex: 1;
|
|
189
|
-
background: #2563eb;
|
|
190
|
-
border-radius: 2px 2px 0 0;
|
|
191
|
-
min-width: 4px;
|
|
192
|
-
transition: opacity 150ms;
|
|
193
|
-
|
|
194
|
-
&:hover { opacity: 0.8; }
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
// Empty state
|
|
198
|
-
.empty {
|
|
199
|
-
padding: 40px;
|
|
200
|
-
text-align: center;
|
|
201
|
-
border: 1px solid var(--theme-elevation-300);
|
|
202
|
-
border-radius: 8px;
|
|
203
|
-
background: var(--theme-elevation-100);
|
|
204
|
-
color: var(--theme-elevation-500);
|
|
205
|
-
font-size: 14px;
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
// Group cards
|
|
209
|
-
.groupCard {
|
|
210
|
-
border: 1px solid var(--theme-elevation-300);
|
|
211
|
-
border-radius: 8px;
|
|
212
|
-
overflow: hidden;
|
|
213
|
-
margin-bottom: 10px;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
.groupHeader {
|
|
217
|
-
display: flex;
|
|
218
|
-
justify-content: space-between;
|
|
219
|
-
align-items: center;
|
|
220
|
-
padding: 8px 14px;
|
|
221
|
-
background: var(--theme-elevation-50);
|
|
222
|
-
border-bottom: 1px solid var(--theme-elevation-300);
|
|
223
|
-
}
|
|
224
|
-
|
|
225
|
-
.groupLabel {
|
|
226
|
-
font-weight: 600;
|
|
227
|
-
font-size: 13px;
|
|
228
|
-
color: var(--theme-text);
|
|
229
|
-
}
|
|
230
|
-
|
|
231
|
-
.groupTotal {
|
|
232
|
-
font-weight: 600;
|
|
233
|
-
font-size: 14px;
|
|
234
|
-
color: #2563eb;
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
// Entry table
|
|
238
|
-
.table {
|
|
239
|
-
width: 100%;
|
|
240
|
-
border-collapse: collapse;
|
|
241
|
-
font-size: 13px;
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
.entryRow {
|
|
245
|
-
border-bottom: 1px solid var(--theme-elevation-200);
|
|
246
|
-
|
|
247
|
-
&:last-child { border-bottom: none; }
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
.tdTicket {
|
|
251
|
-
padding: 6px 14px;
|
|
252
|
-
font-weight: 700;
|
|
253
|
-
font-family: 'SF Mono', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace;
|
|
254
|
-
font-size: 11px;
|
|
255
|
-
width: 80px;
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
-
.tdSubject {
|
|
259
|
-
padding: 6px 8px;
|
|
260
|
-
color: var(--theme-elevation-500);
|
|
261
|
-
font-size: 12px;
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
.tdDescription {
|
|
265
|
-
padding: 6px 8px;
|
|
266
|
-
color: var(--theme-elevation-500);
|
|
267
|
-
font-size: 12px;
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
.tdDuration {
|
|
271
|
-
padding: 6px 14px;
|
|
272
|
-
text-align: right;
|
|
273
|
-
font-weight: 600;
|
|
274
|
-
color: #2563eb;
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
.ticketLink {
|
|
278
|
-
color: var(--theme-text);
|
|
279
|
-
text-decoration: underline;
|
|
280
|
-
|
|
281
|
-
&:hover { color: #2563eb; }
|
|
282
|
-
}
|
|
283
|
-
|
|
284
|
-
// Loading
|
|
285
|
-
.loading {
|
|
286
|
-
padding: 40px;
|
|
287
|
-
}
|
package/dist/styles/_tokens.scss
DELETED
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
// Design tokens — based on Payload CMS CSS variables
|
|
2
|
-
$text: var(--theme-text);
|
|
3
|
-
$text-secondary: var(--theme-elevation-500);
|
|
4
|
-
$text-muted: var(--theme-elevation-400);
|
|
5
|
-
$bg: var(--theme-elevation-50);
|
|
6
|
-
$bg-card: var(--theme-elevation-100);
|
|
7
|
-
$bg-surface: var(--theme-elevation-0);
|
|
8
|
-
$border: var(--theme-elevation-300);
|
|
9
|
-
$border-light: var(--theme-elevation-200);
|
|
10
|
-
$radius: 8px;
|
|
11
|
-
$radius-sm: 6px;
|
|
12
|
-
$radius-lg: 12px;
|
|
13
|
-
$transition: 150ms ease;
|
|
14
|
-
|
|
15
|
-
// Semantic colors
|
|
16
|
-
$blue: #2563eb;
|
|
17
|
-
$green: #16a34a;
|
|
18
|
-
$amber: #d97706;
|
|
19
|
-
$orange: #ea580c;
|
|
20
|
-
$red: #dc2626;
|
|
21
|
-
$purple: #7c3aed;
|
|
22
|
-
$cyan: #0891b2;
|
|
23
|
-
|
|
24
|
-
// Mixins
|
|
25
|
-
@mixin btn($bg-color: $blue) {
|
|
26
|
-
padding: 7px 14px;
|
|
27
|
-
border-radius: $radius-sm;
|
|
28
|
-
border: 1px solid $border;
|
|
29
|
-
background: $bg-color;
|
|
30
|
-
color: #fff;
|
|
31
|
-
font-weight: 600;
|
|
32
|
-
font-size: 13px;
|
|
33
|
-
cursor: pointer;
|
|
34
|
-
transition: opacity $transition;
|
|
35
|
-
white-space: nowrap;
|
|
36
|
-
&:hover { opacity: 0.85; }
|
|
37
|
-
&:disabled { opacity: 0.45; cursor: not-allowed; }
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
@mixin ghost-btn($color: $text-secondary) {
|
|
41
|
-
@include btn(transparent);
|
|
42
|
-
color: $color;
|
|
43
|
-
&:hover { background: $bg-card; }
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
@mixin badge($bg-color, $text-color) {
|
|
47
|
-
display: inline-flex;
|
|
48
|
-
align-items: center;
|
|
49
|
-
padding: 2px 8px;
|
|
50
|
-
border-radius: 4px;
|
|
51
|
-
font-size: 11px;
|
|
52
|
-
font-weight: 600;
|
|
53
|
-
background: $bg-color;
|
|
54
|
-
color: $text-color;
|
|
55
|
-
white-space: nowrap;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
@mixin card {
|
|
59
|
-
padding: 14px 18px;
|
|
60
|
-
border-radius: $radius;
|
|
61
|
-
border: 1px solid $border;
|
|
62
|
-
background: $bg-card;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
@mixin input {
|
|
66
|
-
padding: 8px 12px;
|
|
67
|
-
border-radius: $radius-sm;
|
|
68
|
-
border: 1px solid $border;
|
|
69
|
-
background: $bg-surface;
|
|
70
|
-
color: $text;
|
|
71
|
-
font-size: 13px;
|
|
72
|
-
transition: border-color $transition;
|
|
73
|
-
&:focus {
|
|
74
|
-
outline: none;
|
|
75
|
-
border-color: $blue;
|
|
76
|
-
box-shadow: 0 0 0 2px rgba($blue, 0.1);
|
|
77
|
-
}
|
|
78
|
-
}
|
|
@@ -1,204 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
3
|
-
import React, { useState, useCallback } from 'react';
|
|
4
|
-
import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
|
|
5
|
-
|
|
6
|
-
function formatDuration(minutes) {
|
|
7
|
-
const h = Math.floor(minutes / 60);
|
|
8
|
-
const m = minutes % 60;
|
|
9
|
-
if (h === 0) return `${m}min`;
|
|
10
|
-
if (m === 0) return `${h}h`;
|
|
11
|
-
return `${h}h ${m}min`;
|
|
12
|
-
}
|
|
13
|
-
function formatAmount(minutes, rate) {
|
|
14
|
-
return (minutes / 60 * rate).toFixed(2);
|
|
15
|
-
}
|
|
16
|
-
function getMonthRange(offset) {
|
|
17
|
-
const now = /* @__PURE__ */ new Date();
|
|
18
|
-
const start = new Date(now.getFullYear(), now.getMonth() + offset, 1);
|
|
19
|
-
const end = new Date(now.getFullYear(), now.getMonth() + offset + 1, 0);
|
|
20
|
-
return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
|
|
21
|
-
}
|
|
22
|
-
function getQuarterRange(offset) {
|
|
23
|
-
const now = /* @__PURE__ */ new Date();
|
|
24
|
-
const q = Math.floor(now.getMonth() / 3) + offset;
|
|
25
|
-
const start = new Date(now.getFullYear(), q * 3, 1);
|
|
26
|
-
const end = new Date(now.getFullYear(), q * 3 + 3, 0);
|
|
27
|
-
return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
|
|
28
|
-
}
|
|
29
|
-
const BillingClient = () => {
|
|
30
|
-
const { t } = useTranslation();
|
|
31
|
-
const [from, setFrom] = useState(() => getMonthRange(0).from);
|
|
32
|
-
const [to, setTo] = useState(() => getMonthRange(0).to);
|
|
33
|
-
const [projectId, setProjectId] = useState("");
|
|
34
|
-
const [rate, setRate] = useState(60);
|
|
35
|
-
const [data, setData] = useState(null);
|
|
36
|
-
const [loading, setLoading] = useState(false);
|
|
37
|
-
const [projects, setProjects] = useState([]);
|
|
38
|
-
const [projectsLoaded, setProjectsLoaded] = useState(false);
|
|
39
|
-
const [copied, setCopied] = useState(false);
|
|
40
|
-
const loadProjects = useCallback(async () => {
|
|
41
|
-
if (projectsLoaded) return;
|
|
42
|
-
try {
|
|
43
|
-
const res = await fetch("/api/projects?limit=100&depth=0&sort=name");
|
|
44
|
-
if (res.ok) {
|
|
45
|
-
const json = await res.json();
|
|
46
|
-
setProjects(json.docs?.map((p) => ({ id: p.id, name: p.name })) || []);
|
|
47
|
-
}
|
|
48
|
-
} catch (err) {
|
|
49
|
-
console.warn("[support] loadProjects error:", err);
|
|
50
|
-
}
|
|
51
|
-
setProjectsLoaded(true);
|
|
52
|
-
}, [projectsLoaded]);
|
|
53
|
-
React.useEffect(() => {
|
|
54
|
-
loadProjects();
|
|
55
|
-
}, [loadProjects]);
|
|
56
|
-
const fetchBilling = useCallback(async () => {
|
|
57
|
-
setLoading(true);
|
|
58
|
-
try {
|
|
59
|
-
const params = new URLSearchParams({ from, to });
|
|
60
|
-
if (projectId) params.set("projectId", projectId);
|
|
61
|
-
const res = await fetch(`/api/support/billing?${params}`);
|
|
62
|
-
if (res.ok) setData(await res.json());
|
|
63
|
-
} catch (err) {
|
|
64
|
-
console.warn("[support] fetchBilling error:", err);
|
|
65
|
-
}
|
|
66
|
-
setLoading(false);
|
|
67
|
-
}, [from, to, projectId]);
|
|
68
|
-
const setPeriod = (range) => {
|
|
69
|
-
setFrom(range.from);
|
|
70
|
-
setTo(range.to);
|
|
71
|
-
};
|
|
72
|
-
const copyRecap = useCallback(() => {
|
|
73
|
-
if (!data) return;
|
|
74
|
-
const lines = [`PRE-FACTURATION -- Du ${from} au ${to}`, `Taux horaire : ${rate} EUR/h`, "=".repeat(50)];
|
|
75
|
-
for (const group of data.groups) {
|
|
76
|
-
lines.push("", `PROJET : ${group.project?.name || "Sans projet"}`);
|
|
77
|
-
if (group.client?.company) lines.push(`Client : ${group.client.company}`);
|
|
78
|
-
for (const ticket of group.tickets) {
|
|
79
|
-
lines.push(` ${ticket.ticketNumber} -- ${ticket.subject}`);
|
|
80
|
-
for (const entry of ticket.entries) lines.push(` ${entry.date} | ${formatDuration(entry.duration)} | ${entry.description || "-"}`);
|
|
81
|
-
lines.push(` Sous-total : ${formatDuration(ticket.totalMinutes)} = ${formatAmount(ticket.totalMinutes, rate)} EUR`);
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
lines.push("", "=".repeat(50), `TOTAL : ${formatDuration(data.grandTotalMinutes)} = ${formatAmount(data.grandTotalMinutes, rate)} EUR`);
|
|
85
|
-
navigator.clipboard.writeText(lines.join("\n"));
|
|
86
|
-
setCopied(true);
|
|
87
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
88
|
-
}, [data, from, to, rate]);
|
|
89
|
-
const S = {
|
|
90
|
-
page: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" },
|
|
91
|
-
filters: { marginBottom: 20 },
|
|
92
|
-
quickPeriod: { display: "flex", gap: 6, marginBottom: 8 },
|
|
93
|
-
btn: { padding: "6px 12px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
|
|
94
|
-
btnPrimary: { padding: "6px 12px", borderRadius: 6, border: "none", fontSize: 12, cursor: "pointer", background: "#2563eb", color: "#fff", fontWeight: 600 },
|
|
95
|
-
filterRow: { display: "flex", gap: 12, alignItems: "flex-end", flexWrap: "wrap" },
|
|
96
|
-
fieldGroup: { display: "flex", flexDirection: "column", gap: 4 },
|
|
97
|
-
label: { fontSize: 11, fontWeight: 600, color: "var(--theme-elevation-500)" },
|
|
98
|
-
input: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
|
|
99
|
-
select: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
|
|
100
|
-
groupCard: { marginBottom: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", overflow: "hidden" },
|
|
101
|
-
groupHeader: { display: "flex", justifyContent: "space-between", padding: "12px 16px", background: "var(--theme-elevation-50)", borderBottom: "1px solid var(--theme-elevation-150)" },
|
|
102
|
-
table: { width: "100%", borderCollapse: "collapse", fontSize: 12 },
|
|
103
|
-
th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
|
|
104
|
-
td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
|
|
105
|
-
grandTotal: { padding: 16, borderRadius: 10, border: "2px solid #2563eb", display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 16 }
|
|
106
|
-
};
|
|
107
|
-
return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
|
|
108
|
-
/* @__PURE__ */ jsxs("div", { style: { marginBottom: 16 }, children: [
|
|
109
|
-
/* @__PURE__ */ jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0 }, children: t("billing.title") }),
|
|
110
|
-
/* @__PURE__ */ jsx("p", { style: { fontSize: 13, color: "var(--theme-elevation-500)", margin: "4px 0 0" }, children: t("billing.subtitle") })
|
|
111
|
-
] }),
|
|
112
|
-
/* @__PURE__ */ jsxs("div", { style: S.filters, children: [
|
|
113
|
-
/* @__PURE__ */ jsxs("div", { style: S.quickPeriod, children: [
|
|
114
|
-
/* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: () => setPeriod(getMonthRange(0)), children: t("billing.filters.thisMonth") }),
|
|
115
|
-
/* @__PURE__ */ jsx("button", { style: S.btn, onClick: () => setPeriod(getMonthRange(-1)), children: t("billing.filters.lastMonth") }),
|
|
116
|
-
/* @__PURE__ */ jsx("button", { style: S.btn, onClick: () => setPeriod(getQuarterRange(0)), children: t("billing.filters.thisQuarter") })
|
|
117
|
-
] }),
|
|
118
|
-
/* @__PURE__ */ jsxs("div", { style: S.filterRow, children: [
|
|
119
|
-
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
120
|
-
/* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.from") }),
|
|
121
|
-
/* @__PURE__ */ jsx("input", { type: "date", value: from, onChange: (e) => setFrom(e.target.value), style: S.input })
|
|
122
|
-
] }),
|
|
123
|
-
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
124
|
-
/* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.to") }),
|
|
125
|
-
/* @__PURE__ */ jsx("input", { type: "date", value: to, onChange: (e) => setTo(e.target.value), style: S.input })
|
|
126
|
-
] }),
|
|
127
|
-
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
128
|
-
/* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.project") }),
|
|
129
|
-
/* @__PURE__ */ jsxs("select", { value: projectId, onChange: (e) => setProjectId(e.target.value), style: S.select, children: [
|
|
130
|
-
/* @__PURE__ */ jsx("option", { value: "", children: t("common.all") }),
|
|
131
|
-
projects.map((p) => /* @__PURE__ */ jsx("option", { value: p.id, children: p.name }, p.id))
|
|
132
|
-
] })
|
|
133
|
-
] }),
|
|
134
|
-
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
135
|
-
/* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.hourlyRate") }),
|
|
136
|
-
/* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [
|
|
137
|
-
/* @__PURE__ */ jsx("input", { type: "number", value: rate, onChange: (e) => setRate(Number(e.target.value)), style: { ...S.input, width: 70 }, min: 0 }),
|
|
138
|
-
/* @__PURE__ */ jsx("span", { style: { fontSize: 11 }, children: t("billing.filters.rateUnit") })
|
|
139
|
-
] })
|
|
140
|
-
] }),
|
|
141
|
-
/* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: fetchBilling, disabled: loading, children: loading ? t("billing.filters.loading") : t("billing.filters.load") })
|
|
142
|
-
] })
|
|
143
|
-
] }),
|
|
144
|
-
data && /* @__PURE__ */ jsx(Fragment, { children: data.groups.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("billing.empty") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
145
|
-
data.groups.map((group, gi) => /* @__PURE__ */ jsxs("div", { style: S.groupCard, children: [
|
|
146
|
-
/* @__PURE__ */ jsxs("div", { style: S.groupHeader, children: [
|
|
147
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
148
|
-
/* @__PURE__ */ jsx("span", { style: { fontWeight: 700 }, children: group.project?.name || "Sans projet" }),
|
|
149
|
-
group.client?.company && /* @__PURE__ */ jsxs("span", { style: { color: "var(--theme-elevation-500)" }, children: [
|
|
150
|
-
" -- ",
|
|
151
|
-
group.client.company
|
|
152
|
-
] })
|
|
153
|
-
] }),
|
|
154
|
-
/* @__PURE__ */ jsxs("div", { style: { textAlign: "right" }, children: [
|
|
155
|
-
/* @__PURE__ */ jsx("div", { style: { fontWeight: 700 }, children: formatDuration(group.totalMinutes) }),
|
|
156
|
-
/* @__PURE__ */ jsxs("div", { style: { fontSize: 12, color: "#2563eb", fontWeight: 600 }, children: [
|
|
157
|
-
formatAmount(group.totalMinutes, rate),
|
|
158
|
-
" EUR"
|
|
159
|
-
] })
|
|
160
|
-
] })
|
|
161
|
-
] }),
|
|
162
|
-
/* @__PURE__ */ jsxs("table", { style: S.table, children: [
|
|
163
|
-
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
164
|
-
/* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.ticketNumber") }),
|
|
165
|
-
/* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.subject") }),
|
|
166
|
-
/* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.date") }),
|
|
167
|
-
/* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.duration") }),
|
|
168
|
-
/* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.description") }),
|
|
169
|
-
/* @__PURE__ */ jsx("th", { style: { ...S.th, textAlign: "right" }, children: t("billing.table.amount") })
|
|
170
|
-
] }) }),
|
|
171
|
-
/* @__PURE__ */ jsx("tbody", { children: group.tickets.map((ticket) => ticket.entries.map((entry, ei) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
172
|
-
ei === 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
173
|
-
/* @__PURE__ */ jsx("td", { style: { ...S.td, fontWeight: 600 }, rowSpan: ticket.entries.length, children: /* @__PURE__ */ jsx("a", { href: `/admin/support/ticket?id=${ticket.id}`, style: { color: "#2563eb", textDecoration: "none" }, children: ticket.ticketNumber }) }),
|
|
174
|
-
/* @__PURE__ */ jsx("td", { style: S.td, rowSpan: ticket.entries.length, children: ticket.subject })
|
|
175
|
-
] }),
|
|
176
|
-
/* @__PURE__ */ jsx("td", { style: S.td, children: entry.date }),
|
|
177
|
-
/* @__PURE__ */ jsx("td", { style: S.td, children: formatDuration(entry.duration) }),
|
|
178
|
-
/* @__PURE__ */ jsx("td", { style: S.td, children: entry.description || "-" }),
|
|
179
|
-
/* @__PURE__ */ jsxs("td", { style: { ...S.td, textAlign: "right", fontWeight: 600 }, children: [
|
|
180
|
-
formatAmount(entry.duration, rate),
|
|
181
|
-
" EUR"
|
|
182
|
-
] })
|
|
183
|
-
] }, `${ticket.id}-${ei}`))) })
|
|
184
|
-
] })
|
|
185
|
-
] }, gi)),
|
|
186
|
-
/* @__PURE__ */ jsxs("div", { style: S.grandTotal, children: [
|
|
187
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
188
|
-
/* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: t("billing.totals.billableTicketsPlural", { count: String(data.groups.reduce((s2, g) => s2 + g.tickets.length, 0)) }) }),
|
|
189
|
-
/* @__PURE__ */ jsxs("div", { style: { fontSize: 18, fontWeight: 700 }, children: [
|
|
190
|
-
t("billing.totals.total"),
|
|
191
|
-
" : ",
|
|
192
|
-
formatDuration(data.grandTotalMinutes),
|
|
193
|
-
" = ",
|
|
194
|
-
formatAmount(data.grandTotalMinutes, rate),
|
|
195
|
-
" EUR"
|
|
196
|
-
] })
|
|
197
|
-
] }),
|
|
198
|
-
/* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: copyRecap, children: copied ? t("billing.totals.copiedRecap") : t("billing.totals.copyRecap") })
|
|
199
|
-
] })
|
|
200
|
-
] }) })
|
|
201
|
-
] });
|
|
202
|
-
};
|
|
203
|
-
|
|
204
|
-
export { BillingClient };
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { DefaultTemplate } from '@payloadcms/next/templates';
|
|
3
|
-
import { redirect } from 'next/navigation';
|
|
4
|
-
import { AdminErrorBoundary } from '../shared/ErrorBoundary';
|
|
5
|
-
import { BillingClient } from './client';
|
|
6
|
-
|
|
7
|
-
const BillingView = ({ initPageResult }) => {
|
|
8
|
-
const { req, visibleEntities } = initPageResult;
|
|
9
|
-
if (!req.user) {
|
|
10
|
-
redirect("/admin/login");
|
|
11
|
-
}
|
|
12
|
-
return /* @__PURE__ */ jsx(
|
|
13
|
-
DefaultTemplate,
|
|
14
|
-
{
|
|
15
|
-
i18n: req.i18n,
|
|
16
|
-
locale: initPageResult.locale,
|
|
17
|
-
params: {},
|
|
18
|
-
payload: req.payload,
|
|
19
|
-
permissions: initPageResult.permissions,
|
|
20
|
-
searchParams: {},
|
|
21
|
-
user: req.user,
|
|
22
|
-
visibleEntities,
|
|
23
|
-
children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "BillingView", children: /* @__PURE__ */ jsx(BillingClient, {}) })
|
|
24
|
-
}
|
|
25
|
-
);
|
|
26
|
-
};
|
|
27
|
-
var BillingView_default = BillingView;
|
|
28
|
-
|
|
29
|
-
export { BillingView, BillingView_default as default };
|