@riskdefy/chargebacks 1.0.6 → 1.0.8
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/package.json +10 -5
- package/src/.babelrc +3 -0
- package/src/components/Chargebacks.vue +28 -0
- package/src/components/Details.vue +789 -0
- package/src/components/FluidPayDetails.vue +314 -0
- package/src/components/IncomingDetails.vue +621 -0
- package/src/components/InovioPayDetails.vue +316 -0
- package/src/components/NmiDetails.vue +162 -0
- package/src/components/NuveiDetails.vue +320 -0
- package/src/components/ReasonExplained.vue +121 -0
- package/src/components/SquareUp.vue +316 -0
- package/src/components/Summary.vue +218 -0
- package/src/components/USAEPayDetails.vue +181 -0
- package/src/index.js +10 -0
- package/src/service/api.js +23 -0
- package/dist/Chargebacks.cjs.js +0 -1284
- package/dist/Chargebacks.es.js +0 -30409
- package/dist/Chargebacks.umd.js +0 -1284
- package/dist/chargebacks.css +0 -1
|
@@ -0,0 +1,320 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="rounded border pt-0 mb-5">
|
|
3
|
+
<div class="accordion fs-7" id="kt_accordion_1">
|
|
4
|
+
<div class="accordion-item">
|
|
5
|
+
<h2 class="accordion-header" id="kt_accordion_1_header_1">
|
|
6
|
+
<button
|
|
7
|
+
class="accordion-button fs-6 fw-bold"
|
|
8
|
+
type="button"
|
|
9
|
+
data-bs-toggle="collapse"
|
|
10
|
+
data-bs-target="#kt_accordion_1_body_1"
|
|
11
|
+
aria-expanded="true"
|
|
12
|
+
aria-controls="kt_accordion_1_body_1"
|
|
13
|
+
>
|
|
14
|
+
Order Details
|
|
15
|
+
</button>
|
|
16
|
+
</h2>
|
|
17
|
+
<div
|
|
18
|
+
id="kt_accordion_1_body_1"
|
|
19
|
+
class="accordion-collapse collapse show"
|
|
20
|
+
aria-labelledby="kt_accordion_1_header_1"
|
|
21
|
+
data-bs-parent="#kt_accordion_1"
|
|
22
|
+
style=""
|
|
23
|
+
>
|
|
24
|
+
<div class="accordion-body">
|
|
25
|
+
<div class="mb-0">
|
|
26
|
+
<div
|
|
27
|
+
v-if="incoming.order_details == ''"
|
|
28
|
+
class="d-flex flex-wrap py-5"
|
|
29
|
+
>
|
|
30
|
+
<!--begin::Col-->
|
|
31
|
+
<div class="mb-0">
|
|
32
|
+
<span class="fs-7 text-gray-500">No Data Available</span>
|
|
33
|
+
</div>
|
|
34
|
+
<!--end::Col-->
|
|
35
|
+
</div>
|
|
36
|
+
<div v-else class="table-responsive">
|
|
37
|
+
<!--begin::Table-->
|
|
38
|
+
<table
|
|
39
|
+
class="table align-middle table-row-dashed gy-4 mb-0 fs-7"
|
|
40
|
+
>
|
|
41
|
+
<!--begin::Table head-->
|
|
42
|
+
<thead>
|
|
43
|
+
<!--begin::Table row-->
|
|
44
|
+
<tr
|
|
45
|
+
class="border-bottom border-gray-200 text-start text-gray-400 fw-bolder fs-7 text-uppercase gs-0"
|
|
46
|
+
>
|
|
47
|
+
<th class="min-w-150px">Item Id</th>
|
|
48
|
+
<th class="min-w-100px">Item Name</th>
|
|
49
|
+
<th class="min-w-50px">Qty</th>
|
|
50
|
+
<th class="text-end min-w-100px pe-5">Price</th>
|
|
51
|
+
</tr>
|
|
52
|
+
<!--end::Table row-->
|
|
53
|
+
</thead>
|
|
54
|
+
<!--end::Table head-->
|
|
55
|
+
|
|
56
|
+
<!--begin::Table body-->
|
|
57
|
+
<tbody class="fw-bold text-gray-800">
|
|
58
|
+
<tr
|
|
59
|
+
v-for="(item, index) in incoming.order_details.items"
|
|
60
|
+
:key="index"
|
|
61
|
+
>
|
|
62
|
+
<td>
|
|
63
|
+
<div class="w-50px">{{ item.purchaseId }}</div>
|
|
64
|
+
</td>
|
|
65
|
+
<td>
|
|
66
|
+
{{ item.name }}
|
|
67
|
+
</td>
|
|
68
|
+
<td class="w-50px">{{ item.qty }}</td>
|
|
69
|
+
<td class="w-50px text-end pe-5">
|
|
70
|
+
{{ item.price }}
|
|
71
|
+
</td>
|
|
72
|
+
</tr>
|
|
73
|
+
</tbody>
|
|
74
|
+
<!--end::Table body-->
|
|
75
|
+
</table>
|
|
76
|
+
<!--end::Table-->
|
|
77
|
+
</div>
|
|
78
|
+
</div>
|
|
79
|
+
</div>
|
|
80
|
+
</div>
|
|
81
|
+
</div>
|
|
82
|
+
<div class="accordion-item">
|
|
83
|
+
<h2 class="accordion-header" id="kt_accordion_1_header_2">
|
|
84
|
+
<button
|
|
85
|
+
class="accordion-button fs-6 fw-bold collapsed"
|
|
86
|
+
type="button"
|
|
87
|
+
data-bs-toggle="collapse"
|
|
88
|
+
data-bs-target="#kt_accordion_1_body_2"
|
|
89
|
+
aria-expanded="false"
|
|
90
|
+
aria-controls="kt_accordion_1_body_2"
|
|
91
|
+
>
|
|
92
|
+
Transaction Details
|
|
93
|
+
</button>
|
|
94
|
+
</h2>
|
|
95
|
+
<div
|
|
96
|
+
id="kt_accordion_1_body_2"
|
|
97
|
+
class="accordion-collapse collapse"
|
|
98
|
+
aria-labelledby="kt_accordion_1_header_2"
|
|
99
|
+
data-bs-parent="#kt_accordion_1"
|
|
100
|
+
style=""
|
|
101
|
+
>
|
|
102
|
+
<div class="accordion-body">
|
|
103
|
+
<div class="mb-0">
|
|
104
|
+
<div class="d-flex flex-wrap py-2">
|
|
105
|
+
<div class="flex-equal ms-2 me-2">
|
|
106
|
+
<table class="table table-flush fw-bold gy-1 mb-0">
|
|
107
|
+
<tbody>
|
|
108
|
+
<tr>
|
|
109
|
+
<td class="text-muted min-w-125px w-125px">
|
|
110
|
+
Transaction Id:
|
|
111
|
+
</td>
|
|
112
|
+
<td class="text-gray-800">
|
|
113
|
+
{{ incoming.transaction["Transaction ID"] }}
|
|
114
|
+
</td>
|
|
115
|
+
</tr>
|
|
116
|
+
<tr>
|
|
117
|
+
<td class="text-muted min-w-125px w-125px">
|
|
118
|
+
Auth Code:
|
|
119
|
+
</td>
|
|
120
|
+
<td class="text-gray-800">
|
|
121
|
+
{{ incoming.transaction["Auth Code"] }}
|
|
122
|
+
</td>
|
|
123
|
+
</tr>
|
|
124
|
+
<tr>
|
|
125
|
+
<td class="text-muted min-w-125px w-125px">AVS:</td>
|
|
126
|
+
<td class="text-gray-800">
|
|
127
|
+
{{ incoming.transaction["AVS"] }}
|
|
128
|
+
</td>
|
|
129
|
+
</tr>
|
|
130
|
+
<tr>
|
|
131
|
+
<td class="text-muted min-w-125px w-125px">CVV:</td>
|
|
132
|
+
<td class="text-gray-800">
|
|
133
|
+
{{ incoming.transaction["CVV"] }}
|
|
134
|
+
</td>
|
|
135
|
+
</tr>
|
|
136
|
+
<tr>
|
|
137
|
+
<td class="text-muted min-w-125px w-125px">Created:</td>
|
|
138
|
+
<td class="text-gray-800">
|
|
139
|
+
{{ incoming.transaction["Date"] }}
|
|
140
|
+
</td>
|
|
141
|
+
</tr>
|
|
142
|
+
</tbody>
|
|
143
|
+
</table>
|
|
144
|
+
</div>
|
|
145
|
+
<div class="flex-equal ms-2 me-2">
|
|
146
|
+
<table class="table table-flush fw-bold gy-1">
|
|
147
|
+
<tbody>
|
|
148
|
+
<tr>
|
|
149
|
+
<td class="text-muted min-w-125px w-125px">
|
|
150
|
+
Order Id:
|
|
151
|
+
</td>
|
|
152
|
+
<td class="text-gray-800">
|
|
153
|
+
{{ incoming.transaction["PPP Order ID"] }}
|
|
154
|
+
</td>
|
|
155
|
+
</tr>
|
|
156
|
+
<tr>
|
|
157
|
+
<td class="text-muted min-w-125px w-125px">Status:</td>
|
|
158
|
+
<td class="text-gray-800">
|
|
159
|
+
{{ incoming.transaction["Transaction Result"] }}
|
|
160
|
+
</td>
|
|
161
|
+
</tr>
|
|
162
|
+
<tr>
|
|
163
|
+
<td class="text-muted min-w-125px w-125px">Type:</td>
|
|
164
|
+
<td class="text-gray-800">
|
|
165
|
+
{{ incoming.transaction["Transaction Type"] }}
|
|
166
|
+
</td>
|
|
167
|
+
</tr>
|
|
168
|
+
<tr>
|
|
169
|
+
<td class="text-muted min-w-125px w-125px">
|
|
170
|
+
Descriptor:
|
|
171
|
+
</td>
|
|
172
|
+
<td class="text-gray-800">
|
|
173
|
+
{{ incoming.transaction["URL"] }}
|
|
174
|
+
</td>
|
|
175
|
+
</tr>
|
|
176
|
+
<tr>
|
|
177
|
+
<td class="text-muted min-w-125px w-125px">
|
|
178
|
+
Scheme Identifier:
|
|
179
|
+
</td>
|
|
180
|
+
<td class="text-gray-800">
|
|
181
|
+
{{
|
|
182
|
+
incoming.transaction["External Scheme Identifier"]
|
|
183
|
+
}}
|
|
184
|
+
</td>
|
|
185
|
+
</tr>
|
|
186
|
+
</tbody>
|
|
187
|
+
</table>
|
|
188
|
+
</div>
|
|
189
|
+
</div>
|
|
190
|
+
</div>
|
|
191
|
+
</div>
|
|
192
|
+
</div>
|
|
193
|
+
</div>
|
|
194
|
+
<div class="accordion-item">
|
|
195
|
+
<h2 class="accordion-header" id="kt_accordion_1_header_3">
|
|
196
|
+
<button
|
|
197
|
+
class="accordion-button fs-6 fw-bold collapsed"
|
|
198
|
+
type="button"
|
|
199
|
+
data-bs-toggle="collapse"
|
|
200
|
+
data-bs-target="#kt_accordion_1_body_3"
|
|
201
|
+
aria-expanded="false"
|
|
202
|
+
aria-controls="kt_accordion_1_body_3"
|
|
203
|
+
>
|
|
204
|
+
Cardholder Details
|
|
205
|
+
</button>
|
|
206
|
+
</h2>
|
|
207
|
+
<div
|
|
208
|
+
id="kt_accordion_1_body_3"
|
|
209
|
+
class="accordion-collapse collapse"
|
|
210
|
+
aria-labelledby="kt_accordion_1_header_3"
|
|
211
|
+
data-bs-parent="#kt_accordion_1"
|
|
212
|
+
style=""
|
|
213
|
+
>
|
|
214
|
+
<div class="accordion-body">
|
|
215
|
+
<div class="mb-0">
|
|
216
|
+
<div class="d-flex flex-wrap py-5">
|
|
217
|
+
<!--begin::Col-->
|
|
218
|
+
<div class="flex-equal ms-2 me-5">
|
|
219
|
+
<table class="table table-flush fw-bold gy-1">
|
|
220
|
+
<tbody>
|
|
221
|
+
<tr>
|
|
222
|
+
<td class="text-muted min-w-125px w-125px">
|
|
223
|
+
First Name
|
|
224
|
+
</td>
|
|
225
|
+
<td class="text-gray-800 text-hover-primary">
|
|
226
|
+
{{ incoming.card_holder.first_name }}
|
|
227
|
+
</td>
|
|
228
|
+
</tr>
|
|
229
|
+
<tr>
|
|
230
|
+
<td class="text-muted min-w-125px w-125px">
|
|
231
|
+
Last Name
|
|
232
|
+
</td>
|
|
233
|
+
<td class="text-gray-800 text-hover-primary">
|
|
234
|
+
{{ incoming.card_holder.last_name }}
|
|
235
|
+
</td>
|
|
236
|
+
</tr>
|
|
237
|
+
<tr>
|
|
238
|
+
<td class="text-muted min-w-125px w-125px">Email</td>
|
|
239
|
+
<td class="text-gray-800 text-hover-primary">
|
|
240
|
+
{{ incoming.card_holder.email }}
|
|
241
|
+
</td>
|
|
242
|
+
</tr>
|
|
243
|
+
<tr>
|
|
244
|
+
<td class="text-muted min-w-125px w-125px">Address:</td>
|
|
245
|
+
<td class="text-gray-800 text-hover-primary">
|
|
246
|
+
{{ incoming.card_holder.billing_address }}<br />{{
|
|
247
|
+
incoming.card_holder.billing_zip
|
|
248
|
+
}}
|
|
249
|
+
</td>
|
|
250
|
+
</tr>
|
|
251
|
+
</tbody>
|
|
252
|
+
</table>
|
|
253
|
+
</div>
|
|
254
|
+
<!--end::Col--><!--begin::Col-->
|
|
255
|
+
<div class="flex-equal">
|
|
256
|
+
<table class="table table-flush fw-bold gy-1">
|
|
257
|
+
<tbody>
|
|
258
|
+
<tr>
|
|
259
|
+
<td class="text-muted min-w-125px w-125px">
|
|
260
|
+
Customer Id:
|
|
261
|
+
</td>
|
|
262
|
+
<td class="text-gray-800">
|
|
263
|
+
{{ incoming.card_holder.customer_id }}
|
|
264
|
+
</td>
|
|
265
|
+
</tr>
|
|
266
|
+
<tr>
|
|
267
|
+
<td class="text-muted min-w-125px w-125px">
|
|
268
|
+
Lifecycle ID:
|
|
269
|
+
</td>
|
|
270
|
+
<td class="text-gray-800">
|
|
271
|
+
{{ incoming.transaction["Lifecycle ID"] }}
|
|
272
|
+
</td>
|
|
273
|
+
</tr>
|
|
274
|
+
<tr>
|
|
275
|
+
<td class="text-muted min-w-125px w-125px">Phone:</td>
|
|
276
|
+
<td
|
|
277
|
+
class="text-gray-800"
|
|
278
|
+
v-if="incoming.card_holder.phone == ''"
|
|
279
|
+
>
|
|
280
|
+
Not Provided
|
|
281
|
+
</td>
|
|
282
|
+
<td class="text-gray-800" v-else>
|
|
283
|
+
{{ incoming.card_holder.phone }}
|
|
284
|
+
</td>
|
|
285
|
+
</tr>
|
|
286
|
+
<tr>
|
|
287
|
+
<td class="text-muted min-w-125px w-125px">
|
|
288
|
+
IP Address:
|
|
289
|
+
</td>
|
|
290
|
+
<td class="text-gray-800">
|
|
291
|
+
{{ incoming.card_holder.ip_address }}
|
|
292
|
+
</td>
|
|
293
|
+
</tr>
|
|
294
|
+
</tbody>
|
|
295
|
+
</table>
|
|
296
|
+
</div>
|
|
297
|
+
<!--end::Col-->
|
|
298
|
+
</div>
|
|
299
|
+
</div>
|
|
300
|
+
</div>
|
|
301
|
+
</div>
|
|
302
|
+
</div>
|
|
303
|
+
</div>
|
|
304
|
+
</div>
|
|
305
|
+
</template>
|
|
306
|
+
|
|
307
|
+
<script lang="ts">
|
|
308
|
+
import { defineComponent } from "vue";
|
|
309
|
+
|
|
310
|
+
export default defineComponent({
|
|
311
|
+
name: "nmi-details",
|
|
312
|
+
props: {
|
|
313
|
+
incoming: Object,
|
|
314
|
+
},
|
|
315
|
+
setup() {
|
|
316
|
+
return {};
|
|
317
|
+
},
|
|
318
|
+
});
|
|
319
|
+
</script>
|
|
320
|
+
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<!--begin::Modal - Invite Friends-->
|
|
3
|
+
<div
|
|
4
|
+
class="modal fade"
|
|
5
|
+
id="chargeback_reason_explained"
|
|
6
|
+
tabindex="1"
|
|
7
|
+
aria-hidden="true"
|
|
8
|
+
>
|
|
9
|
+
<!--begin::Modal dialog-->
|
|
10
|
+
<div class="modal-dialog mw-650px">
|
|
11
|
+
<!--begin::Modal content-->
|
|
12
|
+
<div class="card card-body">
|
|
13
|
+
<!--begin::Modal body-->
|
|
14
|
+
<div class="card-title fs-5 fw-bolder">
|
|
15
|
+
<img
|
|
16
|
+
v-if="reason.card_brand === 'Visa'"
|
|
17
|
+
src="https://app.riskdefy.io/media/svg/card-logos/visa.svg"
|
|
18
|
+
alt=""
|
|
19
|
+
class="h-25px pe-5"
|
|
20
|
+
/>
|
|
21
|
+
<img
|
|
22
|
+
v-if="reason.card_brand === 'American Express'"
|
|
23
|
+
src="https://app.riskdefy.io/media/svg/card-logos/american-express.svg"
|
|
24
|
+
alt=""
|
|
25
|
+
class="h-25px pe-5"
|
|
26
|
+
/>
|
|
27
|
+
<img
|
|
28
|
+
v-if="reason.card_brand === 'Mastercard'"
|
|
29
|
+
src="https://app.riskdefy.io/media/svg/card-logos/mastercard.svg"
|
|
30
|
+
alt=""
|
|
31
|
+
class="h-25px pe-5"
|
|
32
|
+
/>
|
|
33
|
+
<img
|
|
34
|
+
v-if="reason.card_brand === 'Discover'"
|
|
35
|
+
src="https://app.riskdefy.io/media/svg/card-logos/discovercard.svg"
|
|
36
|
+
alt=""
|
|
37
|
+
class="h-25px pe-5"
|
|
38
|
+
/>
|
|
39
|
+
{{ reason.code }}
|
|
40
|
+
</div>
|
|
41
|
+
<div>{{ reason.message }}</div>
|
|
42
|
+
<div class="mh-300px scroll-y m-5 py-5">
|
|
43
|
+
<template
|
|
44
|
+
v-for="(msg, index) in reason_explained.message.explanations"
|
|
45
|
+
:key="index"
|
|
46
|
+
>
|
|
47
|
+
<!--begin::Message-->
|
|
48
|
+
<div
|
|
49
|
+
class="d-flex flex-stack py-4 border-bottom border-gray-300 border-bottom-dashed"
|
|
50
|
+
>
|
|
51
|
+
<!--begin::Details-->
|
|
52
|
+
<div class="d-flex align-items-center">
|
|
53
|
+
<!--begin::Avatar-->
|
|
54
|
+
<!-- <div class="symbol symbol-35px symbol-circle">
|
|
55
|
+
<img v-if="user.avatar" alt="Pic" :src="user.avatar" />
|
|
56
|
+
<span
|
|
57
|
+
v-else
|
|
58
|
+
:class="`bg-light-${user.state} text-${user.state}`"
|
|
59
|
+
class="symbol-label fw-bold"
|
|
60
|
+
>
|
|
61
|
+
{{ user.name.charAt(0) }}
|
|
62
|
+
</span>
|
|
63
|
+
</div> -->
|
|
64
|
+
<!--end::Avatar-->
|
|
65
|
+
|
|
66
|
+
<!--begin::Details-->
|
|
67
|
+
<div class="ms-5">
|
|
68
|
+
<!-- <a
|
|
69
|
+
href="#"
|
|
70
|
+
class="fs-5 fw-bolder text-gray-900 text-hover-primary mb-2"
|
|
71
|
+
>{{ user.name }}</a
|
|
72
|
+
> -->
|
|
73
|
+
|
|
74
|
+
<div class="fw-bold text-gray-800">{{ msg }}</div>
|
|
75
|
+
</div>
|
|
76
|
+
<!--end::Details-->
|
|
77
|
+
</div>
|
|
78
|
+
<!--end::Details-->
|
|
79
|
+
|
|
80
|
+
<!--begin::Access menu-->
|
|
81
|
+
<!-- <div class="ms-2 w-100px">
|
|
82
|
+
<select
|
|
83
|
+
class="form-select form-select-solid form-select-sm"
|
|
84
|
+
data-control="select2"
|
|
85
|
+
data-hide-search="true"
|
|
86
|
+
>
|
|
87
|
+
<option value="1">Guest</option>
|
|
88
|
+
<option value="2">Owner</option>
|
|
89
|
+
<option value="3">Can Edit</option>
|
|
90
|
+
</select>
|
|
91
|
+
</div> -->
|
|
92
|
+
<!--end::Access menu-->
|
|
93
|
+
</div>
|
|
94
|
+
<!--end::Message-->
|
|
95
|
+
</template>
|
|
96
|
+
</div>
|
|
97
|
+
<!--end::Modal body-->
|
|
98
|
+
</div>
|
|
99
|
+
<!--end::Modal content-->
|
|
100
|
+
</div>
|
|
101
|
+
<!--end::Modal dialog-->
|
|
102
|
+
</div>
|
|
103
|
+
<!--end::Modal - Invite Friend-->
|
|
104
|
+
</template>
|
|
105
|
+
|
|
106
|
+
<script lang="ts">
|
|
107
|
+
import { defineComponent } from "vue";
|
|
108
|
+
|
|
109
|
+
export default defineComponent({
|
|
110
|
+
name: "reason-explained-modal",
|
|
111
|
+
components: {},
|
|
112
|
+
props: {
|
|
113
|
+
reason_explained: Object,
|
|
114
|
+
reason: Object,
|
|
115
|
+
},
|
|
116
|
+
setup() {
|
|
117
|
+
return {};
|
|
118
|
+
},
|
|
119
|
+
});
|
|
120
|
+
</script>
|
|
121
|
+
|