Page MenuHomePhorge
Differential D1360 Diff 3604 src/resources/vue/Admin/User.vue

Changeset View

Standalone View

View Options

src/resources/vue/Admin/User.vue

<template> <template>
<div class="container"> <div class="container">
<div class="card" id="user-info"> <div class="card" id="user-info">
<div class="card-body"> <div class="card-body">
<div class="card-title">{{ user.email }}</div> <h1 class="card-title">{{ user.email }}</h1>
<div class="card-text"> <div class="card-text">
<form class="read-only"> <form class="read-only">
<div v-if="user.wallet.user_id != user.id" class="form-group row"> <div v-if="user.wallet.user_id != user.id" class="form-group row">
<label for="manager" class="col-sm-4 col-form-label">Managed by</label> <label for="manager" class="col-sm-4 col-form-label">Managed by</label>
<div class="col-sm-8"> <div class="col-sm-8">
<span class="form-control-plaintext" id="manager"> <span class="form-control-plaintext" id="manager">
<router-link :to="{ path: '/user/' + user.wallet.user_id }">{{ user.wallet.user_email }}</router-link> <router-link :to="{ path: '/user/' + user.wallet.user_id }">{{ user.wallet.user_email }}</router-link>
</span> </span>
▲ Show 20 Lines • Show All 55 Lines • ▼ Show 20 Lines <div class="container">
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label for="country" class="col-sm-4 col-form-label">Country</label> <label for="country" class="col-sm-4 col-form-label">Country</label>
<div class="col-sm-8"> <div class="col-sm-8">
<span class="form-control-plaintext" id="country">{{ user.country }}</span> <span class="form-control-plaintext" id="country">{{ user.country }}</span>
</div> </div>
</div> </div>
</form>
<div class="mt-2">
<button v-if="!user.isSuspended" id="button-suspend" class="btn btn-warning" type="button" @click="suspendUser">Suspend</button> <button v-if="!user.isSuspended" id="button-suspend" class="btn btn-warning" type="button" @click="suspendUser">Suspend</button>
<button v-if="user.isSuspended" id="button-unsuspend" class="btn btn-warning" type="button" @click="unsuspendUser">Unsuspend</button> <button v-if="user.isSuspended" id="button-unsuspend" class="btn btn-warning" type="button" @click="unsuspendUser">Unsuspend</button>
</form> </div>
</div> </div>
</div> </div>
</div> </div>
<ul class="nav nav-tabs mt-3" role="tablist"> <ul class="nav nav-tabs mt-3" role="tablist">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" id="tab-finances" href="#user-finances" role="tab" aria-controls="user-finances" aria-selected="true"> <a class="nav-link active" id="tab-finances" href="#user-finances" role="tab" aria-controls="user-finances" aria-selected="true">
Finances Finances
</a> </a>
Show All 17 Lines <div class="container">
<a class="nav-link" id="tab-users" href="#user-users" role="tab" aria-controls="user-users" aria-selected="false"> <a class="nav-link" id="tab-users" href="#user-users" role="tab" aria-controls="user-users" aria-selected="false">
Users ({{ users.length }}) Users ({{ users.length }})
</a> </a>
</li> </li>
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane show active" id="user-finances" role="tabpanel" aria-labelledby="tab-finances"> <div class="tab-pane show active" id="user-finances" role="tabpanel" aria-labelledby="tab-finances">
<div class="card-body"> <div class="card-body">
<div class="card-title">Account balance <span :class="wallet.balance < 0 ? 'text-danger' : 'text-success'"><strong>{{ $root.price(wallet.balance) }}</strong></span></div> <h2 class="card-title">Account balance <span :class="wallet.balance < 0 ? 'text-danger' : 'text-success'"><strong>{{ $root.price(wallet.balance) }}</strong></span></h2>
<div class="card-text"> <div class="card-text">
<form class="read-only"> <form class="read-only">
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-4 col-form-label">Discount</label> <label class="col-sm-4 col-form-label">Discount</label>
<div class="col-sm-8"> <div class="col-sm-8">
<span class="form-control-plaintext" id="discount"> <span class="form-control-plaintext" id="discount">
<span>{{ wallet.discount ? (wallet.discount + '% - ' + wallet.discount_description) : 'none' }}</span> <span>{{ wallet.discount ? (wallet.discount + '% - ' + wallet.discount_description) : 'none' }}</span>
<button type="button" class="btn btn-secondary btn-sm" @click="discountEdit">Edit</button> <button type="button" class="btn btn-secondary btn-sm" @click="discountEdit">Edit</button>
Show All 11 Lines <div class="container">
</div> </div>
</div> </div>
<div class="form-group row" v-if="wallet.providerLink"> <div class="form-group row" v-if="wallet.providerLink">
<label class="col-sm-4 col-form-label">{{ capitalize(wallet.provider) }} ID</label> <label class="col-sm-4 col-form-label">{{ capitalize(wallet.provider) }} ID</label>
<div class="col-sm-8"> <div class="col-sm-8">
<span class="form-control-plaintext" v-html="wallet.providerLink"></span> <span class="form-control-plaintext" v-html="wallet.providerLink"></span>
</div> </div>
</div> </div>
</form>
<div class="mt-2">
<button id="button-award" class="btn btn-success" type="button" @click="awardDialog">Add bonus</button> <button id="button-award" class="btn btn-success" type="button" @click="awardDialog">Add bonus</button>
<button id="button-penalty" class="btn btn-danger" type="button" @click="penalizeDialog">Add penalty</button> <button id="button-penalty" class="btn btn-danger" type="button" @click="penalizeDialog">Add penalty</button>
</form>
</div> </div>
</div> </div>
<h2 class="card-title mt-4">Transactions</h2>
bohlenderUnsubmitted
Not Done
Inline Actions

shouldn't the title be conditionally rendered as well ?

bohlender: shouldn't the title be conditionally rendered as well ?
machniakAuthorUnsubmitted
Done
Inline Actions

The v-if here is not to not render the table, but to render it when it is ready. So, it will always be there.

machniak: The v-if here is not to not render the table, but to render it when it is ready. So, it will…
<transaction-log v-if="wallet.id && !walletReload" class="card-text" :wallet-id="wallet.id" :is-admin="true"></transaction-log>
</div>
</div> </div>
<div class="tab-pane" id="user-aliases" role="tabpanel" aria-labelledby="tab-aliases"> <div class="tab-pane" id="user-aliases" role="tabpanel" aria-labelledby="tab-aliases">
<div class="card-body"> <div class="card-body">
<div class="card-text"> <div class="card-text">
<table class="table table-sm table-hover"> <table class="table table-sm table-hover">
<thead class="thead-light"> <thead class="thead-light">
<tr> <tr>
<th scope="col">Email address</th> <th scope="col">Email address</th>
▲ Show 20 Lines • Show All 181 Lines • ▼ Show 20 Lines <div class="container">
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import TransactionLog from '../Widgets/TransactionLog'
export default { export default {
beforeRouteUpdate (to, from, next) { beforeRouteUpdate (to, from, next) {
// An event called when the route that renders this component has changed, // An event called when the route that renders this component has changed,
// but this component is reused in the new route. // but this component is reused in the new route.
// Required to handle links from /user/XXX to /user/YYY // Required to handle links from /user/XXX to /user/YYY
next() next()
this.$parent.routerReload() this.$parent.routerReload()
}, },
components: {
TransactionLog
},
data() { data() {
return { return {
oneoff_amount: '', oneoff_amount: '',
oneoff_currency: 'CHF', oneoff_currency: 'CHF',
oneoff_description: '', oneoff_description: '',
oneoff_negative: false, oneoff_negative: false,
discount: 0, discount: 0,
discount_description: '', discount_description: '',
discounts: [], discounts: [],
external_email: '', external_email: '',
wallet: {}, wallet: {},
walletReload: false,
domains: [], domains: [],
skus: [], skus: [],
users: [], users: [],
user: { user: {
aliases: [], aliases: [],
wallet: {}, wallet: {},
skus: {}, skus: {},
} }
▲ Show 20 Lines • Show All 121 Lines • ▼ Show 20 Lines export default {
this.dialog = $('#oneoff-dialog').on('shown.bs.modal', event => { this.dialog = $('#oneoff-dialog').on('shown.bs.modal', event => {
this.$root.clearFormValidation(event.target) this.$root.clearFormValidation(event.target)
$(event.target).find('#oneoff_amount').focus() $(event.target).find('#oneoff_amount').focus()
}).modal() }).modal()
}, },
penalizeDialog() { penalizeDialog() {
this.oneOffDialog(true) this.oneOffDialog(true)
}, },
reload() {
// this is to reload transaction log
this.walletReload = true
this.$nextTick(function() { this.walletReload = false })
},
submitDiscount() { submitDiscount() {
$('#discount-dialog').modal('hide') $('#discount-dialog').modal('hide')
axios.put('/api/v4/wallets/' + this.user.wallets[0].id, { discount: this.wallet.discount_id }) axios.put('/api/v4/wallets/' + this.user.wallets[0].id, { discount: this.wallet.discount_id })
.then(response => { .then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.$toast.success(response.data.message) this.$toast.success(response.data.message)
this.wallet = Object.assign({}, this.wallet, response.data) this.wallet = Object.assign({}, this.wallet, response.data)
▲ Show 20 Lines • Show All 41 Lines • ▼ Show 20 Lines export default {
axios.post('/api/v4/wallets/' + wallet_id + '/one-off', post) axios.post('/api/v4/wallets/' + wallet_id + '/one-off', post)
.then(response => { .then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.dialog.modal('hide') this.dialog.modal('hide')
this.$toast.success(response.data.message) this.$toast.success(response.data.message)
this.wallet = Object.assign({}, this.wallet, {balance: response.data.balance}) this.wallet = Object.assign({}, this.wallet, {balance: response.data.balance})
this.oneoff_amount = '' this.oneoff_amount = ''
this.oneoff_description = '' this.oneoff_description = ''
this.reload()
} }
}) })
}, },
suspendUser() { suspendUser() {
axios.post('/api/v4/users/' + this.user.id + '/suspend', {}) axios.post('/api/v4/users/' + this.user.id + '/suspend', {})
.then(response => { .then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.$toast.success(response.data.message) this.$toast.success(response.data.message)
Show All 16 Lines