From 065b84b66d50483ee7b832a4bdca7f2667f51c96 Mon Sep 17 00:00:00 2001
From: Andreas Mueller <andreas.mueller@yaga.eu>
Date: Sun, 16 Jul 2023 15:21:46 +0200
Subject: [PATCH] add legacy voucher management

---
 .eslintrc.js                         |   5 +-
 src/components/NavBar.vue            |  14 ++
 src/locales/de.json                  |  21 +++
 src/locales/en.json                  |  21 +++
 src/router.js                        |   6 +
 src/shared/legacy-voucher-service.js |  39 +++++
 src/store/index.js                   |   7 +
 src/views/LegacyVouchers.vue         | 242 +++++++++++++++++++++++++++
 8 files changed, 354 insertions(+), 1 deletion(-)
 create mode 100644 src/shared/legacy-voucher-service.js
 create mode 100644 src/views/LegacyVouchers.vue

diff --git a/.eslintrc.js b/.eslintrc.js
index 22aaa660..1672b284 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -3,7 +3,10 @@ module.exports = {
   env: {
     node: true,
   },
-  extends: ["eslint:recommended", "plugin:vue/recommended", "@vue/prettier"],
+  extends: [
+    "plugin:vue/recommended",
+    "eslint:recommended",
+  ],
   rules: {
     "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index ae76cefc..ac078181 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -44,6 +44,20 @@
             }}</v-list-item-title>
           </v-list-item-content>
         </v-list-item>
+        <v-list-item
+          v-if="!$auth.loading && $auth.isAuthenticated && isAdminOrModerator"
+          link
+          :to="'/' + $i18n.locale + '/legacy-vouchers'"
+        >
+          <v-list-item-action>
+            <v-icon>mdi-file-certificate</v-icon>
+          </v-list-item-action>
+          <v-list-item-content>
+            <v-list-item-title>{{
+              $t("voucher.legacy-vouchers")
+            }}</v-list-item-title>
+          </v-list-item-content>
+        </v-list-item>
         <v-list-item
           v-if="!$auth.loading && $auth.isAuthenticated && isAdminOrModerator"
           link
diff --git a/src/locales/de.json b/src/locales/de.json
index 73accc14..8a639e20 100644
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -146,6 +146,7 @@
   "ok": "OK",
   "operating": "Sprungbetrieb",
   "overview": "Übersicht",
+  "phone": "Telefon",
   "picAndVid": {
     "available": "Foto u. Video verfügbar",
     "booked": "Foto u. Video gebucht",
@@ -243,6 +244,7 @@
   "statistics": {
     "header": "Tagesstatistik"
   },
+  "street": "Straße",
   "streetAdress": "Straße und Hausnummer",
   "tandem": {
     "available": "Tandem verfügbar",
@@ -321,7 +323,26 @@
     "videoflyer": "Videoflyer"
   },
   "voucher": {
+    "back-payment": "Gutschein ist seit {years} Jahr(en) abgelaufen. Zuzahlung: {backPayment}€",
+    "buyDate": "Kaufdatum",
+    "details": "Gutscheindetails",
+    "id": "Gutschein-ID",
     "info": "Bitte setze einen Haken, wenn der Springer einen Gutschein hat.",
+    "legacy-vouchers": "Altgutscheine",
+    "number": "Gutscheinnummer",
+    "paid": "Bezahlt",
+    "paymentProvider": "Bezahldienstleister",
+    "productDescription": "Produktbeschreibung",
+    "redeem": "Gutschein einlösen",
+    "redeem-error": "Fehler beim Einlösen des Gutscheins",
+    "redeem-successful": "Gutschein erfolgreich eingelöst",
+    "redeemDate": "Einlösedatum",
+    "redeemed": "Eingelöst",
+    "salutation": "Begrüßung",
+    "tax": "Steuer",
+    "transactionId": "Transaktions-ID",
+    "validUntil": "Gültig bis",
+    "value": "Wert",
     "voucher": "Gutschein"
   },
   "weightMax90": "Gewicht maximal 90 kg",
diff --git a/src/locales/en.json b/src/locales/en.json
index da9d2c91..7b8ed808 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -146,6 +146,7 @@
   "ok": "OK",
   "operating": "Operating",
   "overview": "Overview",
+  "phone": "Phone",
   "picAndVid": {
     "available": "Pic and Vid available",
     "booked": "Pic and Vid booked",
@@ -243,6 +244,7 @@
   "statistics": {
     "header": "Daily Statistics"
   },
+  "street": "Street",
   "streetAdress": "Street address",
   "tandem": {
     "available": "Tandem available",
@@ -321,7 +323,26 @@
     "videoflyer": "Videoflyer"
   },
   "voucher": {
+    "back-payment": "Voucher expired since {years} year(s). Back payment: {backPayment}€",
+    "buyDate": "Buy date",
+    "details": "Voucher details",
+    "id": "Voucher ID",
     "info": "Please check, if the jumper has a voucher",
+    "legacy-vouchers": "Legacy Vouchers",
+    "number": "Voucher number",
+    "paid": "Paid",
+    "paymentProvider": "Payment provider",
+    "productDescription": "Product description",
+    "redeem": "Redeem voucher",
+    "redeem-error": "Error redeeming voucher",
+    "redeem-successful": "Voucher redeemed sucessfully",
+    "redeemDate": "Redeem date",
+    "redeemed": "Redeemed",
+    "salutation": "Salutation",
+    "tax": "Tax",
+    "transactionId": "Transaction ID",
+    "validUntil": "Valid until",
+    "value": "Value",
     "voucher": "Voucher"
   },
   "weightMax90": "Weight max 90 kg",
diff --git a/src/router.js b/src/router.js
index e5565864..1168c5ca 100644
--- a/src/router.js
+++ b/src/router.js
@@ -104,6 +104,12 @@ let router = new Router({
           component: () => import("./views/UserSettings.vue"),
           beforeEnter: authGuard,
         },
+        {
+          path: "legacy-vouchers",
+          name: "legacy-vouchers",
+          component: () => import("./views/LegacyVouchers.vue"),
+          beforeEnter: authGuard,
+        },
       ],
     },
     {
diff --git a/src/shared/legacy-voucher-service.js b/src/shared/legacy-voucher-service.js
new file mode 100644
index 00000000..fc04ff54
--- /dev/null
+++ b/src/shared/legacy-voucher-service.js
@@ -0,0 +1,39 @@
+import * as axios from "axios";
+import { responseHandler } from "./response-handler";
+
+const apiPath = process.env.VUE_APP_API;
+
+const searchVoucher = async function (id, token) {
+  try {
+    const response = await axios.get(apiPath + "/legacy-voucher/" + id, {
+      headers: {
+        Authorization: `Bearer ${token}`,
+      },
+    });
+    return responseHandler.handleResponse(response, 200);
+  } catch (error) {
+    return responseHandler.handleError(error);
+  }
+};
+
+const redeemVoucher = async function (id, token) {
+  try {
+    const response = await axios.patch(
+      apiPath + "/legacy-voucher/" + id + "/redeem",
+      {},
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      }
+    );
+    return responseHandler.handleResponse(response, 200);
+  } catch (error) {
+    return responseHandler.handleError(error);
+  }
+};
+
+export const legacyVoucherService = {
+  searchVoucher,
+  redeemVoucher,
+};
diff --git a/src/store/index.js b/src/store/index.js
index 553c9705..6aab119b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -14,6 +14,7 @@ import tandemmaster from "./modules/tandemmaster";
 import videoflyer from "./modules/videoflyer";
 
 import { appointmentService } from "../shared/appointment-service";
+import { legacyVoucherService } from "../shared/legacy-voucher-service";
 import { userService } from "../shared/user-service";
 
 Vue.use(Vuex);
@@ -171,6 +172,12 @@ const actions = {
   async getRolesAction({ commit }, token) {
     return await userService.getRoles(token);
   },
+  async getLegacyVoucherAction({ commit }, payload) {
+    return await legacyVoucherService.searchVoucher(payload.id, payload.token);
+  },
+  async redeemLegacyVoucherAction({ commit }, payload) {
+    return await legacyVoucherService.redeemVoucher(payload.id, payload.token);
+  },
 };
 /* eslint-enable no-unused-vars */
 
diff --git a/src/views/LegacyVouchers.vue b/src/views/LegacyVouchers.vue
new file mode 100644
index 00000000..d54ef1f0
--- /dev/null
+++ b/src/views/LegacyVouchers.vue
@@ -0,0 +1,242 @@
+<template>
+  <v-container fluid>
+    <v-snackbar
+      v-model="showHint"
+      :color="hintColor"
+      :timeout="5000"
+    >
+      {{ hintText }}
+      <v-btn
+        text
+        @click="showHint = false"
+      >
+        {{ $t("ok") }}
+      </v-btn>
+    </v-snackbar>
+    <div v-if="authorized">
+      <v-row dense>
+        <h1>{{ $t("voucher.legacy-vouchers") }}</h1>
+      </v-row>
+      <v-row dense>
+        <v-col
+          :cols="12"
+          :lg="4"
+          :md="4"
+          :sm="12"
+        >
+          <v-card>
+            <v-card-text>
+              <v-text-field
+                v-model="voucherId"
+                :label="$t('voucher.number')"
+              /><v-btn
+                :loading="loading"
+                :disabled="loading"
+                @click="searchLegacyVoucher"
+              >
+                {{ $t("search") }}
+              </v-btn>
+            </v-card-text>
+          </v-card>
+        </v-col><v-col
+          v-if="voucherData != null"
+          :cols="12"
+          :lg="8"
+          :md="8"
+          :sm="12"
+        >
+          <v-card>
+            <v-card-title>{{ $t("voucher.details") }}</v-card-title>
+            <v-card-text>
+              <div class="px-3 pb-3">
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.number") }}: </span><span>{{ voucherData.id }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.id") }}: </span><span>{{ voucherData.voucherId }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.paid") }}: </span>
+                  <v-icon v-if="voucherData.paid">
+                    mdi-check-bold
+                  </v-icon>
+                  <v-icon
+                    v-if="!voucherData.paid"
+                    color="error"
+                  >
+                    mdi-close-box
+                  </v-icon>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.redeemed") }}: </span>
+                  <v-icon v-if="voucherData.redeemed">
+                    mdi-check-bold
+                  </v-icon>
+                  <v-icon
+                    v-if="!voucherData.redeemed"
+                  >
+                    mdi-close-box
+                  </v-icon>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.redeemDate") }}: </span><span>{{ voucherData.redeemDate }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.validUntil") }}: </span><span>{{ voucherData.validUntil }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.productDescription") }}: </span><span>{{ voucherData.productDescription }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.value") }}: </span><span>{{ voucherData.value }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.tax") }}: </span><span>{{ voucherData.tax }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.paymentProvider") }}: </span><span>{{ voucherData.paymentProvider }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.transactionId") }}: </span><span>{{ voucherData.transactionId }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.buyDate") }}: </span><span>{{ voucherData.buyDate }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("voucher.salutation") }}: </span><span>{{ voucherData.salutation }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("firstName") }}: </span><span>{{ voucherData.firstName }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("lastName") }}: </span><span>{{ voucherData.lastName }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("street") }}: </span><span>{{ voucherData.street }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("zip") }}: </span><span>{{ voucherData.zipCode }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("city") }}: </span><span>{{ voucherData.city }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("phone") }}: </span><span>{{ voucherData.phone }}</span>
+                </v-row>
+                <v-row>
+                  <span class="font-weight-bold">{{ $t("email.email") }}: </span><span>{{ voucherData.email }}</span>
+                </v-row>
+                <v-row>
+                  <v-alert
+                    v-if="!voucherData.redeemed && voucherData.paid && expiredYears > 0"
+                    type="warning"
+                  >
+                    {{
+                      $t("voucher.back-payment", {
+                        years: expiredYears,
+                        backPayment: backPayment,
+                      })
+                    }}
+                  </v-alert>
+                </v-row>
+                <v-row>
+                  <v-btn
+                    v-if="!voucherData.redeemed && voucherData.paid"
+                    :loading="loading"
+                    :disabled="loading"
+                    color="primary"
+                    @click="redeemVoucher"
+                  >
+                    {{ $t("voucher.redeem") }}
+                  </v-btn>
+                </v-row>
+              </div>
+            </v-card-text>
+          </v-card>
+        </v-col>
+      </v-row>
+    </div>
+    <div v-if="!loading && !authorized">
+      <v-row dense>
+        <v-alert type="error">
+          {{ message }}
+        </v-alert>
+      </v-row>
+    </div>
+  </v-container>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+import { DateTime } from "luxon";
+
+export default {
+  data: () => ({
+    loading: false,
+    authorized: false,
+    message: "",
+    voucherId: null,
+    voucherData: null,
+    hintText: "",
+    hintColor: "",
+    showHint: false,
+  }),
+  computed: {
+    expiredYears: function () {
+      if (this.voucherData !== null) {
+        let validUntilDateTime = DateTime.fromFormat(
+          this.voucherData.validUntil,
+          "dd.MM.yyyy"
+        );
+        let diffInYears = DateTime.now()
+          .diff(validUntilDateTime, "years")
+          .toObject().years;
+        if (diffInYears > 0) {
+          return Math.ceil(diffInYears);
+        }
+      }
+      return 0;
+    },
+    backPayment: function () {
+      return this.expiredYears * 15;
+    },
+  },
+  async created() {
+    this.loading = true;
+    this.loading = false;
+    this.authorized = true;
+  },
+  methods: {
+    ...mapActions(["getLegacyVoucherAction", "redeemLegacyVoucherAction"]),
+    async searchLegacyVoucher() {
+      this.loading = true;
+      let result = await this.getLegacyVoucherAction({
+        id: this.voucherId,
+        token: await this.$auth.getTokenSilently(),
+      });
+      this.voucherData = result.payload;
+      this.loading = false;
+    },
+    async redeemVoucher() {
+      this.loading = true;
+      let result = await this.redeemLegacyVoucherAction({
+        id: this.voucherId,
+        token: await this.$auth.getTokenSilently(),
+      });
+      this.voucherData = result.payload;
+
+      if (result.success) {
+        this.hintText = this.$t("voucher.redeem-successful");
+        this.hintColor = "green";
+      } else {
+        this.hintText = this.$t("voucher.redeem-error");
+        this.hintColor = "red";
+      }
+      this.showHint = true;
+      this.loading = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>