mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
interim status of the revised transaction list
This commit is contained in:
ogerly
parent
da9fccb78f
commit
ae75ba7487
@ -5,104 +5,121 @@
|
||||
</span>
|
||||
|
||||
<div v-if="decaytyp === 'new' || decaytyp === 'decayLastTransaction'">
|
||||
<div class="d-flex">
|
||||
<div style="width: 100%" class="text-center pb-3">
|
||||
<b-icon icon="droplet-half" height="12" class="mb-2" />
|
||||
<b>{{ $t('decay.calculation_decay') }}</b>
|
||||
</div>
|
||||
<!-- if decay.start === null - Wenn kein decay angegeben dan ist es die erste Transaktion -->
|
||||
<div v-if="decay.start === null" class="mt-3 mb-3 text-center">
|
||||
<b>{{ $t('decay.first_transaction') }}</b>
|
||||
</div>
|
||||
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<!-- <div v-if="!decay.decayStartBlock">{{ $t('decay.last_transaction') }}</div> -->
|
||||
<div>{{ $t('decay.last_transaction') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div>
|
||||
<span v-if="decay.start">
|
||||
{{ $d(new Date(decay.start), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<!-- <div v-if="!decay.decayStartBlock">{{ $t('decay.past_time') }}</div> -->
|
||||
<div>{{ $t('decay.past_time') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<span v-if="duration">
|
||||
<span v-if="duration.years > 0">{{ duration.years }} {{ $t('decay.year') }},</span>
|
||||
<span v-if="duration.months > 0">{{ duration.months }} {{ $t('decay.months') }},</span>
|
||||
<span v-if="duration.days > 0">{{ duration.days }} {{ $t('decay.days') }},</span>
|
||||
<span v-if="duration.hours > 0">{{ duration.hours }} {{ $t('decay.hours') }},</span>
|
||||
<span v-if="duration.minutes > 0">
|
||||
{{ duration.minutes }} {{ $t('decay.minutes') }},
|
||||
</span>
|
||||
<span v-if="duration.seconds > 0">
|
||||
{{ duration.seconds }} {{ $t('decay.seconds') }}
|
||||
</span>
|
||||
</span>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- if balanceDate < decayStartBlock - Wenn die transaktion vor dem einführen der dacay function liegt. -->
|
||||
<div
|
||||
v-else-if="new Date(balanceDate).getTime() < new Date(decayStartBlock).getTime()"
|
||||
class="mt-3 mb-3 text-center"
|
||||
>
|
||||
<b>{{ $t('decay.befor_startblock_transaction') }}</b>
|
||||
</div>
|
||||
|
||||
<!-- Decay-->
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.decay') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="decaytyp === 'new'">- {{ $n(decay.decay, 'decimal') }}</div>
|
||||
<div v-if="decaytyp === 'decayLastTransaction'">
|
||||
{{ $n(decay.decay + amount, 'decimal') }} GDD - {{ $n(decay.decay, 'decimal') }} GDD =
|
||||
<b>{{ $n(amount, 'decimal') }} GDD</b>
|
||||
<div v-else>
|
||||
<div class="d-flex">
|
||||
<div style="width: 100%" class="text-center pb-3">
|
||||
<b-icon icon="droplet-half" height="12" class="mb-2" />
|
||||
<b>{{ $t('decay.calculation_decay') }}</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr class="mt-2 mb-2" />
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col class="text-center pt-3 pb-2">
|
||||
<b>{{ $t('decay.calculation_total') }}</b>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Type-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div v-if="typeId === 'SEND'">{{ $t('decay.sent') }}</div>
|
||||
<div v-if="typeId === 'RECEIVE'">{{ $t('decay.received') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="typeId === 'SEND'">{{ $n(amount, 'decimal') }}</div>
|
||||
<div v-if="typeId === 'RECEIVE'">{{ $n(amount, 'decimal') }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Decay-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.decay') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div>{{ $n(decay.decay, 'decimal') }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Total-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.total') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="typeId === 'SEND'">
|
||||
<b>{{ $n(amount + decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
<div v-if="typeId === 'RECEIVE'">
|
||||
<b>{{ $n(amount - decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
<div v-if="typeId === 'CREATION'">
|
||||
<b>{{ $n(amount - decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<!-- <div v-if="!decay.decayStartBlock">{{ $t('decay.last_transaction') }}</div> -->
|
||||
<div>{{ $t('decay.last_transaction') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div>
|
||||
<span v-if="decay.start">
|
||||
{{ $d(new Date(decay.start), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<!-- <div v-if="!decay.decayStartBlock">{{ $t('decay.past_time') }}</div> -->
|
||||
<div>{{ $t('decay.past_time') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<span v-if="duration">
|
||||
<span v-if="duration.years > 0">{{ duration.years }} {{ $t('decay.year') }},</span>
|
||||
<span v-if="duration.months > 0">
|
||||
{{ duration.months }} {{ $t('decay.months') }},
|
||||
</span>
|
||||
<span v-if="duration.days > 0">{{ duration.days }} {{ $t('decay.days') }},</span>
|
||||
<span v-if="duration.hours > 0">{{ duration.hours }} {{ $t('decay.hours') }},</span>
|
||||
<span v-if="duration.minutes > 0">
|
||||
{{ duration.minutes }} {{ $t('decay.minutes') }},
|
||||
</span>
|
||||
<span v-if="duration.seconds > 0">
|
||||
{{ duration.seconds }} {{ $t('decay.seconds') }}
|
||||
</span>
|
||||
</span>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Decay-->
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.decay') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="decaytyp === 'new'">- {{ $n(decay.decay, 'decimal') }}</div>
|
||||
<div v-if="decaytyp === 'decayLastTransaction'">
|
||||
{{ $n(decay.decay + amount, 'decimal') }} GDD - {{ $n(decay.decay, 'decimal') }} GDD =
|
||||
<b>{{ $n(amount, 'decimal') }} GDD</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr class="mt-2 mb-2" />
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col class="text-center pt-3 pb-2">
|
||||
<b>{{ $t('decay.calculation_total') }}</b>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Type-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div v-if="typeId === 'SEND'">{{ $t('decay.sent') }}</div>
|
||||
<div v-if="typeId === 'RECEIVE'">{{ $t('decay.received') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="typeId === 'SEND'">{{ $n(amount, 'decimal') }}</div>
|
||||
<div v-if="typeId === 'RECEIVE'">{{ $n(amount, 'decimal') }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Decay-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.decay') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div>{{ $n(decay.decay, 'decimal') }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- Total-->
|
||||
<b-row v-if="decaytyp === 'new'">
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.total') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div v-if="typeId === 'SEND'">
|
||||
<b>{{ $n(amount + decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
<div v-if="typeId === 'RECEIVE'">
|
||||
<b>{{ $n(amount - decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
<div v-if="typeId === 'CREATION'">
|
||||
<b>{{ $n(amount - decay.decay, 'decimal') }}</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -112,6 +129,8 @@ export default {
|
||||
props: {
|
||||
amount: { type: String, default: '0' },
|
||||
typeId: { type: String, default: '' },
|
||||
balanceDate: { type: String },
|
||||
decayStartBlock: { type: String },
|
||||
decay: {
|
||||
decay: '',
|
||||
start: 0,
|
||||
|
||||
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div>
|
||||
<div @click="visible = !visible">
|
||||
{{ amount }}, {{ balance }}, {{ balanceDate }}, {{ decay }}, {{ id }}, {{ linkedUser }},
|
||||
{{ memo }}, {{ properties }}
|
||||
|
||||
<!-- Collaps Icon -->
|
||||
<div class="text-right" style="width: 95%; position: absolute">
|
||||
<b-icon
|
||||
:icon="visible ? 'caret-up-square' : 'caret-down-square'"
|
||||
:class="visible ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<div class="gdd-transaction-list-item-icon">
|
||||
<b-icon :icon="properties.icon" :class="properties.class" />
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Betrag / Name Email -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<span class="gdd-transaction-list-item-operator">
|
||||
{{ properties.operator }}
|
||||
</span>
|
||||
<span class="gdd-transaction-list-item-amount">
|
||||
{{ $n(amount, 'decimal') }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
{{
|
||||
typeId !== 'DECAY'
|
||||
? linkedUser.firstName + ' ' + linkedUser.lastName
|
||||
: $t('decay.decay_since_last_transaction')
|
||||
}}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.memo') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-message">{{ memo }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Datum -->
|
||||
<b-row v-if="typeId !== 'DECAY'">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.date') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-date">
|
||||
{{ $d(new Date(balanceDate), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Decay -->
|
||||
<b-row v-if="decay">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<b-icon v-if="typeId != 'DECAY'" icon="droplet-half" height="15" class="mb-1" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-decay">
|
||||
<decay-information v-if="decay" decaytyp="short" :decay="decay" />
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4" v-model="visible">
|
||||
<decay-information
|
||||
decaytyp="new"
|
||||
:amount="amount"
|
||||
:decay="decay"
|
||||
:typeId="typeId"
|
||||
:balanceDate="balanceDate"
|
||||
/>
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import DecayInformation from '../DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'slot-creation',
|
||||
components: {
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
amount: {
|
||||
type: String,
|
||||
},
|
||||
balance: {
|
||||
type: String,
|
||||
},
|
||||
balanceDate: {
|
||||
type: String,
|
||||
},
|
||||
decay: {
|
||||
type: Object,
|
||||
},
|
||||
id: {
|
||||
type: Number,
|
||||
},
|
||||
linkedUser: {
|
||||
type: Object,
|
||||
},
|
||||
memo: {
|
||||
type: String,
|
||||
},
|
||||
typeId: {
|
||||
type: String,
|
||||
},
|
||||
properties: {
|
||||
type: Object,
|
||||
},
|
||||
getCollapseState: {
|
||||
type: Boolean,
|
||||
},
|
||||
decayStartBlock: { type: Date },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
116
frontend/src/components/transaction-slots/TransactionDecay.vue
Normal file
116
frontend/src/components/transaction-slots/TransactionDecay.vue
Normal file
@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<div>
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<div class="text-right" style="width: 95%; position: absolute">
|
||||
<b-icon
|
||||
:icon="visible ? 'caret-up-square' : 'caret-down-square'"
|
||||
:class="visible ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<div class="gdd-transaction-list-item-icon">
|
||||
<b-icon :icon="properties.icon" :class="properties.class" />
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Betrag / Name Email -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<span class="gdd-transaction-list-item-amount">
|
||||
{{ $n(amount, 'decimal') }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
{{
|
||||
typeId !== 'DECAY'
|
||||
? linkedUser.firstName + ' ' + linkedUser.lastName
|
||||
: $t('decay.decay_since_last_transaction')
|
||||
}}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||
<div class="d-flex">
|
||||
<div style="width: 100%" class="text-center pb-3">
|
||||
<b-icon icon="droplet-half" height="12" class="mb-2" />
|
||||
<b>{{ $t('decay.calculation_decay') }}</b>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<b-row>
|
||||
<b-col cols="6" class="text-right">
|
||||
<div>{{ $t('decay.decay') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div>
|
||||
{{ Number(balance) + Number(decay.decay) * -1 }} :::: {{ Number(decay.decay) }} :::::
|
||||
{{ $n(Number(balance) + Number(decay.decay) * -1, 'decimal') }}
|
||||
GDD - {{ $n(Number(decay.decay) * -1, 'decimal') }} GDD =
|
||||
<b>{{ $n(Number(balance), 'decimal') }} GDD</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr />
|
||||
{{ amount }}, {{ balance }}, {{ balanceDate }}, {{ decay }}, {{ id }}, {{ linkedUser }},
|
||||
{{ memo }}, {{ properties }},, {{ visible }}
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import DecayInformation from '../DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'slot-decay',
|
||||
components: {
|
||||
// DecayInformation,
|
||||
},
|
||||
props: {
|
||||
amount: {
|
||||
type: String,
|
||||
},
|
||||
balance: {
|
||||
type: String,
|
||||
},
|
||||
balanceDate: {
|
||||
type: String,
|
||||
},
|
||||
decay: {
|
||||
type: Object,
|
||||
},
|
||||
id: {
|
||||
type: Number,
|
||||
},
|
||||
linkedUser: {
|
||||
type: Object,
|
||||
},
|
||||
memo: {
|
||||
type: String,
|
||||
},
|
||||
typeId: {
|
||||
type: String,
|
||||
},
|
||||
properties: {
|
||||
type: Object,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
147
frontend/src/components/transaction-slots/TransactionReceive.vue
Normal file
147
frontend/src/components/transaction-slots/TransactionReceive.vue
Normal file
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div>
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<div class="text-right" style="width: 95%; position: absolute">
|
||||
<b-icon
|
||||
:icon="visible ? 'caret-up-square' : 'caret-down-square'"
|
||||
:class="visible ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<div class="gdd-transaction-list-item-icon">
|
||||
<b-icon :icon="properties.icon" :class="properties.class" />
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Betrag / Name Email -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<span class="gdd-transaction-list-item-operator">
|
||||
{{ properties.operator }}
|
||||
</span>
|
||||
<span class="gdd-transaction-list-item-amount">
|
||||
{{ $n(amount, 'decimal') }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
{{
|
||||
typeId !== 'DECAY'
|
||||
? linkedUser.firstName + ' ' + linkedUser.lastName
|
||||
: $t('decay.decay_since_last_transaction')
|
||||
}}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.memo') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-message">{{ memo }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Datum -->
|
||||
<b-row v-if="typeId !== 'DECAY'">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.date') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-date">
|
||||
{{ $d(new Date(balanceDate), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Decay -->
|
||||
<b-row v-if="decay">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<b-icon v-if="typeId != 'DECAY'" icon="droplet-half" height="15" class="mb-1" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-decay">
|
||||
<decay-information v-if="decay" decaytyp="short" :decay="decay" />
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4" v-model="visible">
|
||||
<decay-information
|
||||
decaytyp="new"
|
||||
:amount="amount"
|
||||
:decay="decay"
|
||||
:typeId="typeId"
|
||||
:balanceDate="balanceDate"
|
||||
/>
|
||||
<hr />
|
||||
{{ amount }}, {{ balance }}, {{ balanceDate }}, {{ decay }}, {{ id }}, {{ linkedUser }},
|
||||
{{ memo }}, {{ properties }}
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import DecayInformation from '../DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'slot-receive',
|
||||
components: {
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
amount: {
|
||||
type: String,
|
||||
},
|
||||
balance: {
|
||||
type: String,
|
||||
},
|
||||
balanceDate: {
|
||||
type: String,
|
||||
},
|
||||
decay: {
|
||||
type: Object,
|
||||
},
|
||||
id: {
|
||||
type: Number,
|
||||
},
|
||||
linkedUser: {
|
||||
type: Object,
|
||||
},
|
||||
memo: {
|
||||
type: String,
|
||||
},
|
||||
typeId: {
|
||||
type: String,
|
||||
},
|
||||
properties: {
|
||||
type: Object,
|
||||
},
|
||||
getCollapseState: {
|
||||
type: Boolean,
|
||||
},
|
||||
decayStartBlock: { type: Date },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
147
frontend/src/components/transaction-slots/TransactionSend.vue
Normal file
147
frontend/src/components/transaction-slots/TransactionSend.vue
Normal file
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div>
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<div class="text-right" style="width: 95%; position: absolute">
|
||||
<b-icon
|
||||
:icon="visible ? 'caret-up-square' : 'caret-down-square'"
|
||||
:class="visible ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<div class="gdd-transaction-list-item-icon">
|
||||
<b-icon :icon="properties.icon" :class="properties.class" />
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Betrag / Name Email -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<span class="gdd-transaction-list-item-operator">
|
||||
{{ properties.operator }}
|
||||
</span>
|
||||
<span class="gdd-transaction-list-item-amount">
|
||||
{{ $n(amount, 'decimal') }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
{{
|
||||
typeId !== 'DECAY'
|
||||
? linkedUser.firstName + ' ' + linkedUser.lastName
|
||||
: $t('decay.decay_since_last_transaction')
|
||||
}}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.memo') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-message">{{ memo }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Datum -->
|
||||
<b-row v-if="typeId !== 'DECAY'">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.date') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-date">
|
||||
{{ $d(new Date(balanceDate), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Decay -->
|
||||
<b-row v-if="decay">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<b-icon v-if="typeId != 'DECAY'" icon="droplet-half" height="15" class="mb-1" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-decay">
|
||||
<decay-information v-if="decay" decaytyp="short" :decay="decay" />
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4" v-model="visible">
|
||||
<decay-information
|
||||
decaytyp="new"
|
||||
:amount="amount"
|
||||
:decay="decay"
|
||||
:typeId="typeId"
|
||||
:balanceDate="balanceDate"
|
||||
/>
|
||||
<hr />
|
||||
{{ amount }}, {{ balance }}, {{ balanceDate }}, {{ decay }}, {{ id }}, {{ linkedUser }},
|
||||
{{ memo }}, {{ properties }}
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import DecayInformation from '../DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'slot-send',
|
||||
components: {
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
amount: {
|
||||
type: String,
|
||||
},
|
||||
balance: {
|
||||
type: String,
|
||||
},
|
||||
balanceDate: {
|
||||
type: String,
|
||||
},
|
||||
decay: {
|
||||
type: Object,
|
||||
},
|
||||
id: {
|
||||
type: Number,
|
||||
},
|
||||
linkedUser: {
|
||||
type: Object,
|
||||
},
|
||||
memo: {
|
||||
type: String,
|
||||
},
|
||||
typeId: {
|
||||
type: String,
|
||||
},
|
||||
properties: {
|
||||
type: Object,
|
||||
},
|
||||
getCollapseState: {
|
||||
type: Boolean,
|
||||
},
|
||||
decayStartBlock: { type: Date },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -63,6 +63,7 @@ export const transactionsQuery = gql`
|
||||
id
|
||||
typeId
|
||||
amount
|
||||
balance
|
||||
balanceDate
|
||||
memo
|
||||
linkedUser {
|
||||
|
||||
@ -13,172 +13,58 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-for="{ amount, balanceDate, decay, id, linkedUser, memo, typeId } in transactions"
|
||||
v-for="({ id, typeId }, index) in transactions"
|
||||
:key="id"
|
||||
:style="typeId === 'DECAY' ? 'background-color:#f1e0ae3d' : ''"
|
||||
>
|
||||
<div
|
||||
<transaction-decay
|
||||
class="list-group-item gdd-transaction-list-item"
|
||||
:class="getCollapseState(id) ? 'bg-secondary' : ''"
|
||||
v-b-toggle="'decay-' + id"
|
||||
>
|
||||
<!-- Collaps Icon -->
|
||||
<div class="text-right" style="width: 95%; position: absolute">
|
||||
<b-icon
|
||||
:icon="getCollapseState(id) ? 'caret-up-square' : 'caret-down-square'"
|
||||
:class="getCollapseState(id) ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
<!-- TransactionList Row-->
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<div class="gdd-transaction-list-item-icon">
|
||||
<b-icon :icon="getProperties(typeId).icon" :class="getProperties(typeId).class" />
|
||||
</div>
|
||||
</b-col>
|
||||
v-if="typeId === 'DECAY'"
|
||||
v-bind="transactions[index]"
|
||||
:properties="getProperties(typeId)"
|
||||
/>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Betrag / Name Email -->
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<span class="gdd-transaction-list-item-operator">
|
||||
{{ getProperties(typeId).operator }}
|
||||
</span>
|
||||
<span class="gdd-transaction-list-item-amount">
|
||||
{{ $n(amount, 'decimal') }}
|
||||
</span>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
{{
|
||||
typeId !== 'DECAY'
|
||||
? linkedUser.firstName + ' ' + linkedUser.lastName
|
||||
: $t('decay.decay_since_last_transaction')
|
||||
}}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<b-row v-if="typeId !== 'DECAY'">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.memo') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-message">{{ memo }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Datum -->
|
||||
<b-row v-if="typeId !== 'DECAY'">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">{{ $t('form.date') }}</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-date">
|
||||
{{ $d(new Date(balanceDate), 'long') }}
|
||||
{{ $i18n.locale === 'de' ? 'Uhr' : '' }}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<!-- Decay -->
|
||||
<b-row v-if="decay">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<b-icon
|
||||
v-if="typeId != 'DECAY'"
|
||||
icon="droplet-half"
|
||||
height="15"
|
||||
class="mb-1"
|
||||
/>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-decay">
|
||||
<decay-information v-if="decay" decaytyp="short" :decay="decay" />
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<!-- <b-row v-if="decay && decayStartBlock">
|
||||
<b-col cols="5">
|
||||
<div class="text-right">
|
||||
<b-icon
|
||||
v-if="typeId != 'decay'"
|
||||
icon="droplet-half"
|
||||
height="15"
|
||||
class="mb-1"
|
||||
/>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="gdd-transaction-list-item-decay">
|
||||
<b>{{ $t('decay.Starting_block_decay') }}</b>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row> -->
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<!-- Collaps Start -->
|
||||
<b-collapse class="pb-4" :id="'decay-' + id">
|
||||
<div class="pt-4 pb-4 bg-white border border-muted">
|
||||
<decay-information
|
||||
v-if="decay.start !== null"
|
||||
decaytyp="new"
|
||||
:amount="amount"
|
||||
:decay="decay"
|
||||
:typeId="typeId"
|
||||
/>
|
||||
|
||||
<!-- if decay.start === null - Wenn kein decay angegeben dan ist es die erste Transaktion-->
|
||||
<div v-if="decay.start === null" class="mt-3 mb-3 text-center">
|
||||
<b>{{ $t('decay.first_transaction') }}</b>
|
||||
</div>
|
||||
|
||||
<!-- if balanceDate < decayStartBlock - Wenn die transaktion vor dem einführen der dacay function liegt. -->
|
||||
<div
|
||||
v-if="new Date(balanceDate).getTime() < new Date(decayStartBlock).getTime()"
|
||||
class="mt-3 mb-3 text-center"
|
||||
>
|
||||
<b>{{ $t('decay.befor_startblock_transaction') }}</b>
|
||||
</div>
|
||||
|
||||
<div v-if="typeId === 'DECAY'" class="mt-3 mb-3">
|
||||
<decay-information
|
||||
decaytyp="decayLastTransaction"
|
||||
:amount="amount"
|
||||
:decay="decay"
|
||||
:typeId="typeId"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</b-collapse>
|
||||
|
||||
<!-- Collaps End -->
|
||||
</div>
|
||||
</div>
|
||||
<pagination-buttons
|
||||
v-if="showPagination"
|
||||
v-model="currentPage"
|
||||
:per-page="pageSize"
|
||||
:total-rows="transactionCount"
|
||||
></pagination-buttons>
|
||||
<div v-if="transactionCount < 0" class="mt-4 text-center">
|
||||
<span>{{ $t('transaction.nullTransactions') }}</span>
|
||||
<transaction-send
|
||||
class="list-group-item gdd-transaction-list-item"
|
||||
v-if="typeId === 'SEND'"
|
||||
v-bind="transactions[index]"
|
||||
:decayStartBlock="decayStartBlock"
|
||||
:properties="getProperties(typeId)"
|
||||
/>
|
||||
<transaction-receive
|
||||
class="list-group-item gdd-transaction-list-item"
|
||||
v-if="typeId === 'RECEIVE'"
|
||||
v-bind="transactions[index]"
|
||||
:decayStartBlock="decayStartBlock"
|
||||
:properties="getProperties(typeId)"
|
||||
/>
|
||||
<transaction-creation
|
||||
class="list-group-item gdd-transaction-list-item"
|
||||
v-if="typeId === 'CREATION'"
|
||||
v-bind="transactions[index]"
|
||||
:decayStartBlock="decayStartBlock"
|
||||
:properties="getProperties(typeId)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<pagination-buttons
|
||||
v-if="showPagination"
|
||||
v-model="currentPage"
|
||||
:per-page="pageSize"
|
||||
:total-rows="transactionCount"
|
||||
></pagination-buttons>
|
||||
<div v-if="transactionCount < 0" class="mt-4 text-center">
|
||||
<span>{{ $t('transaction.nullTransactions') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PaginationButtons from '../../../components/PaginationButtons'
|
||||
import DecayInformation from '../../../components/DecayInformation'
|
||||
import TransactionDecay from '../../../components/transaction-slots/TransactionDecay'
|
||||
import TransactionSend from '../../../components/transaction-slots/TransactionSend'
|
||||
import TransactionReceive from '../../../components/transaction-slots/TransactionReceive'
|
||||
import TransactionCreation from '../../../components/transaction-slots/TransactionCreation'
|
||||
|
||||
const iconsByType = {
|
||||
SEND: { icon: 'arrow-left-circle', classes: 'text-danger', operator: '−' },
|
||||
@ -191,7 +77,10 @@ export default {
|
||||
name: 'gdd-transaction-list',
|
||||
components: {
|
||||
PaginationButtons,
|
||||
DecayInformation,
|
||||
TransactionDecay,
|
||||
TransactionSend,
|
||||
TransactionReceive,
|
||||
TransactionCreation,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -228,18 +117,6 @@ export default {
|
||||
throwError(msg) {
|
||||
throw new Error(msg)
|
||||
},
|
||||
getCollapseState(id) {
|
||||
return this.collapseStatus.includes('decay-' + id)
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.$root.$on('bv::collapse::state', (collapseId, isJustShown) => {
|
||||
if (isJustShown) {
|
||||
this.collapseStatus.push(collapseId)
|
||||
} else {
|
||||
this.collapseStatus = this.collapseStatus.filter((id) => id !== collapseId)
|
||||
}
|
||||
})
|
||||
},
|
||||
watch: {
|
||||
currentPage() {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user