fix update balance on adminpage #31

This commit is contained in:
Tim Gröger 2023-05-10 00:27:41 +02:00
parent 3c938a8f99
commit a876f99e13
3 changed files with 34 additions and 29 deletions

View File

@ -3,7 +3,7 @@
<q-input v-model.number="amount" type="number" filled label="Eigener Betrag" step="0.1" min="0" suffix="€" /> <q-input v-model.number="amount" type="number" filled label="Eigener Betrag" step="0.1" min="0" suffix="€" />
</div> </div>
<div class="col-sm-4 col-xs-6"> <div class="col-sm-4 col-xs-6">
<q-btn v-close-popup style="width: 100%" color="primary" label="Anschreiben" @click="changeBalance(amount * -1)"> <q-btn style="width: 100%" color="primary" label="Anschreiben" @click="changeBalance(amount * -1)">
<q-tooltip v-if="canAddShortcut"> Rechtsklick um Betrag als Verknüpfung hinzuzufügen </q-tooltip> <q-tooltip v-if="canAddShortcut"> Rechtsklick um Betrag als Verknüpfung hinzuzufügen </q-tooltip>
<q-menu v-if="canAddShortcut" anchor="bottom middle" self="top middle" context-menu> <q-menu v-if="canAddShortcut" anchor="bottom middle" self="top middle" context-menu>
<q-btn label="neue Verknüpfung" @click="addShortcut"></q-btn> <q-btn label="neue Verknüpfung" @click="addShortcut"></q-btn>
@ -13,7 +13,6 @@
<div class="col-sm-4 col-xs-6"> <div class="col-sm-4 col-xs-6">
<q-btn <q-btn
v-if="canAddCredit" v-if="canAddCredit"
v-close-popup
style="width: 100%" style="width: 100%"
color="secondary" color="secondary"
label="Gutschreiben" label="Gutschreiben"
@ -39,7 +38,7 @@ export default defineComponent({
}, },
}, },
emits: { emits: {
changeBalance: (user: FG.User) => user, 'change-balance': (user: FG.User) => user,
}, },
setup(props, { emit }) { setup(props, { emit }) {
const store = useBalanceStore(); const store = useBalanceStore();
@ -47,7 +46,7 @@ export default defineComponent({
const amount = ref<number>(0); const amount = ref<number>(0);
async function changeBalance(amount: number) { async function changeBalance(amount: number) {
await store.changeBalance(amount, user.value); await store.changeBalance(amount, user.value);
emit('changeBalance', user.value); emit('change-balance', user.value);
} }
function addShortcut() { function addShortcut() {
if (amount.value != 0) void store.createShortcut(amount.value * -1); if (amount.value != 0) void store.createShortcut(amount.value * -1);

View File

@ -6,14 +6,7 @@
<UserSelector v-model="receiver" label="Empfänger" /> <UserSelector v-model="receiver" label="Empfänger" />
</div> </div>
<div class="col-sm-4 col-xs-6"> <div class="col-sm-4 col-xs-6">
<q-btn <q-btn style="width: 100%" color="primary" :disable="sendDisabled" label="Senden" @click="sendAmount" />
v-close-popup
style="width: 100%"
color="primary"
:disable="sendDisabled"
label="Senden"
@click="sendAmount"
/>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
@ -31,7 +24,7 @@ export default defineComponent({
}, },
}, },
emits: { emits: {
changeBalance: (sender: FG.User, receiver: FG.User) => sender && receiver, changeBalance: ({ sender, receiver }: { sender: FG.User; receiver: FG.User }) => sender && receiver,
}, },
setup(props, { emit }) { setup(props, { emit }) {
const store = useBalanceStore(); const store = useBalanceStore();
@ -51,7 +44,7 @@ export default defineComponent({
async function sendAmount() { async function sendAmount() {
if (receiver.value) { if (receiver.value) {
await store.changeBalance(amount.value, receiver.value, sender.value); await store.changeBalance(amount.value, receiver.value, sender.value);
emit('changeBalance', sender.value, receiver.value); emit('changeBalance', { sender: sender.value, receiver: receiver.value });
} }
} }
return { return {

View File

@ -5,13 +5,13 @@
:rows="rows" :rows="rows"
row-key="userid" row-key="userid"
:columns="columns" :columns="columns"
@request="onRequest"
:filter="filter" :filter="filter"
@request="onRequest"
> >
<template #top-right> <template #top-right>
<div class="full-width row q-gutter-sm"> <div class="full-width row q-gutter-sm">
<q-input v-model="filter" label="Filter" filled dense debounce="300"> <q-input v-model="filter" label="Filter" filled dense debounce="300">
<template v-slot:append> <template #append>
<q-icon name="mdi-magnify" /> <q-icon name="mdi-magnify" />
</template> </template>
</q-input> </q-input>
@ -43,7 +43,12 @@
</q-td> </q-td>
<q-td key="balance" :props="props"> <q-td key="balance" :props="props">
{{ getBalance(props.row.debit, props.row.credit) }} {{ getBalance(props.row.debit, props.row.credit) }}
<q-menu anchor="bottom middle" self="top middle" :persistent="$q.platform.is.mobile"> <q-menu
v-model="showMenu[props.row.userid]"
anchor="bottom middle"
self="top middle"
:persistent="$q.platform.is.mobile"
>
<q-card> <q-card>
<q-card-section> <q-card-section>
<q-tab-panels v-model="tab" animated> <q-tab-panels v-model="tab" animated>
@ -51,11 +56,14 @@
<balance-add-body <balance-add-body
:user="props.row.userid" :user="props.row.userid"
:can-add-shortcut="false" :can-add-shortcut="false"
@change-balance="updateBalance" @change-balance="updateBalance($event, props.row.userid)"
/> />
</q-tab-panel> </q-tab-panel>
<q-tab-panel name="transfer" class="fit column q-gutter-sm"> <q-tab-panel name="transfer" class="fit column q-gutter-sm">
<balance-transfer-body :user="props.row.userid" @change-balance="updateBalances" /> <balance-transfer-body
:user="props.row.userid"
@change-balance="updateBalances($event, props.row.userid)"
/>
</q-tab-panel> </q-tab-panel>
</q-tab-panels> </q-tab-panels>
</q-card-section> </q-card-section>
@ -84,8 +92,6 @@
</template> </template>
<script lang="ts"> <script lang="ts">
// TODO: Fill usefull data
import { ref, defineComponent, computed, onBeforeMount } from 'vue'; import { ref, defineComponent, computed, onBeforeMount } from 'vue';
import { useBalanceStore } from '../store'; import { useBalanceStore } from '../store';
import { useUserStore } from '@flaschengeist/api'; import { useUserStore } from '@flaschengeist/api';
@ -99,6 +105,8 @@ export default defineComponent({
const store = useBalanceStore(); const store = useBalanceStore();
const userStore = useUserStore(); const userStore = useUserStore();
const showMenu = ref<{ [userid: string]: boolean }>({});
onBeforeMount(() => { onBeforeMount(() => {
void userStore.getUsers(); void userStore.getUsers();
void store.getLimits(); void store.getLimits();
@ -183,7 +191,7 @@ export default defineComponent({
} catch (error) { } catch (error) {
console.warn(error); console.warn(error);
} }
console.log(pagination.value); //console.log(pagination.value);
loading.value = false; loading.value = false;
} }
@ -200,13 +208,18 @@ export default defineComponent({
return (credit - debit).toFixed(2); return (credit - debit).toFixed(2);
} }
function updateBalance(user: FG.User) { async function updateBalance(user: FG.User, ref_showMenu?: string) {
void store.getBalance(user); await store.getBalance(user);
if (ref_showMenu) {
showMenu.value[ref_showMenu] = false;
}
} }
async function updateBalances({ sender, receiver }: { sender: FG.User; receiver: FG.User }, ref_showMenu?: string) {
function updateBalances(sender: FG.User, receiver: FG.User) { await updateBalance(sender);
updateBalance(sender); await updateBalance(receiver);
updateBalance(receiver); if (ref_showMenu) {
showMenu.value[ref_showMenu] = false;
}
} }
function setLimit(userid: string) { function setLimit(userid: string) {
@ -227,7 +240,6 @@ export default defineComponent({
} }
const tab = ref('add'); const tab = ref('add');
return { return {
rows, rows,
columns, columns,
@ -245,6 +257,7 @@ export default defineComponent({
getFirstname, getFirstname,
getLastname, getLastname,
filter, filter,
showMenu,
}; };
}, },
}); });