@freteclick/quasar-financial-ui 1.0.87 → 1.0.89
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
CHANGED
|
@@ -2,24 +2,59 @@
|
|
|
2
2
|
<div class="row items-center justify-center">
|
|
3
3
|
<div class="flex flex-center" v-if="isLoading">
|
|
4
4
|
<q-circular-progress :indeterminate="isLoading"
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
size="sm"
|
|
6
|
+
color="primary"
|
|
7
|
+
class="q-ma-md"
|
|
8
8
|
/>
|
|
9
9
|
Carregando...
|
|
10
10
|
</div>
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
<!-- BILLET VIEWER SICRED -->
|
|
13
|
+
|
|
14
|
+
<div :class="showBilletSicred ? 'full-width q-pa-lg' : 'hidden'">
|
|
15
|
+
|
|
16
|
+
<div class="col-12 q-pt-lg" v-if=" paymentInstitution === 'sicred'">
|
|
17
|
+
<div class="row justify-center items-center">
|
|
18
|
+
<q-btn
|
|
19
|
+
icon="money"
|
|
20
|
+
size="lg"
|
|
21
|
+
color="primary"
|
|
22
|
+
label="Abrir Boleto Pix"
|
|
23
|
+
:loading="isLoadingDownload"
|
|
24
|
+
@click="clickDownloadBilletSicred()"
|
|
25
|
+
:disable="isPaid"
|
|
26
|
+
/>
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
|
|
33
|
+
</div>
|
|
34
|
+
|
|
35
|
+
<!-- BILLET VIEWER INTER -->
|
|
36
|
+
|
|
37
|
+
<div :class="showBilletInter ? 'full-width q-pa-lg' : 'hidden'">
|
|
38
|
+
<div style="height: 1200px">
|
|
39
|
+
<iframe
|
|
40
|
+
:src="invoiceUrlInter"
|
|
41
|
+
name="BILLETINTER" id="billet_inter" width="100%" height="100%" frameBorder="0">
|
|
42
|
+
<p>This browser does not support IFrame.</p>
|
|
43
|
+
</iframe>
|
|
44
|
+
</div>
|
|
45
|
+
</div>
|
|
46
|
+
|
|
47
|
+
<!-- BILLET VIEWER ITAU -->
|
|
13
48
|
|
|
14
49
|
<div :class="showBillet ? 'full-width q-pa-lg' : 'hidden'">
|
|
15
50
|
<q-form
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
51
|
+
ref="myForm"
|
|
52
|
+
:action="payment !== null ? payment.invoiceUrl : ''"
|
|
53
|
+
method="post"
|
|
54
|
+
class="q-mt-sm row justify-center items-center"
|
|
55
|
+
target="BILLET"
|
|
21
56
|
>
|
|
22
|
-
<input type="hidden" name="DC" :value="itauHash"
|
|
57
|
+
<input type="hidden" name="DC" :value="itauHash"/>
|
|
23
58
|
</q-form>
|
|
24
59
|
|
|
25
60
|
<div style="height: 1200px">
|
|
@@ -31,26 +66,34 @@
|
|
|
31
66
|
|
|
32
67
|
<!-- BILLET GENERATOR TRIGGER -->
|
|
33
68
|
|
|
34
|
-
<div class="col-12 q-pt-lg" v-if="paymentIsPending && billetMustBeCreated">
|
|
35
|
-
<div
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
69
|
+
<div class="col-12 q-pt-lg" v-if="paymentIsPending && billetMustBeCreated && paymentInstitution === 'itau'">
|
|
70
|
+
<div style="min-height: 80vh;" class="row justify-center items-center">
|
|
71
|
+
<q-btn
|
|
72
|
+
icon="money"
|
|
73
|
+
size="lg"
|
|
74
|
+
color="primary"
|
|
75
|
+
label="Gerar boleto"
|
|
76
|
+
:loading="retrievingHash"
|
|
77
|
+
@click="() => {
|
|
78
|
+
this.retrievingHash = true;
|
|
79
|
+
this.getItauHash().then(hash => {
|
|
80
|
+
if (hash !== null) {
|
|
81
|
+
this.loadOnFocus = true;
|
|
82
|
+
this.$refs.billetForm.$el.submit();
|
|
83
|
+
}
|
|
84
|
+
}).finally(() => {
|
|
85
|
+
this.retrievingHash = false;
|
|
86
|
+
});
|
|
87
|
+
}"
|
|
88
|
+
:disable="isPaid"
|
|
89
|
+
/>
|
|
39
90
|
<q-form
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
91
|
+
ref="billetForm"
|
|
92
|
+
:action="payment ? payment.invoiceUrl : ''"
|
|
93
|
+
method="post"
|
|
94
|
+
target="_blank"
|
|
43
95
|
>
|
|
44
|
-
<input type="hidden" name="DC" :value="itauHash"
|
|
45
|
-
<q-btn
|
|
46
|
-
type ="submit"
|
|
47
|
-
icon ="money"
|
|
48
|
-
size ="lg"
|
|
49
|
-
color ="primary"
|
|
50
|
-
label ="Gerar boleto"
|
|
51
|
-
@click ="loadOnFocus = true"
|
|
52
|
-
:disable="isPaid"
|
|
53
|
-
/>
|
|
96
|
+
<input type="hidden" name="DC" :value="itauHash"/>
|
|
54
97
|
</q-form>
|
|
55
98
|
</div>
|
|
56
99
|
</div>
|
|
@@ -58,13 +101,10 @@
|
|
|
58
101
|
<!-- PAID MESSAGE -->
|
|
59
102
|
|
|
60
103
|
<div class="col-12" v-if="payment !== null && isPaid">
|
|
61
|
-
<div
|
|
62
|
-
class="row items-center justify-center"
|
|
63
|
-
style="min-height: 90vh;"
|
|
64
|
-
>
|
|
104
|
+
<div class="row items-center justify-center" style="min-height: 90vh;">
|
|
65
105
|
<q-banner class="text-white bg-positive text-center text-h3" rounded>
|
|
66
106
|
<template v-slot:avatar>
|
|
67
|
-
<q-icon name="thumb_up" color="white"
|
|
107
|
+
<q-icon name="thumb_up" color="white"/>
|
|
68
108
|
</template>
|
|
69
109
|
O boleto foi pago
|
|
70
110
|
</q-banner>
|
|
@@ -74,23 +114,31 @@
|
|
|
74
114
|
</template>
|
|
75
115
|
|
|
76
116
|
<script>
|
|
77
|
-
import {
|
|
78
|
-
import
|
|
117
|
+
import {mapActions, mapGetters} from 'vuex';
|
|
118
|
+
import axios from 'axios';
|
|
119
|
+
import {ENTRYPOINT} from '../../../../../../../../src/config/entrypoint';
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
|
|
79
123
|
|
|
80
124
|
export default {
|
|
81
125
|
props: {
|
|
82
126
|
invoiceId: {
|
|
83
|
-
type
|
|
127
|
+
type: String,
|
|
84
128
|
required: true,
|
|
85
129
|
},
|
|
86
|
-
orderId
|
|
87
|
-
type
|
|
130
|
+
orderId: {
|
|
131
|
+
type: String,
|
|
88
132
|
required: true,
|
|
89
133
|
},
|
|
90
134
|
},
|
|
91
135
|
|
|
136
|
+
components: {
|
|
137
|
+
|
|
138
|
+
},
|
|
139
|
+
|
|
92
140
|
mounted() {
|
|
93
|
-
window.addEventListener
|
|
141
|
+
window.addEventListener('focus', this.loadItauDataOnFocus);
|
|
94
142
|
},
|
|
95
143
|
|
|
96
144
|
beforeDestroy() {
|
|
@@ -103,12 +151,19 @@ export default {
|
|
|
103
151
|
|
|
104
152
|
data() {
|
|
105
153
|
return {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
154
|
+
invoiceUrlInter: null,
|
|
155
|
+
invoiceUrlSicred: null,
|
|
156
|
+
showBilletInter: null,
|
|
157
|
+
showBilletSicred: null,
|
|
158
|
+
isLoadingDownload: false,
|
|
159
|
+
isLoading: false,
|
|
160
|
+
payment: null,
|
|
161
|
+
isPaid: false,
|
|
162
|
+
itauHash: null,
|
|
163
|
+
showBillet: false,
|
|
111
164
|
loadOnFocus: false,
|
|
165
|
+
retrievingHash: false,
|
|
166
|
+
paymentInstitution: null // 'itau','inter'
|
|
112
167
|
};
|
|
113
168
|
},
|
|
114
169
|
|
|
@@ -116,27 +171,24 @@ export default {
|
|
|
116
171
|
...mapGetters({
|
|
117
172
|
myCompany: 'people/currentCompany',
|
|
118
173
|
}),
|
|
119
|
-
|
|
120
174
|
paymentIsPending() {
|
|
121
175
|
if (this.payment === null)
|
|
122
176
|
return false;
|
|
123
177
|
|
|
124
|
-
return
|
|
125
|
-
.includes(this.payment.status);
|
|
178
|
+
return this.payment.invoiceRealStatus === 'pending';
|
|
126
179
|
},
|
|
127
|
-
|
|
128
180
|
billetMustBeCreated() {
|
|
129
181
|
if (this.payment === null)
|
|
130
182
|
return false;
|
|
131
183
|
|
|
132
|
-
return this.payment.paymentType
|
|
184
|
+
return this.payment.paymentType === 'choose_pending' || this.payment.paymentStatus !== 'paid';
|
|
133
185
|
},
|
|
134
186
|
},
|
|
135
187
|
|
|
136
188
|
watch: {
|
|
137
189
|
myCompany(company) {
|
|
138
190
|
if (company !== null) {
|
|
139
|
-
this.
|
|
191
|
+
this.$router.push("/finance/receive");
|
|
140
192
|
}
|
|
141
193
|
},
|
|
142
194
|
|
|
@@ -144,28 +196,55 @@ export default {
|
|
|
144
196
|
if (!data)
|
|
145
197
|
return;
|
|
146
198
|
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
if (
|
|
154
|
-
this.
|
|
199
|
+
this.isPaid = data.paymentStatus === 'paid';
|
|
200
|
+
|
|
201
|
+
if (data.paymentType == 'billet') {
|
|
202
|
+
|
|
203
|
+
if (data.paymentStatus == 'created' && this.isPaid === false) {
|
|
204
|
+
|
|
205
|
+
if (this.paymentInstitution === 'itau') {
|
|
206
|
+
this.getItauHash().then(hash => {
|
|
207
|
+
if (hash !== null) {
|
|
208
|
+
this.showBillet = true;
|
|
209
|
+
}
|
|
210
|
+
});
|
|
211
|
+
|
|
212
|
+
} else if(this.paymentInstitution === 'inter') {
|
|
213
|
+
|
|
214
|
+
this.showBillet = false;
|
|
215
|
+
let urlTmp = ENTRYPOINT + `/vendor/pdf.js/web/viewer.html?file=/finance/${this.invoiceId}/download?timestamp${new Date().getTime()}`;
|
|
216
|
+
this.invoiceUrlInter = urlTmp;
|
|
217
|
+
this.isLoading = false;
|
|
218
|
+
this.showBilletInter = true;
|
|
219
|
+
|
|
220
|
+
}
|
|
155
221
|
else {
|
|
156
|
-
this.isPaid = false;
|
|
157
222
|
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
223
|
+
this.showBillet = false;
|
|
224
|
+
let urlTmp = ENTRYPOINT + `/download?invoiceUrl=${this.payment.invoiceUrl}`;
|
|
225
|
+
// let urlTmp = ENTRYPOINT + `/vendor/pdf.js/web/viewer.html?file=/finance/${this.invoiceId}/download?timestamp${new Date().getTime()}`;
|
|
226
|
+
this.invoiceUrlSicred = urlTmp;
|
|
227
|
+
this.isLoading = false;
|
|
228
|
+
this.showBilletSicred = true;
|
|
229
|
+
|
|
230
|
+
}
|
|
231
|
+
} else {
|
|
232
|
+
this.showBillet = false;
|
|
233
|
+
if (this.paymentInstitution === 'sicred') {
|
|
234
|
+
this.isPaid = data.status === 'paid';
|
|
166
235
|
}
|
|
167
236
|
}
|
|
237
|
+
|
|
168
238
|
}
|
|
239
|
+
|
|
240
|
+
this.$emit(
|
|
241
|
+
'billetStatus',
|
|
242
|
+
{
|
|
243
|
+
hasBillet: data.paymentType === 'billet' && data.paymentStatus === 'created',
|
|
244
|
+
isPaid: data.paymentStatus === 'paid'
|
|
245
|
+
}
|
|
246
|
+
);
|
|
247
|
+
|
|
169
248
|
},
|
|
170
249
|
|
|
171
250
|
showBillet(show) {
|
|
@@ -177,73 +256,198 @@ export default {
|
|
|
177
256
|
|
|
178
257
|
methods: {
|
|
179
258
|
...mapActions({
|
|
180
|
-
getItauData: '
|
|
259
|
+
getItauData: 'receiveInvoice/bankItau',
|
|
260
|
+
getInterData: 'receiveInvoice/bankInter',
|
|
261
|
+
getSicredData: 'receiveInvoice/bankSicred',
|
|
262
|
+
getBankPerInvoiceId: 'receiveInvoice/getBankPerInvoiceId',
|
|
181
263
|
}),
|
|
182
264
|
|
|
265
|
+
mountInvoiceUrlInter() {
|
|
266
|
+
let invoiceUrl = encodeURIComponent(this.payment.invoiceUrl);
|
|
267
|
+
return axios({
|
|
268
|
+
url: ENTRYPOINT + `/download?invoiceUrl=${invoiceUrl}×tamp=${new Date().getTime()}`,
|
|
269
|
+
method: 'get',
|
|
270
|
+
responseType: 'blob'
|
|
271
|
+
}).then((response) => {
|
|
272
|
+
let blob = new Blob([response.data], {type: 'application/pdf'}), url = window.URL.createObjectURL(blob);
|
|
273
|
+
return url;
|
|
274
|
+
});
|
|
275
|
+
},
|
|
276
|
+
|
|
277
|
+
clickDownloadBilletInter() {
|
|
278
|
+
let urlTmp = ENTRYPOINT + `/vendor/pdf.js/web/viewer.html?file=/finance/${this.invoiceId}/download?timestamp${new Date().getTime()}`;
|
|
279
|
+
window.open(urlTmp);
|
|
280
|
+
},
|
|
281
|
+
|
|
282
|
+
mountInvoiceUrlSicred() {
|
|
283
|
+
let invoiceUrl = encodeURIComponent(this.payment.invoiceUrl);
|
|
284
|
+
return axios({
|
|
285
|
+
url: ENTRYPOINT + `/download?invoiceUrl=${invoiceUrl}×tamp=${new Date().getTime()}`,
|
|
286
|
+
method: 'get',
|
|
287
|
+
responseType: 'blob'
|
|
288
|
+
}).then((response) => {
|
|
289
|
+
let blob = new Blob([response.data], {type: 'application/pdf'}), url = window.URL.createObjectURL(blob);
|
|
290
|
+
|
|
291
|
+
console.log(url);
|
|
292
|
+
|
|
293
|
+
return url;
|
|
294
|
+
});
|
|
295
|
+
},
|
|
296
|
+
|
|
297
|
+
clickDownloadBilletSicred() {
|
|
298
|
+
let urlTmp = ENTRYPOINT + `/download?invoiceUrl=${this.payment.invoiceUrl}`;
|
|
299
|
+
window.open(urlTmp);
|
|
300
|
+
},
|
|
301
|
+
|
|
302
|
+
getBank() {
|
|
303
|
+
return this.getBankPerInvoiceId({
|
|
304
|
+
invoiceId: this.invoiceId
|
|
305
|
+
}).then(data => {
|
|
306
|
+
if (data !== null) {
|
|
307
|
+
this.paymentInstitution = data.config_value;
|
|
308
|
+
this.getPaymentStatus();
|
|
309
|
+
return data;
|
|
310
|
+
}
|
|
311
|
+
return null;
|
|
312
|
+
}).catch(error => {
|
|
313
|
+
});
|
|
314
|
+
},
|
|
315
|
+
|
|
316
|
+
refresh() {
|
|
317
|
+
this.getPaymentStatus();
|
|
318
|
+
},
|
|
319
|
+
|
|
183
320
|
loadItauDataOnFocus() {
|
|
184
321
|
if (this.loadOnFocus) {
|
|
185
|
-
this.getPaymentStatus()
|
|
186
|
-
.
|
|
187
|
-
|
|
188
|
-
});
|
|
322
|
+
this.getPaymentStatus().then(data => {
|
|
323
|
+
this.loadOnFocus = false;
|
|
324
|
+
});
|
|
189
325
|
}
|
|
190
326
|
},
|
|
191
327
|
|
|
192
328
|
getItauHash() {
|
|
193
329
|
let params = {};
|
|
194
330
|
|
|
195
|
-
this.isLoading = true;
|
|
196
|
-
|
|
197
331
|
if (this.myCompany !== null)
|
|
198
332
|
params['myCompany'] = this.myCompany.id;
|
|
199
333
|
|
|
200
334
|
return this.getItauData({
|
|
201
335
|
invoiceId: this.invoiceId,
|
|
202
336
|
operation: 'itauhash',
|
|
203
|
-
params
|
|
204
|
-
})
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
337
|
+
params: params
|
|
338
|
+
}).then(data => {
|
|
339
|
+
if (data !== null) {
|
|
340
|
+
return this.itauHash = data;
|
|
341
|
+
}
|
|
342
|
+
return null;
|
|
343
|
+
}).catch(error => {
|
|
209
344
|
|
|
210
|
-
|
|
211
|
-
})
|
|
212
|
-
.catch(error => {
|
|
213
|
-
|
|
214
|
-
})
|
|
215
|
-
.finally(() => {
|
|
216
|
-
this.isLoading = false;
|
|
217
|
-
});
|
|
345
|
+
});
|
|
218
346
|
},
|
|
219
347
|
|
|
220
348
|
getPaymentStatus() {
|
|
349
|
+
|
|
350
|
+
if (this.isLoading) {
|
|
351
|
+
return null;
|
|
352
|
+
}
|
|
353
|
+
|
|
221
354
|
let params = {};
|
|
222
355
|
|
|
223
356
|
this.isLoading = true;
|
|
224
357
|
|
|
225
|
-
if (this.myCompany !== null)
|
|
358
|
+
if (this.myCompany !== null) {
|
|
226
359
|
params['myCompany'] = this.myCompany.id;
|
|
360
|
+
}
|
|
227
361
|
|
|
228
|
-
return this.
|
|
229
|
-
invoiceId: this.invoiceId,
|
|
230
|
-
operation: 'payment',
|
|
231
|
-
params : params
|
|
232
|
-
})
|
|
233
|
-
.then(data => {
|
|
234
|
-
if (data !== null) {
|
|
235
|
-
return this.payment = data;
|
|
236
|
-
}
|
|
362
|
+
return this.getBank().then(data2 => {
|
|
237
363
|
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
364
|
+
if (this.paymentInstitution === 'itau') { // ------------------------------ Banco 'itau'
|
|
365
|
+
|
|
366
|
+
this.getItauData({
|
|
367
|
+
invoiceId: this.invoiceId,
|
|
368
|
+
operation: 'payment',
|
|
369
|
+
params: params
|
|
370
|
+
}).then(data => {
|
|
371
|
+
if (data !== null) {
|
|
372
|
+
return this.payment = data;
|
|
373
|
+
}
|
|
374
|
+
return null;
|
|
375
|
+
}).catch(error => {
|
|
376
|
+
|
|
377
|
+
}).finally(() => {
|
|
378
|
+
this.isLoading = false;
|
|
379
|
+
// this.isLoading = false;
|
|
380
|
+
});
|
|
381
|
+
|
|
382
|
+
} else if(this.paymentInstitution === 'inter'){ // ------------------------------ Banco 'inter'
|
|
383
|
+
|
|
384
|
+
this.getInterData({
|
|
385
|
+
invoiceId: this.invoiceId,
|
|
386
|
+
operation: 'payment',
|
|
387
|
+
params: params
|
|
388
|
+
}).then(data => {
|
|
389
|
+
if (data !== null) {
|
|
390
|
+
if (!data.response.success) {
|
|
391
|
+
let msgErro = data.response.error;
|
|
392
|
+
this.$q.notify({
|
|
393
|
+
message: msgErro,
|
|
394
|
+
html: true,
|
|
395
|
+
group: false,
|
|
396
|
+
multiLine: true,
|
|
397
|
+
position: 'bottom',
|
|
398
|
+
type: 'negative',
|
|
399
|
+
});
|
|
400
|
+
return this.payment = null;
|
|
401
|
+
} else {
|
|
402
|
+
return this.payment = data.response.data;
|
|
403
|
+
}
|
|
404
|
+
} else {
|
|
405
|
+
return this.payment = null;
|
|
406
|
+
}
|
|
407
|
+
return null;
|
|
408
|
+
}).catch(error => {
|
|
409
|
+
console.table(error);
|
|
410
|
+
}).finally(() => {
|
|
411
|
+
this.isLoading = false;
|
|
412
|
+
});
|
|
413
|
+
|
|
414
|
+
}
|
|
415
|
+
else { // ------------------------------ Banco 'Sicred'
|
|
416
|
+
|
|
417
|
+
this.getSicredData({
|
|
418
|
+
invoiceId: this.invoiceId,
|
|
419
|
+
operation: 'payment',
|
|
420
|
+
params: params
|
|
421
|
+
}).then(data => {
|
|
422
|
+
if (data !== null) {
|
|
423
|
+
if (!data.response.success) {
|
|
424
|
+
let msgErro = data.response.error;
|
|
425
|
+
this.$q.notify({
|
|
426
|
+
message: msgErro,
|
|
427
|
+
html: true,
|
|
428
|
+
group: false,
|
|
429
|
+
multiLine: true,
|
|
430
|
+
position: 'bottom',
|
|
431
|
+
type: 'negative',
|
|
432
|
+
});
|
|
433
|
+
return this.payment = null;
|
|
434
|
+
} else {
|
|
435
|
+
return this.payment = data.response.data;
|
|
436
|
+
}
|
|
437
|
+
} else {
|
|
438
|
+
return this.payment = null;
|
|
439
|
+
}
|
|
440
|
+
return null;
|
|
441
|
+
}).catch(error => {
|
|
442
|
+
console.table(error);
|
|
443
|
+
}).finally(() => {
|
|
444
|
+
this.isLoading = false;
|
|
445
|
+
});
|
|
446
|
+
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
});
|
|
246
450
|
},
|
|
247
451
|
},
|
|
248
452
|
};
|
|
249
|
-
</script>
|
|
453
|
+
</script>
|