Merge pull request #1613 from gradido/1594-Show-if-a-transaction-was-created-by-link

1554 frontend transaction link summary

backend/src/graphql/model/TransactionList.ts

@@ -9,12 +9,14 @@ export class TransactionList {
     balance: Decimal,
     transactions: Transaction[],
     count: number,
+    linkCount: number,
     balanceGDT?: number | null,
     decayStartBlock: Date = CONFIG.DECAY_START_TIME,
   ) {
     this.balance = balance
     this.transactions = transactions
     this.count = count
+    this.linkCount = linkCount
     this.balanceGDT = balanceGDT || null
     this.decayStartBlock = decayStartBlock
   }
@@ -25,6 +27,9 @@ export class TransactionList {
   @Field(() => Number)
   count: number
 
+  @Field(() => Number)
+  linkCount: number
+
   @Field(() => Decimal)
   balance: Decimal
 

backend/src/graphql/resolver/TransactionResolver.ts

@@ -170,7 +170,7 @@ export class TransactionResolver {
     }
 
     if (!lastTransaction) {
-      return new TransactionList(new Decimal(0), [], 0, balanceGDT)
+      return new TransactionList(new Decimal(0), [], 0, 0, balanceGDT)
     }
 
     // find transactions
@@ -204,7 +204,7 @@ export class TransactionResolver {
     const transactions: Transaction[] = []
 
     const transactionLinkRepository = getCustomRepository(TransactionLinkRepository)
-    const { sumHoldAvailableAmount, sumAmount, lastDate, firstDate } =
+    const { sumHoldAvailableAmount, sumAmount, lastDate, firstDate, transactionLinkcount } =
       await transactionLinkRepository.summary(user.id, now)
 
     // decay & link transactions
@@ -217,9 +217,9 @@ export class TransactionResolver {
         transactions.push(
           virtualLinkTransaction(
             lastTransaction.balance.minus(sumHoldAvailableAmount.toString()),
-            sumAmount,
-            sumHoldAvailableAmount,
-            sumHoldAvailableAmount.minus(sumAmount.toString()),
+            sumAmount.mul(-1),
+            sumHoldAvailableAmount.mul(-1),
+            sumHoldAvailableAmount.minus(sumAmount.toString()).mul(-1),
             firstDate || now,
             lastDate || now,
             self,
@@ -244,6 +244,7 @@ export class TransactionResolver {
       ),
       transactions,
       userTransactionsCount,
+      transactionLinkcount,
       balanceGDT,
     )
   }

backend/src/typeorm/repository/TransactionLink.ts

@@ -12,13 +12,15 @@ export class TransactionLinkRepository extends Repository<dbTransactionLink> {
     sumAmount: Decimal
     lastDate: Date | null
     firstDate: Date | null
+    transactionLinkcount: number
   }> {
-    const { sumHoldAvailableAmount, sumAmount, lastDate, firstDate } =
+    const { sumHoldAvailableAmount, sumAmount, lastDate, firstDate, count } =
       await this.createQueryBuilder('transactionLinks')
         .select('SUM(transactionLinks.holdAvailableAmount)', 'sumHoldAvailableAmount')
         .addSelect('SUM(transactionLinks.amount)', 'sumAmount')
         .addSelect('MAX(transactionLinks.validUntil)', 'lastDate')
         .addSelect('MIN(transactionLinks.createdAt)', 'firstDate')
+        .addSelect('COUNT(*)', 'count')
         .where('transactionLinks.userId = :userId', { userId })
         .andWhere('transactionLinks.redeemedAt is NULL')
         .andWhere('transactionLinks.validUntil > :date', { date })
@@ -31,6 +33,7 @@ export class TransactionLinkRepository extends Repository<dbTransactionLink> {
       sumAmount: sumAmount ? new Decimal(sumAmount) : new Decimal(0),
       lastDate: lastDate || null,
       firstDate: firstDate || null,
+      transactionLinkcount: count || 0,
     }
   }
 }

frontend/src/components/DecayInformations/CollapseLinksList.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="collapse-links-list">
+    <div class="d-flex">
+      <div class="text-center pb-3 gradido-max-width">
+        <b>{{ $t('links-list.header') }}</b>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'CollapseLinksList',
+}
+</script>

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

@@ -1,6 +1,6 @@
 <template>
   <div class="decayinformation-short">
-    <span v-if="decay.decay">{{ decay.decay | amount }}</span>
+    <span v-if="decay.decay">{{ decay.decay | GDD }}</span>
   </div>
 </template>
 <script>

frontend/src/components/GddTransactionList.vue

@@ -41,6 +41,14 @@
               :decayStartBlock="decayStartBlock"
             />
           </template>
+
+          <template #TRANSACTION_LINK>
+            <transaction-link
+              class="list-group-item"
+              v-bind="transactions[index]"
+              :transactionLinkCount="transactionLinkCount"
+            />
+          </template>
         </transaction-list-item>
       </div>
     </div>
@@ -63,6 +71,7 @@ import TransactionDecay from '@/components/Transactions/TransactionDecay'
 import TransactionSend from '@/components/Transactions/TransactionSend'
 import TransactionReceive from '@/components/Transactions/TransactionReceive'
 import TransactionCreation from '@/components/Transactions/TransactionCreation'
+import TransactionLink from '@/components/Transactions/TransactionLink'
 
 export default {
   name: 'gdd-transaction-list',
@@ -73,6 +82,7 @@ export default {
     TransactionSend,
     TransactionReceive,
     TransactionCreation,
+    TransactionLink,
   },
   data() {
     return {
@@ -85,6 +95,7 @@ export default {
     pageSize: { type: Number, default: 25 },
     timestamp: { type: Number, default: 0 },
     transactionCount: { type: Number, default: 0 },
+    transactionLinkCount: { type: Number, default: 0 },
     showPagination: { type: Boolean, default: false },
   },
   methods: {

frontend/src/components/TransactionRows/LinkCountRow.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="link-count-row">
+    <b-row>
+      <b-col cols="5">
+        <div class="text-right">{{ $t('gdd_per_link.links_count') }}</div>
+      </b-col>
+      <b-col cols="7">
+        <div class="gdd-transaction-list-link-count">{{ count }}</div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+<script>
+export default {
+  name: 'LinkCountRow',
+  props: {
+    count: {
+      type: Number,
+      required: true,
+    },
+  },
+}
+</script>

frontend/src/components/Transactions/TransactionCreation.vue

@@ -60,42 +60,37 @@ export default {
   props: {
     amount: {
       type: String,
-    },
-    balance: {
-      type: String,
+      required: true,
     },
     balanceDate: {
       type: String,
+      required: true,
     },
     decay: {
       type: Object,
-    },
-    id: {
-      type: Number,
+      required: true,
     },
     linkedUser: {
       type: Object,
+      required: true,
     },
     memo: {
       type: String,
+      required: true,
     },
     typeId: {
       type: String,
+      required: true,
     },
-    properties: {
-      type: Object,
+    decayStartBlock: {
+      type: Date,
+      required: true,
     },
-    decayStartBlock: { type: Date },
   },
   data() {
     return {
       visible: false,
     }
   },
-  computed: {
-    isStartBlock() {
-      return new Date(this.decay.start).getTime() === this.decayStartBlock.getTime()
-    },
-  },
 }
 </script>

frontend/src/components/Transactions/TransactionDecay.vue

@@ -43,12 +43,15 @@ export default {
   props: {
     amount: {
       type: String,
+      required: true,
     },
     balance: {
       type: String,
+      required: true,
     },
     decay: {
       type: Object,
+      required: true,
     },
   },
   data() {

frontend/src/components/Transactions/TransactionLink.vue

@@ -0,0 +1,70 @@
+<template>
+  <div class="transaction-slot-link">
+    <div @click="visible = !visible">
+      <!-- Collaps Icon  -->
+      <collapse-icon class="text-right" :visible="visible" />
+      <div>
+        <b-row>
+          <!-- ICON  -->
+          <b-col cols="1">
+            <type-icon color="text-danger" icon="link45deg" />
+          </b-col>
+
+          <b-col cols="11">
+            <!-- Amount / Name || Text -->
+            <amount-and-name-row :amount="amount" :text="$t('gdd_per_link.links_sum')" />
+
+            <!-- Count Links -->
+            <link-count-row :count="transactionLinkCount" />
+
+            <!-- Decay -->
+            <decay-row :decay="decay" />
+          </b-col>
+        </b-row>
+      </div>
+
+      <b-collapse :class="visible ? 'bg-secondary' : ''" class="pb-4 pt-5" v-model="visible">
+        <collapse-links-list />
+      </b-collapse>
+    </div>
+  </div>
+</template>
+<script>
+import CollapseIcon from '../TransactionRows/CollapseIcon'
+import TypeIcon from '../TransactionRows/TypeIcon'
+import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
+import LinkCountRow from '../TransactionRows/LinkCountRow'
+import DecayRow from '../TransactionRows/DecayRow'
+import CollapseLinksList from '../DecayInformations/CollapseLinksList'
+
+export default {
+  name: 'TransactionSlotLink',
+  components: {
+    CollapseIcon,
+    TypeIcon,
+    AmountAndNameRow,
+    LinkCountRow,
+    DecayRow,
+    CollapseLinksList,
+  },
+  props: {
+    amount: {
+      type: String,
+      required: true,
+    },
+    decay: {
+      type: Object,
+      required: true,
+    },
+    transactionLinkCount: {
+      type: Number,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      visible: false,
+    }
+  },
+}
+</script>

frontend/src/components/Transactions/TransactionReceive.vue

@@ -61,39 +61,36 @@ export default {
   props: {
     amount: {
       type: String,
-    },
-    balance: {
-      type: String,
+      required: true,
     },
     balanceDate: {
       type: String,
+      required: true,
     },
     decay: {
       type: Object,
-    },
-    id: {
-      type: Number,
+      required: true,
     },
     linkedUser: {
       type: Object,
+      required: true,
     },
     memo: {
       type: String,
+      required: true,
     },
     typeId: {
       type: String,
     },
-    decayStartBlock: { type: Date },
+    decayStartBlock: {
+      type: Date,
+      required: true,
+    },
   },
   data() {
     return {
       visible: false,
     }
   },
-  computed: {
-    isStartBlock() {
-      return new Date(this.decay.start).getTime() === this.decayStartBlock.getTime()
-    },
-  },
 }
 </script>

frontend/src/components/Transactions/TransactionSend.vue

@@ -61,29 +61,32 @@ export default {
   props: {
     amount: {
       type: String,
-    },
-    balance: {
-      type: String,
+      required: true,
     },
     balanceDate: {
       type: String,
+      required: true,
     },
     decay: {
       type: Object,
-    },
-    id: {
-      type: Number,
+      required: true,
     },
     linkedUser: {
       type: Object,
+      required: true,
     },
     memo: {
       type: String,
+      required: true,
     },
     typeId: {
       type: String,
+      required: true,
+    },
+    decayStartBlock: {
+      type: Date,
+      required: true,
     },
-    decayStartBlock: { type: Date },
   },
   data() {
     return {

frontend/src/graphql/queries.js

@@ -57,6 +57,7 @@ export const transactionsQuery = gql`
     ) {
       balanceGDT
       count
+      linkCount
       balance
       decayStartBlock
       transactions {

frontend/src/layouts/DashboardLayout_gdd.spec.js

@@ -155,6 +155,7 @@ describe('DashboardLayoutGdd', () => {
               transactionList: {
                 balanceGDT: 100,
                 count: 4,
+                linkCount: 8,
                 balance: 1450,
                 decay: 1250,
                 transactions: ['transaction', 'transaction', 'transaction', 'transaction'],
@@ -198,6 +199,10 @@ describe('DashboardLayoutGdd', () => {
         it('updates transaction count', () => {
           expect(wrapper.vm.transactionCount).toBe(4)
         })
+
+        it('updates transaction link count', () => {
+          expect(wrapper.vm.transactionLinkCount).toBe(8)
+        })
       })
 
       describe('update transactions returns error', () => {

frontend/src/layouts/DashboardLayout_gdd.vue

@@ -24,6 +24,7 @@
               :gdt-balance="GdtBalance"
               :transactions="transactions"
               :transactionCount="transactionCount"
+              :transactionLinkCount="transactionLinkCount"
               :pending="pending"
               :decayStartBlock="decayStartBlock"
               @update-balance="updateBalance"
@@ -59,6 +60,7 @@ export default {
       transactions: [],
       bookedBalance: 0,
       transactionCount: 0,
+      transactionLinkCount: 0,
       pending: true,
       visible: false,
       decayStartBlock: new Date(),
@@ -99,6 +101,7 @@ export default {
           this.transactions = transactionList.transactions
           this.balance = Number(transactionList.balance)
           this.transactionCount = transactionList.count
+          this.transactionLinkCount = transactionList.linkCount
           this.decayStartBlock = new Date(transactionList.decayStartBlock)
           this.pending = false
         })

frontend/src/locales/de.json

@@ -106,6 +106,8 @@
     "decay-14-day": "Vergänglichkeit für 14 Tage",
     "header": "Gradidos versenden per Link",
     "link-copied": "Link wurde in die Zwischenablage kopiert",
+    "links_count": "Aktive Links",
+    "links_sum": "Summe deiner versendeten Gradidos",
     "not-copied": "Konnte den Link nicht kopieren: {err}",
     "sentence_1": "Wähle einen Betrag aus, welchen du per Link versenden möchtest. Du kannst auch noch eine Nachricht eintragen. Beim Klick „jetzt generieren“ wird ein Link erstellt, den du versenden kannst.",
     "sentence_2": "Der Link ist 14 Tage gültig!",
@@ -132,6 +134,9 @@
   },
   "imprint": "Impressum",
   "language": "Sprache",
+  "links-list": {
+    "header": "Liste deiner aktiven Links"
+  },
   "login": "Anmeldung",
   "logout": "Abmelden",
   "members_area": "Mitgliederbereich",

frontend/src/locales/en.json

@@ -106,6 +106,8 @@
     "decay-14-day": "Decay for 14 days",
     "header": "Send Gradidos via link",
     "link-copied": "Link copied to clipboard",
+    "links_count": "Active links",
+    "links_sum": "Total of your sent Gradidos",
     "not-copied": "Could not copy link: {err}",
     "sentence_1": "Select an amount that you would like to send via link. You can also enter a message. Click 'Generate now' to create a link that you can share.",
     "sentence_2": "The link is valid for 14 days!",
@@ -132,6 +134,9 @@
   },
   "imprint": "Legal notice",
   "language": "Language",
+  "links-list": {
+    "header": "List of your active links"
+  },
   "login": "Login",
   "logout": "Logout",
   "members_area": "Members area",

frontend/src/pages/Overview.vue

@@ -20,6 +20,7 @@
         :timestamp="timestamp"
         :decayStartBlock="decayStartBlock"
         :transaction-count="transactionCount"
+        :transactionLinkCount="transactionLinkCount"
         @update-transactions="updateTransactions"
       />
       <gdd-transaction-list-footer :count="transactionCount" />
@@ -51,6 +52,7 @@ export default {
       default: () => [],
     },
     transactionCount: { type: Number, default: 0 },
+    transactionLinkCount: { type: Number, default: 0 },
     pending: {
       type: Boolean,
       default: true,

frontend/src/pages/Transactions.vue

@@ -7,6 +7,7 @@
         <gdd-transaction-list
           :timestamp="timestamp"
           :transactionCount="transactionCount"
+          :transactionLinkCount="transactionLinkCount"
           :transactions="transactions"
           :show-pagination="true"
           :decayStartBlock="decayStartBlock"
@@ -42,6 +43,7 @@ export default {
       default: () => [],
     },
     transactionCount: { type: Number, default: 0 },
+    transactionLinkCount: { type: Number, default: 0 },
     decayStartBlock: { type: Date },
   },
   data() {