Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Wallet.vue
<template> | <template> | ||||
<div class="container" dusk="wallet-component"> | <div class="container" dusk="wallet-component"> | ||||
<div id="wallet" class="card"> | <div id="wallet" class="card"> | ||||
<div class="card-body"> | <div class="card-body"> | ||||
<div class="card-title">Account balance</div> | <div class="card-title">Account balance</div> | ||||
<div class="card-text"> | <div class="card-text"> | ||||
<p>Current account balance is | <p>Current account balance is | ||||
<span :class="balance < 0 ? 'text-danger' : 'text-success'"><strong>{{ $root.price(balance) }}</strong></span> | <span :class="balance < 0 ? 'text-danger' : 'text-success'"><strong>{{ $root.price(balance) }}</strong></span> | ||||
</p> | </p> | ||||
<button type="button" class="btn btn-primary" @click="payment()">Add 10 bucks to my wallet</button> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
balance: 0, | balance: 0, | ||||
} | } | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
this.balance = 0 | this.balance = 0 | ||||
// TODO: currencies, multi-wallets, accounts | // TODO: currencies, multi-wallets, accounts | ||||
this.$store.state.authInfo.wallets.forEach(wallet => { | this.$store.state.authInfo.wallets.forEach(wallet => { | ||||
this.balance += wallet.balance | this.balance += wallet.balance | ||||
}) | }) | ||||
}, | }, | ||||
methods: { | methods: { | ||||
payment() { | |||||
axios.post('/api/v4/payments', {amount: 1000}) | |||||
.then(response => { | |||||
if (response.data.redirectUrl) { | |||||
location.href = response.data.redirectUrl | |||||
} | |||||
}) | |||||
} | |||||
} | } | ||||
} | } | ||||
</script> | </script> |