- transaction type for metered billing in transaction tables

This commit is contained in:
Čarodej
2021-12-23 17:12:51 +01:00
parent f88ed999c5
commit 0194e546fd
9 changed files with 99 additions and 42 deletions
@@ -13,7 +13,7 @@
<small v-if="description" class="text-xs text-gray-500 pt-2 leading-4 block" v-html="description"></small>
<!--Input Description-->
<span v-if="error" class="text-red-700 pt-2 text-xs">
<span v-if="error" class="text-red pt-2 text-xs">
{{ error }}
</span>
</div>
+10 -3
View File
@@ -343,7 +343,6 @@ const FunctionHelpers = {
}
Vue.prototype.$getTransactionStatusColor = function (status) {
return {
'completed': 'green',
'cancelled': 'yellow',
@@ -351,11 +350,19 @@ const FunctionHelpers = {
}[status]
}
Vue.prototype.$getTransactionTypeColor = function (type) {
return {
'credit': 'green',
'charge': 'purple',
'withdrawal': 'red',
}[type]
}
Vue.prototype.$getTransactionTypeTextColor = function (type) {
return {
'withdrawal': 'text-red-500',
'credit': 'text-green-500',
'withdrawal': 'text-red',
'credit': 'text-green',
'charge': '',
}[type]
}
+5 -2
View File
@@ -36,9 +36,12 @@
</span>
</td>
<td>
<ColorLabel :color="$getTransactionStatusColor(row.data.attributes.status)">
<ColorLabel v-if="config.subscriptionType === 'fixed'" :color="$getTransactionStatusColor(row.data.attributes.status)">
{{ row.data.attributes.status }}
</ColorLabel>
<ColorLabel v-if="config.subscriptionType === 'metered'" :color="$getTransactionTypeColor(row.data.attributes.type)">
{{ row.data.attributes.type }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold" :class="$getTransactionTypeTextColor(row.data.attributes.type)">
@@ -124,7 +127,7 @@
},
computed: {
...mapGetters([
'config'
'config',
]),
},
data() {
@@ -3,15 +3,12 @@
<FormLabel>
{{ $t('admin_page_plans.form.title_delete') }}
</FormLabel>
<InfoBox>
<p>{{ $t('admin_page_plans.disclaimer_delete_plan') }}</p>
</InfoBox>
<ValidationObserver ref="deletePlan" @submit.prevent="deletePlan" v-slot="{ invalid }" tag="form">
<ValidationProvider tag="div" v-slot="{ errors }" mode="passive" name="Plan name" :rules="'required|is:' + plan.attributes.name">
<AppInputText :title="$t('admin_page_user.label_delete_user', {user: plan.attributes.name})" :error="errors[0]" :is-last="true">
<div class="flex space-x-4">
<AppInputText :title="$t('admin_page_user.label_delete_user', {user: plan.attributes.name})" :description="$t('admin_page_plans.disclaimer_delete_plan')" :error="errors[0]" :is-last="true">
<div class="sm:flex sm:space-x-4 sm:space-y-0 space-y-4">
<input v-model="planName" :placeholder="$t('admin_page_plans.form.name_delete_plac')" type="text" :class="{'border-red-700': errors[0]}" class="focus-border-theme input-dark" />
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="danger" class="submit-button">
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="danger" class="sm:w-auto w-full">
{{ $t('admin_page_plans.delete_plan_button') }}
</ButtonBase>
</div>
@@ -3,20 +3,17 @@
<FormLabel>
{{ $t('user_box_delete.title') }}
</FormLabel>
<InfoBox>
<p>{{ $t('user_box_delete.description') }}</p>
</InfoBox>
<ValidationObserver ref="deleteUser" @submit.prevent="deleteUser" v-slot="{ invalid }" tag="form">
<ValidationProvider tag="div" v-slot="{ errors }" mode="passive" name="User name" rules="required">
<AppInputText :title="$t('admin_page_user.label_delete_user', {user: user.data.relationships.settings.data.attributes.name})" :error="errors[0]" :is-last="true">
<div class="flex space-x-4">
<AppInputText :title="$t('admin_page_user.label_delete_user', {user: user.data.relationships.settings.data.attributes.name})" :description="$t('user_box_delete.description')" :error="errors[0]" :is-last="true">
<div class="sm:flex sm:space-x-4 sm:space-y-0 space-y-4">
<input v-model="userName"
:placeholder="$t('admin_page_user.placeholder_delete_user')"
type="text"
class="focus-border-theme input-dark"
:class="{'border-red-700': errors[0]}"
/>
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="danger" class="submit-button">
<ButtonBase :loading="isSendingRequest" :disabled="isSendingRequest" type="submit" button-style="danger" class="sm:w-auto w-full">
{{ $t('admin_page_user.delete_user') }}
</ButtonBase>
</div>
@@ -33,9 +33,12 @@
</span>
</td>
<td>
<ColorLabel :color="$getTransactionStatusColor(row.data.attributes.status)">
<ColorLabel v-if="config.subscriptionType === 'fixed'" :color="$getTransactionStatusColor(row.data.attributes.status)">
{{ row.data.attributes.status }}
</ColorLabel>
<ColorLabel v-if="config.subscriptionType === 'metered'" :color="$getTransactionTypeColor(row.data.attributes.type)">
{{ row.data.attributes.type }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold" :class="$getTransactionTypeTextColor(row.data.attributes.type)">
@@ -149,9 +149,12 @@
</span>
</td>
<td>
<ColorLabel :color="$getTransactionStatusColor(row.data.attributes.status)">
<ColorLabel v-if="config.subscriptionType === 'fixed'" :color="$getTransactionStatusColor(row.data.attributes.status)">
{{ row.data.attributes.status }}
</ColorLabel>
<ColorLabel v-if="config.subscriptionType === 'metered'" :color="$getTransactionTypeColor(row.data.attributes.type)">
{{ row.data.attributes.type }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold" :class="$getTransactionTypeTextColor(row.data.attributes.type)">
@@ -220,6 +223,7 @@
},
computed: {
...mapGetters([
'config',
'user',
]),
},