@easyflow/javascript-sdk 2.1.8 → 2.1.10

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.
Files changed (94) hide show
  1. package/README.md +87 -7
  2. package/dist/index.d.ts +421 -0
  3. package/package.json +19 -6
  4. package/.babelrc +0 -5
  5. package/.github/workflows/deploy-sdk-cf.yml +0 -49
  6. package/.github/workflows/release-sdk-cdn.yml +0 -144
  7. package/.github/workflows/release-sdk.yml +0 -112
  8. package/.prettierrc +0 -6
  9. package/CDN-DEPLOYMENT.md +0 -175
  10. package/DEMO.md +0 -258
  11. package/DEPLOYMENT.md +0 -224
  12. package/INTEGRATION-GUIDE.md +0 -521
  13. package/coverage/base.css +0 -224
  14. package/coverage/block-navigation.js +0 -87
  15. package/coverage/easyflow-javascript-sdk/index.html +0 -116
  16. package/coverage/easyflow-javascript-sdk/libs/constants.mjs.html +0 -268
  17. package/coverage/easyflow-javascript-sdk/libs/errors.mjs.html +0 -271
  18. package/coverage/easyflow-javascript-sdk/libs/exception-handler.mjs.html +0 -148
  19. package/coverage/easyflow-javascript-sdk/libs/fingerprint.mjs.html +0 -895
  20. package/coverage/easyflow-javascript-sdk/libs/http.mjs.html +0 -502
  21. package/coverage/easyflow-javascript-sdk/libs/index.html +0 -266
  22. package/coverage/easyflow-javascript-sdk/libs/logger.mjs.html +0 -568
  23. package/coverage/easyflow-javascript-sdk/libs/sanitizer.mjs.html +0 -1099
  24. package/coverage/easyflow-javascript-sdk/libs/security.mjs.html +0 -733
  25. package/coverage/easyflow-javascript-sdk/libs/types.mjs.html +0 -508
  26. package/coverage/easyflow-javascript-sdk/libs/utils.mjs.html +0 -379
  27. package/coverage/easyflow-javascript-sdk/libs/validator.mjs.html +0 -2623
  28. package/coverage/easyflow-javascript-sdk/sdk.mjs.html +0 -2434
  29. package/coverage/favicon.png +0 -0
  30. package/coverage/index.html +0 -131
  31. package/coverage/lcov-report/base.css +0 -224
  32. package/coverage/lcov-report/block-navigation.js +0 -87
  33. package/coverage/lcov-report/easyflow-javascript-sdk/index.html +0 -116
  34. package/coverage/lcov-report/easyflow-javascript-sdk/libs/constants.mjs.html +0 -268
  35. package/coverage/lcov-report/easyflow-javascript-sdk/libs/errors.mjs.html +0 -271
  36. package/coverage/lcov-report/easyflow-javascript-sdk/libs/exception-handler.mjs.html +0 -148
  37. package/coverage/lcov-report/easyflow-javascript-sdk/libs/fingerprint.mjs.html +0 -895
  38. package/coverage/lcov-report/easyflow-javascript-sdk/libs/http.mjs.html +0 -502
  39. package/coverage/lcov-report/easyflow-javascript-sdk/libs/index.html +0 -266
  40. package/coverage/lcov-report/easyflow-javascript-sdk/libs/logger.mjs.html +0 -568
  41. package/coverage/lcov-report/easyflow-javascript-sdk/libs/sanitizer.mjs.html +0 -1099
  42. package/coverage/lcov-report/easyflow-javascript-sdk/libs/security.mjs.html +0 -733
  43. package/coverage/lcov-report/easyflow-javascript-sdk/libs/types.mjs.html +0 -508
  44. package/coverage/lcov-report/easyflow-javascript-sdk/libs/utils.mjs.html +0 -379
  45. package/coverage/lcov-report/easyflow-javascript-sdk/libs/validator.mjs.html +0 -2623
  46. package/coverage/lcov-report/easyflow-javascript-sdk/sdk.mjs.html +0 -2434
  47. package/coverage/lcov-report/favicon.png +0 -0
  48. package/coverage/lcov-report/index.html +0 -131
  49. package/coverage/lcov-report/prettify.css +0 -1
  50. package/coverage/lcov-report/prettify.js +0 -2
  51. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  52. package/coverage/lcov-report/sorter.js +0 -196
  53. package/coverage/lcov.info +0 -1429
  54. package/coverage/prettify.css +0 -1
  55. package/coverage/prettify.js +0 -2
  56. package/coverage/sort-arrow-sprite.png +0 -0
  57. package/coverage/sorter.js +0 -196
  58. package/dist/435.easyflow-sdk.min.js +0 -1
  59. package/dist/easyflow-sdk.min.js +0 -1
  60. package/dist/easyflow-sdk.min.js.LICENSE.txt +0 -1
  61. package/dist/index.html +0 -756
  62. package/docs/index.html +0 -775
  63. package/examples/lovable-integration.html +0 -410
  64. package/index.html +0 -981
  65. package/jest.config.js +0 -37
  66. package/jsdoc.json +0 -42
  67. package/libs/auto-integration.mjs +0 -333
  68. package/libs/constants.mjs +0 -61
  69. package/libs/constants.spec.js +0 -198
  70. package/libs/errors.mjs +0 -62
  71. package/libs/errors.spec.js +0 -178
  72. package/libs/exception-handler.mjs +0 -21
  73. package/libs/exception-handler.spec.js +0 -237
  74. package/libs/fingerprint.mjs +0 -270
  75. package/libs/http.mjs +0 -163
  76. package/libs/http.spec.js +0 -427
  77. package/libs/integration-wrapper.mjs +0 -285
  78. package/libs/logger.mjs +0 -161
  79. package/libs/logger.spec.js +0 -389
  80. package/libs/sanitizer.mjs +0 -340
  81. package/libs/sanitizer.spec.js +0 -583
  82. package/libs/security.mjs +0 -217
  83. package/libs/types.mjs +0 -141
  84. package/libs/utils.mjs +0 -368
  85. package/libs/utils.spec.js +0 -231
  86. package/libs/validator.mjs +0 -952
  87. package/libs/validator.spec.js +0 -615
  88. package/mocks/offer.mock.js +0 -77
  89. package/scripts/publish-npm.sh +0 -82
  90. package/sdk.mjs +0 -945
  91. package/sdk.spec.js +0 -796
  92. package/test-setup.cjs +0 -211
  93. package/test.html +0 -154
  94. package/webpack.config.cjs +0 -41
package/index.html DELETED
@@ -1,981 +0,0 @@
1
- <!doctype html>
2
- <html lang="pt-BR">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
- <title>Easyflow SDK - Test Interface</title>
7
- <style>
8
- * {
9
- margin: 0;
10
- padding: 0;
11
- box-sizing: border-box;
12
- }
13
-
14
- body {
15
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
16
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
17
- min-height: 100vh;
18
- padding: 20px;
19
- }
20
-
21
- .container {
22
- max-width: 1200px;
23
- margin: 0 auto;
24
- background: white;
25
- border-radius: 12px;
26
- box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
27
- overflow: hidden;
28
- }
29
-
30
- .header {
31
- background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
32
- color: white;
33
- padding: 30px;
34
- text-align: center;
35
- }
36
-
37
- .header h1 {
38
- font-size: 2.5rem;
39
- margin-bottom: 10px;
40
- }
41
-
42
- .header p {
43
- opacity: 0.9;
44
- font-size: 1.1rem;
45
- }
46
-
47
- .content {
48
- padding: 30px;
49
- }
50
-
51
- .config-section {
52
- background: #f8f9fa;
53
- padding: 20px;
54
- border-radius: 8px;
55
- margin-bottom: 30px;
56
- }
57
-
58
- .config-section h3 {
59
- color: #2c3e50;
60
- margin-bottom: 15px;
61
- font-size: 1.3rem;
62
- }
63
-
64
- .form-group {
65
- margin-bottom: 15px;
66
- }
67
-
68
- .form-group label {
69
- display: block;
70
- margin-bottom: 5px;
71
- font-weight: 600;
72
- color: #2c3e50;
73
- }
74
-
75
- .form-group input,
76
- .form-group select,
77
- .form-group textarea {
78
- width: 100%;
79
- padding: 12px;
80
- border: 2px solid #e9ecef;
81
- border-radius: 6px;
82
- font-size: 14px;
83
- transition: border-color 0.3s;
84
- }
85
-
86
- .form-group input:focus,
87
- .form-group select:focus,
88
- .form-group textarea:focus {
89
- outline: none;
90
- border-color: #667eea;
91
- }
92
-
93
- .form-row {
94
- display: grid;
95
- grid-template-columns: 1fr 1fr;
96
- gap: 15px;
97
- }
98
-
99
- .btn {
100
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
101
- color: white;
102
- border: none;
103
- padding: 12px 24px;
104
- border-radius: 6px;
105
- cursor: pointer;
106
- font-size: 14px;
107
- font-weight: 600;
108
- transition:
109
- transform 0.2s,
110
- box-shadow 0.2s;
111
- margin-right: 10px;
112
- margin-bottom: 10px;
113
- }
114
-
115
- .btn:hover {
116
- transform: translateY(-2px);
117
- box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
118
- }
119
-
120
- .btn:disabled {
121
- opacity: 0.6;
122
- cursor: not-allowed;
123
- transform: none;
124
- }
125
-
126
- .btn-secondary {
127
- background: linear-gradient(135deg, #95a5a6 0%, #7f8c8d 100%);
128
- }
129
-
130
- .btn-danger {
131
- background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
132
- }
133
-
134
- .btn-success {
135
- background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
136
- }
137
-
138
- .tabs {
139
- display: flex;
140
- border-bottom: 2px solid #e9ecef;
141
- margin-bottom: 20px;
142
- }
143
-
144
- .tab {
145
- padding: 15px 25px;
146
- cursor: pointer;
147
- border-bottom: 3px solid transparent;
148
- transition: all 0.3s;
149
- font-weight: 600;
150
- }
151
-
152
- .tab.active {
153
- border-bottom-color: #667eea;
154
- color: #667eea;
155
- }
156
-
157
- .tab:hover {
158
- background: #f8f9fa;
159
- }
160
-
161
- .tab-content {
162
- display: none;
163
- }
164
-
165
- .tab-content.active {
166
- display: block;
167
- }
168
-
169
- .result-section {
170
- margin-top: 30px;
171
- background: #f8f9fa;
172
- padding: 20px;
173
- border-radius: 8px;
174
- }
175
-
176
- .result-section h3 {
177
- color: #2c3e50;
178
- margin-bottom: 15px;
179
- }
180
-
181
- .result-display {
182
- background: #2c3e50;
183
- color: #ecf0f1;
184
- padding: 15px;
185
- border-radius: 6px;
186
- font-family: 'Courier New', monospace;
187
- font-size: 13px;
188
- max-height: 400px;
189
- overflow-y: auto;
190
- white-space: pre-wrap;
191
- }
192
-
193
- .status {
194
- padding: 10px 15px;
195
- border-radius: 6px;
196
- margin: 10px 0;
197
- font-weight: 600;
198
- }
199
-
200
- .status.success {
201
- background: #d4edda;
202
- color: #155724;
203
- border: 1px solid #c3e6cb;
204
- }
205
-
206
- .status.error {
207
- background: #f8d7da;
208
- color: #721c24;
209
- border: 1px solid #f5c6cb;
210
- }
211
-
212
- .status.info {
213
- background: #d1ecf1;
214
- color: #0c5460;
215
- border: 1px solid #bee5eb;
216
- }
217
-
218
- .loading {
219
- display: inline-block;
220
- width: 20px;
221
- height: 20px;
222
- border: 3px solid #f3f3f3;
223
- border-top: 3px solid #667eea;
224
- border-radius: 50%;
225
- animation: spin 1s linear infinite;
226
- margin-right: 10px;
227
- }
228
-
229
- @keyframes spin {
230
- 0% {
231
- transform: rotate(0deg);
232
- }
233
- 100% {
234
- transform: rotate(360deg);
235
- }
236
- }
237
-
238
- .card-grid {
239
- display: grid;
240
- grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
241
- gap: 20px;
242
- margin-top: 20px;
243
- }
244
-
245
- .card {
246
- background: white;
247
- border: 1px solid #e9ecef;
248
- border-radius: 8px;
249
- padding: 20px;
250
- box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
251
- }
252
-
253
- .card h4 {
254
- color: #2c3e50;
255
- margin-bottom: 15px;
256
- font-size: 1.1rem;
257
- }
258
-
259
- .qr-code {
260
- text-align: center;
261
- margin: 20px 0;
262
- }
263
-
264
- .qr-code img {
265
- max-width: 200px;
266
- border: 1px solid #ddd;
267
- border-radius: 8px;
268
- }
269
-
270
- .copy-btn {
271
- background: #6c757d;
272
- color: white;
273
- border: none;
274
- padding: 5px 10px;
275
- border-radius: 4px;
276
- cursor: pointer;
277
- font-size: 12px;
278
- margin-left: 10px;
279
- }
280
-
281
- .copy-btn:hover {
282
- background: #5a6268;
283
- }
284
-
285
- @media (max-width: 768px) {
286
- .form-row {
287
- grid-template-columns: 1fr;
288
- }
289
-
290
- .tabs {
291
- flex-direction: column;
292
- }
293
-
294
- .tab {
295
- text-align: center;
296
- }
297
- }
298
- </style>
299
- </head>
300
- <body>
301
- <div class="container">
302
- <div class="header">
303
- <h1>🚀 Easyflow SDK</h1>
304
- <p>Interface de Teste e Demonstração</p>
305
- </div>
306
-
307
- <div class="content">
308
- <!-- Configuração -->
309
- <div class="config-section">
310
- <h3>⚙️ Configuração</h3>
311
- <div class="form-row">
312
- <div class="form-group">
313
- <label for="businessId">Business ID:</label>
314
- <input
315
- type="text"
316
- id="businessId"
317
- placeholder="Digite seu Business ID"
318
- />
319
- </div>
320
- <div class="form-group">
321
- <label for="fingerprintId"
322
- >Fingerprint ID (opcional):</label
323
- >
324
- <input
325
- type="text"
326
- id="fingerprintId"
327
- placeholder="12345678"
328
- />
329
- </div>
330
- </div>
331
- <button class="btn" onclick="initializeSDK()">
332
- 🔧 Inicializar SDK
333
- </button>
334
- <span id="sdkStatus" class="status info"
335
- >SDK não inicializado</span
336
- >
337
- </div>
338
-
339
- <!-- Abas de Funcionalidades -->
340
- <div class="tabs">
341
- <div class="tab active" onclick="showTab('encrypt')">
342
- 🔐 Criptografia
343
- </div>
344
- <div class="tab" onclick="showTab('charge')">
345
- 💳 Cobrança
346
- </div>
347
- <div class="tab" onclick="showTab('offer')">📦 Ofertas</div>
348
- <div class="tab" onclick="showTab('pix')">📱 PIX</div>
349
- <div class="tab" onclick="showTab('billet')">🏦 Boleto</div>
350
- </div>
351
-
352
- <!-- Aba de Criptografia -->
353
- <div id="encrypt" class="tab-content active">
354
- <h3>🔐 Criptografia de Cartão de Crédito</h3>
355
- <div class="form-row">
356
- <div class="form-group">
357
- <label for="cardNumber">Número do Cartão:</label>
358
- <input
359
- type="text"
360
- id="cardNumber"
361
- placeholder="4111111111111111"
362
- />
363
- </div>
364
- <div class="form-group">
365
- <label for="cardHolder">Nome do Portador:</label>
366
- <input
367
- type="text"
368
- id="cardHolder"
369
- placeholder="João da Silva"
370
- />
371
- </div>
372
- </div>
373
- <div class="form-row">
374
- <div class="form-group">
375
- <label for="cardMonth">Mês de Expiração:</label>
376
- <input
377
- type="text"
378
- id="cardMonth"
379
- placeholder="12"
380
- />
381
- </div>
382
- <div class="form-group">
383
- <label for="cardYear">Ano de Expiração:</label>
384
- <input
385
- type="text"
386
- id="cardYear"
387
- placeholder="2025"
388
- />
389
- </div>
390
- <div class="form-group">
391
- <label for="cardCvv">CVV:</label>
392
- <input type="text" id="cardCvv" placeholder="123" />
393
- </div>
394
- </div>
395
- <button class="btn" onclick="encryptCard()">
396
- 🔐 Criptografar Cartão
397
- </button>
398
- </div>
399
-
400
- <!-- Aba de Cobrança -->
401
- <div id="charge" class="tab-content">
402
- <h3>💳 Cobrança Direta</h3>
403
- <div class="form-group">
404
- <label for="chargeItems">Itens (JSON):</label>
405
- <textarea
406
- id="chargeItems"
407
- rows="4"
408
- placeholder='[{"name": "Produto", "priceInCents": 1000, "quantity": 1}]'
409
- ></textarea>
410
- </div>
411
- <div class="form-group">
412
- <label for="chargePayments">Pagamentos (JSON):</label>
413
- <textarea
414
- id="chargePayments"
415
- rows="4"
416
- placeholder='[{"method": "pix", "numberInstallments": 1}]'
417
- ></textarea>
418
- </div>
419
- <div class="form-group">
420
- <label for="chargeBuyer">Comprador (JSON):</label>
421
- <textarea
422
- id="chargeBuyer"
423
- rows="6"
424
- placeholder='{"name": "João Silva", "email": "joao@email.com", "document": {"number": "12345678901", "type": "CPF"}, "phone": {"areaCode": "+55", "ddd": "11", "number": "999999999", "isMobile": true}}'
425
- ></textarea>
426
- </div>
427
- <button class="btn" onclick="processCharge()">
428
- 💳 Processar Cobrança
429
- </button>
430
- </div>
431
-
432
- <!-- Aba de Ofertas -->
433
- <div id="offer" class="tab-content">
434
- <h3>📦 Gerenciamento de Ofertas</h3>
435
- <div class="form-group">
436
- <label for="offerId">ID da Oferta:</label>
437
- <input
438
- type="text"
439
- id="offerId"
440
- placeholder="Digite o ID da oferta"
441
- />
442
- </div>
443
- <button class="btn" onclick="getOffer()">
444
- 📦 Buscar Oferta
445
- </button>
446
- <button class="btn btn-secondary" onclick="placeOrder()">
447
- 🛒 Fazer Pedido
448
- </button>
449
- </div>
450
-
451
- <!-- Aba de PIX -->
452
- <div id="pix" class="tab-content">
453
- <h3>📱 PIX</h3>
454
- <div class="form-group">
455
- <label for="pixOrderId">ID do Pedido:</label>
456
- <input
457
- type="text"
458
- id="pixOrderId"
459
- placeholder="Digite o ID do pedido"
460
- />
461
- </div>
462
- <button class="btn" onclick="getPixData()">
463
- 📱 Buscar Dados PIX
464
- </button>
465
- <div
466
- id="pixResult"
467
- class="result-section"
468
- style="display: none"
469
- >
470
- <h3>Dados PIX:</h3>
471
- <div id="pixDisplay"></div>
472
- </div>
473
- </div>
474
-
475
- <!-- Aba de Boleto -->
476
- <div id="billet" class="tab-content">
477
- <h3>🏦 Boleto Bancário</h3>
478
- <div class="form-group">
479
- <label for="billetOrderId">ID do Pedido:</label>
480
- <input
481
- type="text"
482
- id="billetOrderId"
483
- placeholder="Digite o ID do pedido"
484
- />
485
- </div>
486
- <button class="btn" onclick="getBilletData()">
487
- 🏦 Buscar Dados do Boleto
488
- </button>
489
- <div
490
- id="billetResult"
491
- class="result-section"
492
- style="display: none"
493
- >
494
- <h3>Dados do Boleto:</h3>
495
- <div id="billetDisplay"></div>
496
- </div>
497
- </div>
498
-
499
- <!-- Resultados -->
500
- <div class="result-section">
501
- <h3>📊 Resultados</h3>
502
- <div id="resultDisplay" class="result-display">
503
- Aguardando operação...
504
- </div>
505
- </div>
506
- </div>
507
- </div>
508
-
509
- <!-- Carregar SDK -->
510
- <script src="./dist/easyflow-sdk.min.js"></script>
511
-
512
- <script>
513
- let sdk = null
514
- let currentOrderId = null
515
-
516
- // Inicializar SDK
517
- function initializeSDK() {
518
- const businessId = document
519
- .getElementById('businessId')
520
- .value.trim()
521
- const fingerprintId = document
522
- .getElementById('fingerprintId')
523
- .value.trim()
524
-
525
- if (!businessId) {
526
- showStatus('error', 'Business ID é obrigatório!')
527
- return
528
- }
529
-
530
- try {
531
- sdk = new EasyflowSDK(businessId)
532
- showStatus(
533
- 'success',
534
- `SDK inicializado com Business ID: ${businessId}`
535
- )
536
- logResult('SDK inicializado com sucesso!', {
537
- businessId,
538
- fingerprintId,
539
- })
540
- } catch (error) {
541
- showStatus(
542
- 'error',
543
- `Erro ao inicializar SDK: ${error.message}`
544
- )
545
- logResult('Erro ao inicializar SDK', {
546
- error: error.message,
547
- })
548
- }
549
- }
550
-
551
- // Criptografar cartão
552
- async function encryptCard() {
553
- if (!sdk) {
554
- showStatus('error', 'SDK não inicializado!')
555
- return
556
- }
557
-
558
- const cardData = {
559
- cardNumber: document
560
- .getElementById('cardNumber')
561
- .value.trim(),
562
- holderName: document
563
- .getElementById('cardHolder')
564
- .value.trim(),
565
- month: document.getElementById('cardMonth').value.trim(),
566
- year: document.getElementById('cardYear').value.trim(),
567
- cvv: document.getElementById('cardCvv').value.trim(),
568
- }
569
-
570
- const headers = {}
571
- const fingerprintId = document
572
- .getElementById('fingerprintId')
573
- .value.trim()
574
- if (fingerprintId) {
575
- headers['x-fingerprint-id'] = fingerprintId
576
- }
577
-
578
- try {
579
- showStatus('info', 'Criptografando cartão...')
580
- const token = await sdk.encrypt(cardData, headers)
581
- showStatus('success', 'Cartão criptografado com sucesso!')
582
- logResult('Cartão criptografado', {
583
- token,
584
- cardData: { ...cardData, cvv: '***' },
585
- })
586
- } catch (error) {
587
- showStatus(
588
- 'error',
589
- `Erro na criptografia: ${error.message}`
590
- )
591
- logResult('Erro na criptografia', {
592
- error: error.message,
593
- cardData: { ...cardData, cvv: '***' },
594
- })
595
- }
596
- }
597
-
598
- // Processar cobrança
599
- async function processCharge() {
600
- if (!sdk) {
601
- showStatus('error', 'SDK não inicializado!')
602
- return
603
- }
604
-
605
- try {
606
- const items = JSON.parse(
607
- document.getElementById('chargeItems').value
608
- )
609
- const payments = JSON.parse(
610
- document.getElementById('chargePayments').value
611
- )
612
- const buyer = JSON.parse(
613
- document.getElementById('chargeBuyer').value
614
- )
615
-
616
- const chargeData = { items, payments, buyer }
617
-
618
- const headers = {}
619
- const fingerprintId = document
620
- .getElementById('fingerprintId')
621
- .value.trim()
622
- if (fingerprintId) {
623
- headers['x-fingerprint-id'] = fingerprintId
624
- }
625
-
626
- showStatus('info', 'Processando cobrança...')
627
- const orderId = await sdk.charge(chargeData, headers)
628
- currentOrderId = orderId
629
- showStatus(
630
- 'success',
631
- `Cobrança processada! Order ID: ${orderId}`
632
- )
633
- logResult('Cobrança processada', { orderId, chargeData })
634
-
635
- // Auto-monitoramento do pedido
636
- startOrderMonitoring(orderId)
637
- } catch (error) {
638
- showStatus('error', `Erro na cobrança: ${error.message}`)
639
- logResult('Erro na cobrança', { error: error.message })
640
- }
641
- }
642
-
643
- // Buscar oferta
644
- async function getOffer() {
645
- if (!sdk) {
646
- showStatus('error', 'SDK não inicializado!')
647
- return
648
- }
649
-
650
- const offerId = document.getElementById('offerId').value.trim()
651
- if (!offerId) {
652
- showStatus('error', 'ID da oferta é obrigatório!')
653
- return
654
- }
655
-
656
- try {
657
- showStatus('info', 'Buscando oferta...')
658
- const offer = await sdk.getOffer(offerId)
659
- showStatus('success', 'Oferta encontrada!')
660
- logResult('Oferta encontrada', { offerId, offer })
661
- } catch (error) {
662
- showStatus(
663
- 'error',
664
- `Erro ao buscar oferta: ${error.message}`
665
- )
666
- logResult('Erro ao buscar oferta', {
667
- error: error.message,
668
- offerId,
669
- })
670
- }
671
- }
672
-
673
- // Fazer pedido
674
- async function placeOrder() {
675
- if (!sdk) {
676
- showStatus('error', 'SDK não inicializado!')
677
- return
678
- }
679
-
680
- const offerId = document.getElementById('offerId').value.trim()
681
- if (!offerId) {
682
- showStatus('error', 'ID da oferta é obrigatório!')
683
- return
684
- }
685
-
686
- try {
687
- const orderData = {
688
- buyer: JSON.parse(
689
- document.getElementById('chargeBuyer').value
690
- ),
691
- payments: JSON.parse(
692
- document.getElementById('chargePayments').value
693
- ),
694
- }
695
-
696
- const headers = {}
697
- const fingerprintId = document
698
- .getElementById('fingerprintId')
699
- .value.trim()
700
- if (fingerprintId) {
701
- headers['x-fingerprint-id'] = fingerprintId
702
- }
703
-
704
- showStatus('info', 'Fazendo pedido...')
705
- const orderId = await sdk.placeOrder(
706
- offerId,
707
- orderData,
708
- headers
709
- )
710
- currentOrderId = orderId
711
- showStatus(
712
- 'success',
713
- `Pedido realizado! Order ID: ${orderId}`
714
- )
715
- logResult('Pedido realizado', {
716
- orderId,
717
- offerId,
718
- orderData,
719
- })
720
-
721
- // Auto-monitoramento do pedido
722
- startOrderMonitoring(orderId)
723
- } catch (error) {
724
- showStatus(
725
- 'error',
726
- `Erro ao fazer pedido: ${error.message}`
727
- )
728
- logResult('Erro ao fazer pedido', {
729
- error: error.message,
730
- offerId,
731
- })
732
- }
733
- }
734
-
735
- // Buscar dados PIX
736
- async function getPixData() {
737
- if (!sdk) {
738
- showStatus('error', 'SDK não inicializado!')
739
- return
740
- }
741
-
742
- const orderId =
743
- document.getElementById('pixOrderId').value.trim() ||
744
- currentOrderId
745
- if (!orderId) {
746
- showStatus('error', 'ID do pedido é obrigatório!')
747
- return
748
- }
749
-
750
- try {
751
- showStatus('info', 'Buscando dados PIX...')
752
- const pixData = await sdk.getPix(orderId)
753
-
754
- if (pixData) {
755
- showStatus('success', 'Dados PIX encontrados!')
756
- displayPixData(pixData)
757
- logResult('Dados PIX encontrados', { orderId, pixData })
758
- } else {
759
- showStatus(
760
- 'info',
761
- 'Nenhum pagamento PIX encontrado para este pedido'
762
- )
763
- logResult('Nenhum PIX encontrado', { orderId })
764
- }
765
- } catch (error) {
766
- showStatus('error', `Erro ao buscar PIX: ${error.message}`)
767
- logResult('Erro ao buscar PIX', {
768
- error: error.message,
769
- orderId,
770
- })
771
- }
772
- }
773
-
774
- // Buscar dados do boleto
775
- async function getBilletData() {
776
- if (!sdk) {
777
- showStatus('error', 'SDK não inicializado!')
778
- return
779
- }
780
-
781
- const orderId =
782
- document.getElementById('billetOrderId').value.trim() ||
783
- currentOrderId
784
- if (!orderId) {
785
- showStatus('error', 'ID do pedido é obrigatório!')
786
- return
787
- }
788
-
789
- try {
790
- showStatus('info', 'Buscando dados do boleto...')
791
- const billetData = await sdk.getBankBillet(orderId)
792
-
793
- if (billetData) {
794
- showStatus('success', 'Dados do boleto encontrados!')
795
- displayBilletData(billetData)
796
- logResult('Dados do boleto encontrados', {
797
- orderId,
798
- billetData,
799
- })
800
- } else {
801
- showStatus(
802
- 'info',
803
- 'Nenhum boleto encontrado para este pedido'
804
- )
805
- logResult('Nenhum boleto encontrado', { orderId })
806
- }
807
- } catch (error) {
808
- showStatus(
809
- 'error',
810
- `Erro ao buscar boleto: ${error.message}`
811
- )
812
- logResult('Erro ao buscar boleto', {
813
- error: error.message,
814
- orderId,
815
- })
816
- }
817
- }
818
-
819
- // Exibir dados PIX
820
- function displayPixData(pixData) {
821
- const pixResult = document.getElementById('pixResult')
822
- const pixDisplay = document.getElementById('pixDisplay')
823
-
824
- let html = '<div class="card-grid">'
825
-
826
- if (pixData.qrCode) {
827
- html += `
828
- <div class="card">
829
- <h4>QR Code</h4>
830
- <div class="qr-code">
831
- <img src="data:image/png;base64,${pixData.qrCode}" alt="QR Code PIX">
832
- </div>
833
- <button class="copy-btn" onclick="copyToClipboard('${pixData.qrCode}')">Copiar Base64</button>
834
- </div>
835
- `
836
- }
837
-
838
- if (pixData.copyAndPasteCode) {
839
- html += `
840
- <div class="card">
841
- <h4>Código PIX</h4>
842
- <p><strong>Código:</strong> ${pixData.copyAndPasteCode}</p>
843
- <button class="copy-btn" onclick="copyToClipboard('${pixData.copyAndPasteCode}')">Copiar Código</button>
844
- </div>
845
- `
846
- }
847
-
848
- html += '</div>'
849
- pixDisplay.innerHTML = html
850
- pixResult.style.display = 'block'
851
- }
852
-
853
- // Exibir dados do boleto
854
- function displayBilletData(billetData) {
855
- const billetResult = document.getElementById('billetResult')
856
- const billetDisplay = document.getElementById('billetDisplay')
857
-
858
- let html = '<div class="card-grid">'
859
-
860
- if (billetData.link) {
861
- html += `
862
- <div class="card">
863
- <h4>Link do Boleto</h4>
864
- <p><a href="${billetData.link}" target="_blank">Abrir Boleto</a></p>
865
- <button class="copy-btn" onclick="copyToClipboard('${billetData.link}')">Copiar Link</button>
866
- </div>
867
- `
868
- }
869
-
870
- if (billetData.line) {
871
- html += `
872
- <div class="card">
873
- <h4>Linha Digitável</h4>
874
- <p><strong>Linha:</strong> ${billetData.line}</p>
875
- <button class="copy-btn" onclick="copyToClipboard('${billetData.line}')">Copiar Linha</button>
876
- </div>
877
- `
878
- }
879
-
880
- if (billetData.barCode) {
881
- html += `
882
- <div class="card">
883
- <h4>Código de Barras</h4>
884
- <p><strong>Código:</strong> ${billetData.barCode}</p>
885
- <button class="copy-btn" onclick="copyToClipboard('${billetData.barCode}')">Copiar Código</button>
886
- </div>
887
- `
888
- }
889
-
890
- html += '</div>'
891
- billetDisplay.innerHTML = html
892
- billetResult.style.display = 'block'
893
- }
894
-
895
- // Monitoramento automático do pedido
896
- function startOrderMonitoring(orderId) {
897
- if (!orderId) return
898
-
899
- const interval = setInterval(async () => {
900
- try {
901
- const order = await sdk.getOrder(orderId)
902
- logResult('Status do pedido atualizado', {
903
- orderId,
904
- order,
905
- })
906
-
907
- // Parar monitoramento se o pedido foi finalizado
908
- if (
909
- order.data &&
910
- (order.data.status === 'paid' ||
911
- order.data.status === 'cancelled')
912
- ) {
913
- clearInterval(interval)
914
- showStatus(
915
- 'success',
916
- `Pedido ${order.data.status === 'paid' ? 'pago' : 'cancelado'}!`
917
- )
918
- }
919
- } catch (error) {
920
- console.error('Erro no monitoramento:', error)
921
- clearInterval(interval)
922
- }
923
- }, 5000)
924
- }
925
-
926
- // Utilitários
927
- function showTab(tabName) {
928
- // Esconder todas as abas
929
- document.querySelectorAll('.tab-content').forEach((tab) => {
930
- tab.classList.remove('active')
931
- })
932
- document.querySelectorAll('.tab').forEach((tab) => {
933
- tab.classList.remove('active')
934
- })
935
-
936
- // Mostrar aba selecionada
937
- document.getElementById(tabName).classList.add('active')
938
- event.target.classList.add('active')
939
- }
940
-
941
- function showStatus(type, message) {
942
- const statusElement = document.getElementById('sdkStatus')
943
- statusElement.className = `status ${type}`
944
- statusElement.textContent = message
945
- }
946
-
947
- function logResult(title, data) {
948
- const resultDisplay = document.getElementById('resultDisplay')
949
- const timestamp = new Date().toLocaleTimeString()
950
- const logEntry = `[${timestamp}] ${title}:\n${JSON.stringify(data, null, 2)}\n\n`
951
-
952
- resultDisplay.textContent = logEntry + resultDisplay.textContent
953
- }
954
-
955
- function copyToClipboard(text) {
956
- navigator.clipboard
957
- .writeText(text)
958
- .then(() => {
959
- showStatus(
960
- 'success',
961
- 'Copiado para a área de transferência!'
962
- )
963
- })
964
- .catch(() => {
965
- showStatus(
966
- 'error',
967
- 'Erro ao copiar para a área de transferência'
968
- )
969
- })
970
- }
971
-
972
- // Inicialização automática
973
- document.addEventListener('DOMContentLoaded', () => {
974
- showStatus(
975
- 'info',
976
- 'Interface carregada. Configure o Business ID e inicialize o SDK.'
977
- )
978
- })
979
- </script>
980
- </body>
981
- </html>