add components RedeemedTextBox, RedeemLoggedOut, RedeemSelfCreator, RedeemSelfCreator

frontend/src/components/LinkInformatins/RedeemLoggedOut.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="redeem-logged-out">
+    <b-jumbotron bg-variant="info" text-variant="dark" border-variant="dark">
+      <h1>
+        {{ user.firstName }}
+        {{ $t('transaction-link.send_you') }} {{ amount | GDD }}
+      </h1>
+      <b>{{ memo }}</b>
+    </b-jumbotron>
+
+    <b-jumbotron>
+      <div class="mb-6">
+        <h2>{{ $t('gdd_per_link.redeem') }}</h2>
+      </div>
+
+      <b-row>
+        <b-col col sm="12" md="6">
+          <p>{{ $t('gdd_per_link.no-account') }}</p>
+          <b-button variant="primary" to="/register">
+            {{ $t('gdd_per_link.to-register') }}
+          </b-button>
+        </b-col>
+        <b-col sm="12" md="6" class="mt-xs-6 mt-sm-6 mt-md-0">
+          <p>{{ $t('gdd_per_link.has-account') }}</p>
+          <b-button variant="info" to="/login">{{ $t('gdd_per_link.to-login') }}</b-button>
+        </b-col>
+      </b-row>
+    </b-jumbotron>
+  </div>
+</template>
+<script>
+export default {
+  name: 'RedeemLoggedOut',
+  props: {
+    user: { type: Object, required: true },
+    amount: { type: String, required: true },
+    memo: { type: String, required: true, default: '' },
+  },
+}
+</script>

frontend/src/components/LinkInformatins/RedeemSelfCreator.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="redeem-self-creator">
+    <b-jumbotron bg-variant="info" text-variant="dark" border-variant="dark">
+      <h1>
+        {{ user.firstName }}
+        {{ $t('transaction-link.send_you') }} {{ amount | GDD }}
+      </h1>
+      <b>{{ memo }}</b>
+    </b-jumbotron>
+
+    <b-jumbotron>
+      <div class="mb-3 text-center">
+        <div class="mt-3">
+          {{ $t('gdd_per_link.no-redeem') }}
+          <a to="/transactions" href="#!">
+            <b>{{ $t('gdd_per_link.link-overview') }}</b>
+          </a>
+        </div>
+      </div>
+    </b-jumbotron>
+  </div>
+</template>
+<script>
+export default {
+  name: 'RedeemSelfCreator',
+  props: {
+    user: { type: Object, required: true },
+    amount: { type: String, required: true },
+    memo: { type: String, required: true, default: '' },
+  },
+}
+</script>

frontend/src/components/LinkInformatins/RedeemValid.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class="redeem-valid">
+    <b-jumbotron bg-variant="info" text-variant="dark" border-variant="dark">
+      <h1>
+        {{ user.firstName }}
+        {{ $t('transaction-link.send_you') }} {{ amount | GDD }}
+      </h1>
+      <b>{{ memo }}</b>
+    </b-jumbotron>
+
+    <b-jumbotron>
+      <div class="mb-3 text-center">
+        <b-button variant="primary" @click="$emit('redeem-link')" size="lg">
+          {{ $t('gdd_per_link.redeem') }}
+        </b-button>
+      </div>
+    </b-jumbotron>
+  </div>
+</template>
+<script>
+export default {
+  name: 'RedeemValid',
+  props: {
+    user: { type: Object, required: false },
+    amount: { type: String, required: false },
+    memo: { type: String, required: false, default: '' },
+  },
+}
+</script>

frontend/src/components/LinkInformatins/RedeemedTextBox.vue

@@ -0,0 +1,21 @@
+<template>
+  <div class="redeemed-text-box">
+    <b-jumbotron bg-variant="info" text-variant="dark" border-variant="dark">
+      <h1>
+        {{ text }}
+      </h1>
+    </b-jumbotron>
+
+    <div class="text-center">
+      <b-button to="/overview">{{ $t('back') }}</b-button>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'RedeemedTextBox',
+  props: {
+    text: { type: String, required: true },
+  },
+}
+</script>