add new transaction type: TRANSACTION_LINK, add locales, add new TransactionRow: LinkCountRow.vue, add new CollapseLinksList.vue

frontend/src/components/DecayInformations/CollapseLinksList.vue

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

frontend/src/components/GddTransactionList.vue

@@ -41,6 +41,10 @@
               :decayStartBlock="decayStartBlock"
             />
           </template>
+
+          <template #TRANSACTION_LINK>
+            <transaction-link class="list-group-item" v-bind="transactions[index]" />
+          </template>
         </transaction-list-item>
       </div>
     </div>
@@ -63,6 +67,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 +78,7 @@ export default {
     TransactionSend,
     TransactionReceive,
     TransactionCreation,
+    TransactionLink,
   },
   data() {
     return {

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: String,
+      required: true,
+    },
+  },
+}
+</script>

frontend/src/components/Transactions/TransactionLink.vue

@@ -0,0 +1,82 @@
+<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="share" />
+          </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="22" />
+
+            <!-- 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,
+    },
+    balance: {
+      type: String,
+    },
+    balanceDate: {
+      type: String,
+    },
+    decay: {
+      type: Object,
+    },
+    id: {
+      type: Number,
+    },
+    linkedUser: {
+      type: Object,
+    },
+    memo: {
+      type: String,
+    },
+    typeId: {
+      type: String,
+    },
+  },
+  data() {
+    return {
+      visible: false,
+    }
+  },
+}
+</script>

frontend/src/locales/de.json

@@ -99,6 +99,13 @@
     },
     "your_amount": "Dein Betrag"
   },
+  "gdd_per_link": {
+    "links_sum":"Summe deiner versendeten Gradidos",
+    "links_count":"aktive Links"
+  },
+  "links-list": {
+    "header": "Liste deiner aktiven Links"
+  },
   "gdt": {
     "action": "Aktion",
     "calculation": "Berechnung der GradidoTransform",

frontend/src/locales/en.json

@@ -99,6 +99,13 @@
     },
     "your_amount": "Your amount"
   },
+  "gdd_per_link": {
+    "links_sum":"Total of your sent Gradidos",
+    "links_count":"active links"
+  },
+  "links-list": {
+    "header": "List of your active links"
+  },
   "gdt": {
     "action": "Action",
     "calculation": "Calculation of GradidoTransform",