previuos balance from server, displayed in decay details

frontend/src/components/DecayInformations/DecayInformation-Decay.vue

@@ -12,7 +12,7 @@
           </b-col>
           <b-col offset="1" offset-md="0" offset-lg="0">
             <div>
-              {{ previousBookedBalance | GDD }}
+              {{ previousBalance | GDD }}
               {{ decay === '0' ? $t('math.minus') : '' }}
               {{ decay | GDD }} {{ $t('math.equal') }}
               <b>{{ balance | GDD }}</b>
@@ -35,7 +35,7 @@ export default {
       type: String,
       required: true,
     },
-    previousBookedBalance: {
+    previousBalance: {
       type: String,
       required: true,
     },

frontend/src/components/DecayInformations/DecayInformation-Long.vue

@@ -24,8 +24,18 @@
         </b-row>
         <duration-row :decayStart="decay.start" :decayEnd="decay.end" />
 
-        <!-- Decay-->
+        <!-- Previous Balance -->
         <b-row class="mt-2">
+          <b-col cols="12" lg="6" md="3">
+            <div>{{ $t('decay.old_balance') }}</div>
+          </b-col>
+          <b-col offset="1" offset-md="0" offset-lg="0" class="text-right mr-5">
+            {{ previousBalance | GDD }}
+          </b-col>
+        </b-row>
+
+        <!-- Decay-->
+        <b-row class="mt-0">
           <b-col cols="12" lg="3" md="3">
             <div>{{ $t('decay.decay') }}</div>
           </b-col>
@@ -38,7 +48,7 @@
     <!-- Type-->
     <b-row>
       <b-col>
-        <b-row>
+        <b-row class="mb-2">
           <!-- eslint-disable-next-line @intlify/vue-i18n/no-dynamic-keys-->
           <b-col cols="12" lg="3" md="3">{{ $t(`decay.types.${typeId.toLowerCase()}`) }}</b-col>
           <b-col offset="1" offset-md="0" offset-lg="0" class="text-right mr-5">
@@ -46,12 +56,12 @@
           </b-col>
         </b-row>
         <!-- Total-->
-        <b-row>
+        <b-row class="border-top pt-2">
           <b-col cols="12" lg="3" md="3">
-            <div>{{ $t('decay.total') }}</div>
+            <div>{{ $t('decay.new_balance') }}</div>
           </b-col>
           <b-col offset="1" offset-md="0" offset-lg="0" class="text-right mr-5">
-            <b>{{ (Number(amount) + Number(decay.decay)) | GDD }}</b>
+            <b>{{ balance | GDD }}</b>
           </b-col>
         </b-row>
       </b-col>
@@ -67,6 +77,8 @@ export default {
     DurationRow,
   },
   props: {
+    balance: { type: String, default: '0' },
+    previousBalance: { type: String, default: '0' },
     amount: { type: String, default: '0' },
     typeId: { type: String, default: '' },
     memo: { type: String, default: '' },

frontend/src/components/DecayInformations/DecayInformation.vue

@@ -7,7 +7,15 @@
       :decay="decay"
       :typeId="typeId"
     />
-    <decay-information-long v-else :amount="amount" :decay="decay" :typeId="typeId" :memo="memo" />
+    <decay-information-long
+      v-else
+      :amount="amount"
+      :decay="decay"
+      :typeId="typeId"
+      :memo="memo"
+      :balance="balance"
+      :previousBalance="previousBalance"
+    />
   </div>
 </template>
 <script>
@@ -39,6 +47,14 @@ export default {
       type: String,
       required: true,
     },
+    balance: {
+      type: String,
+      required: true,
+    },
+    previousBalance: {
+      type: String,
+      required: true,
+    },
   },
   computed: {
     isStartBlock() {

frontend/src/components/GddTransactionList.vue

@@ -19,10 +19,7 @@
           class="pointer bg-white appBoxShadow gradido-border-radius px-4 pt-2 test-list-group-item"
         >
           <template #DECAY>
-            <transaction-decay
-              v-bind="transactions[index]"
-              :previousBookedBalance="previousBookedBalance(index)"
-            />
+            <transaction-decay v-bind="transactions[index]" />
           </template>
         </transaction-list-item>
       </div>
@@ -34,27 +31,15 @@
             class="pointer mb-3 bg-white appBoxShadow gradido-border-radius p-3 test-list-group-item"
           >
             <template #SEND>
-              <transaction-send
-                v-bind="transactions[index]"
-                :previousBookedBalance="previousBookedBalance(index)"
-                v-on="$listeners"
-              />
+              <transaction-send v-bind="transactions[index]" v-on="$listeners" />
             </template>
 
             <template #RECEIVE>
-              <transaction-receive
-                v-bind="transactions[index]"
-                :previousBookedBalance="previousBookedBalance(index)"
-                v-on="$listeners"
-              />
+              <transaction-receive v-bind="transactions[index]" v-on="$listeners" />
             </template>
 
             <template #CREATION>
-              <transaction-creation
-                v-bind="transactions[index]"
-                :previousBookedBalance="previousBookedBalance(index)"
-                v-on="$listeners"
-              />
+              <transaction-creation v-bind="transactions[index]" v-on="$listeners" />
             </template>
 
             <template #LINK_SUMMARY>
@@ -127,10 +112,6 @@ export default {
       })
       window.scrollTo(0, 0)
     },
-    previousBookedBalance(idx) {
-      if (this.transactions[idx + 1]) return this.transactions[idx + 1].balance
-      return '0'
-    },
   },
   computed: {
     isPaginationVisible() {

frontend/src/components/Transactions/TransactionCreation.vue

@@ -18,7 +18,14 @@
       </b-col>
     </b-row>
     <b-collapse class="pb-4 pt-lg-3" v-model="visible">
-      <decay-information :typeId="typeId" :decay="decay" :amount="amount" :memo="memo" />
+      <decay-information
+        :typeId="typeId"
+        :decay="decay"
+        :amount="amount"
+        :memo="memo"
+        :balance="balance"
+        :previousBalance="previousBalance"
+      />
     </b-collapse>
   </div>
 </template>
@@ -61,7 +68,11 @@ export default {
       type: Number,
       required: false,
     },
-    previousBookedBalance: {
+    balance: {
+      type: String,
+      required: true,
+    },
+    previousBalance: {
       type: String,
       required: true,
     },

frontend/src/components/Transactions/TransactionDecay.vue

@@ -14,7 +14,7 @@
       <decay-information-decay
         :balance="balance"
         :decay="decay.decay"
-        :previousBookedBalance="previousBookedBalance"
+        :previousBalance="previousBalance"
       />
     </b-collapse>
   </div>
@@ -44,9 +44,10 @@ export default {
       type: Object,
       required: true,
     },
-    previousBookedBalance: {
-      type: String,
-      required: true,
+  },
+  computed: {
+    previousBalance() {
+      return String(Number(this.balance) - Number(this.decay.decay))
     },
   },
   data() {

frontend/src/components/Transactions/TransactionReceive.vue

@@ -43,7 +43,14 @@
       </b-col>
     </b-row>
     <b-collapse class="pb-4 pt-lg-3" v-model="visible">
-      <decay-information :typeId="typeId" :decay="decay" :amount="amount" :memo="memo" />
+      <decay-information
+        :typeId="typeId"
+        :decay="decay"
+        :amount="amount"
+        :memo="memo"
+        :balance="balance"
+        :previousBalance="previousBalance"
+      />
     </b-collapse>
   </div>
 </template>
@@ -85,7 +92,11 @@ export default {
     typeId: {
       type: String,
     },
-    previousBookedBalance: {
+    balance: {
+      type: String,
+      required: true,
+    },
+    previousBalance: {
       type: String,
       required: true,
     },

frontend/src/components/Transactions/TransactionSend.vue

@@ -42,7 +42,14 @@
       </b-col>
     </b-row>
     <b-collapse class="pb-4 pt-lg-3" v-model="visible">
-      <decay-information :typeId="typeId" :decay="decay" :amount="amount" :memo="memo" />
+      <decay-information
+        :typeId="typeId"
+        :decay="decay"
+        :amount="amount"
+        :memo="memo"
+        :balance="balance"
+        :previousBalance="previousBalance"
+      />
     </b-collapse>
   </div>
 </template>
@@ -85,7 +92,11 @@ export default {
       type: String,
       required: true,
     },
-    previousBookedBalance: {
+    balance: {
+      type: String,
+      required: true,
+    },
+    previousBalance: {
       type: String,
       required: true,
     },

frontend/src/graphql/queries.js

@@ -33,6 +33,7 @@ export const transactionsQuery = gql`
         typeId
         amount
         balance
+        previousBalance
         balanceDate
         memo
         linkedUser {