|
|
|
@ -2,7 +2,7 @@
|
|
|
|
|
|
|
|
|
|
<div id="payment">
|
|
|
|
|
<img :src="payreqURI" />
|
|
|
|
|
<timer v-if="invoice.status != 'paid'" :expires="invoice.expires_at" :expired="expired"></timer>
|
|
|
|
|
<timer v-if="showTimer" :expires="expires" :expired="expired"></timer>
|
|
|
|
|
<p v-if="invoice.status == 'paid'">Paid on {{paidAt}}</p>
|
|
|
|
|
<p class='paid' v-if="paid">PAID</p>
|
|
|
|
|
<p class='unpaid' v-if="unpaid">UNPAID</p>
|
|
|
|
@ -23,6 +23,7 @@ export default {
|
|
|
|
|
return {
|
|
|
|
|
payreqURI: "",
|
|
|
|
|
expired: false,
|
|
|
|
|
expires: 0,
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
props: ['invoice', 'uploadId', 'status'],
|
|
|
|
@ -47,12 +48,10 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted(){
|
|
|
|
|
this.expired = (this.invoice.status === 'expired')
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
computed: {
|
|
|
|
|
paidAt: function(){
|
|
|
|
|
|
|
|
|
|
return new Date(this.invoice.paid_at).toGMTString();
|
|
|
|
|
},
|
|
|
|
|
paid: function() {
|
|
|
|
@ -62,14 +61,24 @@ export default {
|
|
|
|
|
unpaid: function(){
|
|
|
|
|
return this.invoice.status == 'unpaid';
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
showTimer: function(){
|
|
|
|
|
return !this.paid;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
invoice: function(val) {
|
|
|
|
|
if (new Date(val.expires_at*1000) - new Date() <= 0){
|
|
|
|
|
this.expired = true;
|
|
|
|
|
if (val){
|
|
|
|
|
this.expires = val.expires_at;
|
|
|
|
|
|
|
|
|
|
if (new Date(val.expires_at*1000) - new Date() <= 0){
|
|
|
|
|
this.expired = true;
|
|
|
|
|
} else {
|
|
|
|
|
this.expired = false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.makeLnQR(val.payreq)
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
this.makeLnQR(val.payreq)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
components:{
|
|
|
|
|