From 56b09abeaa441d38aacbf1bcdaeba0099ce6ef4a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Gr=C3=B6ger?= <tim@groeger-clan.de>
Date: Wed, 17 May 2023 13:46:54 +0200
Subject: [PATCH] fix #33, values only in full cents

---
 src/components/BalanceAddBody.vue      | 25 ++++++++++++++++++-----
 src/components/BalanceTransferBody.vue | 28 +++++++++++++++++++++++---
 src/pages/BalanceAdminPage.vue         | 27 +++++++++++++++++++++++--
 src/utils/index.ts                     |  3 +++
 4 files changed, 73 insertions(+), 10 deletions(-)
 create mode 100644 src/utils/index.ts

diff --git a/src/components/BalanceAddBody.vue b/src/components/BalanceAddBody.vue
index d15b721..d011ebb 100644
--- a/src/components/BalanceAddBody.vue
+++ b/src/components/BalanceAddBody.vue
@@ -1,6 +1,16 @@
 <template>
   <div class="col-sm-4 col-xs-12">
-    <q-input v-model.number="amount" type="number" filled label="Eigener Betrag" step="0.1" min="0" suffix="€" />
+    <q-input
+      v-model.number="amount"
+      ref="refAmount"
+      type="number"
+      filled
+      label="Eigener Betrag"
+      step="0.1"
+      min="0"
+      suffix="€"
+      :rules="[check_cent_step]"
+    />
   </div>
   <div class="col-sm-4 col-xs-6">
     <q-btn style="width: 100%" color="primary" label="Anschreiben" @click="changeBalance(amount * -1)">
@@ -22,9 +32,11 @@
 </template>
 <script lang="ts">
 import { defineComponent, ref, PropType, computed, watch } from 'vue';
+import { QInput } from 'quasar';
 import { useBalanceStore } from '../store';
 import { hasPermission, useUserStore } from '@flaschengeist/api';
 import PERMISSIONS from '../permissions';
+import { check_cent_step } from '../utils';
 export default defineComponent({
   name: 'BalanceAddBody',
   props: {
@@ -44,12 +56,15 @@ export default defineComponent({
     const store = useBalanceStore();
     const userStore = useUserStore();
     const amount = ref<number>(0);
+    const refAmount = ref<QInput>();
     async function changeBalance(amount: number) {
-      await store.changeBalance(amount, user.value);
+      await refAmount.value?.validate();
+      if (amount != 0 && !refAmount.value?.hasError) await store.changeBalance(amount, user.value);
       emit('change-balance', user.value);
     }
-    function addShortcut() {
-      if (amount.value != 0) void store.createShortcut(amount.value * -1);
+    async function addShortcut() {
+      await refAmount.value?.validate();
+      if (amount.value != 0 && !refAmount.value?.hasError) void store.createShortcut(amount.value * -1);
     }
     const canAddCredit = hasPermission(PERMISSIONS.CREDIT);
     const user = computed(() =>
@@ -60,7 +75,7 @@ export default defineComponent({
     watch(amount, (a) => {
       amount.value = Math.abs(a);
     });
-    return { changeBalance, addShortcut, canAddCredit, amount };
+    return { changeBalance, addShortcut, canAddCredit, amount, check_cent_step, refAmount };
   },
 });
 </script>
diff --git a/src/components/BalanceTransferBody.vue b/src/components/BalanceTransferBody.vue
index 471be2b..7e9b5a1 100644
--- a/src/components/BalanceTransferBody.vue
+++ b/src/components/BalanceTransferBody.vue
@@ -1,6 +1,16 @@
 <template>
   <div class="col-sm-4 col-xs-12">
-    <q-input v-model.number="amount" type="number" filled label="Betrag" step="0.1" min="0" suffix="€" />
+    <q-input
+      v-model.number="amount"
+      ref="refAmount"
+      type="number"
+      filled
+      label="Betrag"
+      step="0.1"
+      min="0"
+      suffix="€"
+      :rules="[check_cent_step]"
+    />
   </div>
   <div class="col-sm-4 col-xs-6">
     <UserSelector v-model="receiver" label="Empfänger" />
@@ -11,8 +21,10 @@
 </template>
 <script lang="ts">
 import { computed, defineComponent, PropType, ref } from 'vue';
+import { QInput } from 'quasar';
 import UserSelector from '@flaschengeist/users/src/components/UserSelector.vue';
 import { useBalanceStore } from '../store';
+import { check_cent_step } from '../utils';
 import { useUserStore } from '@flaschengeist/api';
 export default defineComponent({
   name: 'BalanceTransferBody',
@@ -31,6 +43,7 @@ export default defineComponent({
     const userStore = useUserStore();
     const receiver = ref<FG.User | undefined>(undefined);
     const amount = ref<number>(0);
+    const refAmount = ref<QInput>();
     const sender = computed(() =>
       (<FG.User>props.user).userid
         ? <FG.User>props.user
@@ -38,11 +51,18 @@ export default defineComponent({
     );
 
     const sendDisabled = computed(() => {
-      return !(receiver.value && sender.value && sender.value.userid != receiver.value.userid && amount.value > 0);
+      return !(
+        receiver.value &&
+        sender.value &&
+        sender.value.userid != receiver.value.userid &&
+        amount.value > 0 &&
+        !refAmount.value?.hasError
+      );
     });
 
     async function sendAmount() {
-      if (receiver.value) {
+      await refAmount.value?.validate();
+      if (receiver.value && !refAmount.value?.hasError) {
         await store.changeBalance(amount.value, receiver.value, sender.value);
         emit('changeBalance', { sender: sender.value, receiver: receiver.value });
       }
@@ -53,6 +73,8 @@ export default defineComponent({
       amount,
       sendAmount,
       sendDisabled,
+      refAmount,
+      check_cent_step,
     };
   },
 });
diff --git a/src/pages/BalanceAdminPage.vue b/src/pages/BalanceAdminPage.vue
index 4b756aa..6e4cf90 100644
--- a/src/pages/BalanceAdminPage.vue
+++ b/src/pages/BalanceAdminPage.vue
@@ -15,7 +15,17 @@
               <q-icon name="mdi-magnify" />
             </template>
           </q-input>
-          <q-input v-model.number="limit" label="Limit" type="number" step="0.01" suffix="€" filled dense>
+          <q-input
+            ref="refLimit"
+            v-model.number="limit"
+            label="Limit"
+            type="number"
+            step="0.01"
+            suffix="€"
+            filled
+            dense
+            :rules="[check_cent_step]"
+          >
             <template #prepend>
               <q-btn
                 :icon="sign === '+' ? 'mdi-plus' : 'mdi-minus'"
@@ -107,6 +117,8 @@
 
 <script lang="ts">
 import { ref, defineComponent, computed, onBeforeMount } from 'vue';
+import { QInput } from 'quasar';
+import { check_cent_step } from '../utils';
 import { useBalanceStore } from '../store';
 import { useUserStore } from '@flaschengeist/api';
 import BalanceAddBody from '../components/BalanceAddBody.vue';
@@ -120,6 +132,7 @@ export default defineComponent({
     const userStore = useUserStore();
 
     const showMenu = ref<{ [userid: string]: boolean }>({});
+    const refLimit = ref<QInput>();
 
     onBeforeMount(() => {
       void userStore.getUsers();
@@ -241,6 +254,10 @@ export default defineComponent({
       if (sign.value === '-') {
         l = -l;
       }
+      await refLimit.value?.validate();
+      if (refLimit.value?.hasError) {
+        return;
+      }
       await store.setLimit(l, userid);
       limit.value = undefined;
     }
@@ -257,10 +274,14 @@ export default defineComponent({
       sign.value = sign.value === '+' ? '-' : '+';
     }
 
-    function setLimits(l: number) {
+    async function setLimits(l: number) {
       if (sign.value === '-') {
         l = -l;
       }
+      await refLimit.value?.validate();
+      if (refLimit.value?.hasError) {
+        return;
+      }
       void store.setLimits(l);
     }
 
@@ -285,6 +306,8 @@ export default defineComponent({
       showMenu,
       sign,
       changeSign,
+      check_cent_step,
+      refLimit,
     };
   },
 });
diff --git a/src/utils/index.ts b/src/utils/index.ts
new file mode 100644
index 0000000..4f9fb6a
--- /dev/null
+++ b/src/utils/index.ts
@@ -0,0 +1,3 @@
+export function check_cent_step(value: number): boolean | string {
+  return (value * 100) % 1 === 0 || 'Betrag muss in 1-Cent-Schritten angegeben werden';
+}