.gitignore

@@ -1,5 +1,3 @@
 node_modules
 yarn-error.log
 yarn.lock
-
-.idea

src/pages/Admin.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <q-page padding>
-      <q-table :rows="rows" row-key="userid" :columns="columns" v-model:pagination="pagination" @request="onRequest">
+      <q-table :rows="rows" row-key="userid" :columns="columns">
         <template #top-right>
           <div class="full-width row q-gutter-sm">
             <q-input
@@ -18,14 +18,11 @@
         </template>
         <template #body="props">
           <q-tr :props="props">
-            <q-td key="firstname" :props="props">
+            <q-td key="userid" :props="props">
-              {{ getFirstname(props.row.userid) }}
+              {{ getName(props.row.userid) }}
-            </q-td>
-            <q-td key="lastname" :props="props">
-              {{ getLastname(props.row.userid)}}
             </q-td>
             <q-td key="limit" :props="props">
-              {{ getLimit(props.row.userid) || 'Kein Limit' }}
+              {{ getLimit(props.row.userid) }}€
               <q-popup-edit
                 v-slot="scope"
                 v-model="limit"
@@ -108,8 +105,10 @@ export default defineComponent({
     const store = useBalanceStore();
     const userStore = useUserStore();
 
-    onBeforeMount( () => {
+    onBeforeMount(() => {
-      void onRequest({pagination: pagination.value, filter: undefined})
+      void store.getBalances();
+      void userStore.getUsers();
+      void store.getLimits();
     });
 
     const rows = computed(() => store.balances);
@@ -117,26 +116,32 @@ export default defineComponent({
 
     const columns = [
       {
-        name: 'firstname',
+        name: 'userid',
-        label: 'Vorname',
+        label: 'Benutzer ID',
         field: 'userid',
+        required: true,
         align: 'left',
-        sortable: true
+        sortable: true,
+        format: getName,
+      },
+      /*{
+        name: 'credit',
+        label: 'Haben',
+        field: 'credit',
+        format: (val: number) => val.toFixed(2),
       },
       {
-        name: 'lastname',
+        name: 'debit',
-        label: 'Vorname',
+        label: 'Soll',
-        field: 'userid',
+        field: 'debit',
-        align: 'left',
+        format: (val: number) => val.toFixed(2),
-        sortable: true
+      },*/
-      },
       {
         name: 'limit',
         label: 'Limit',
         align: 'right',
         field: 'userid',
         format: (_: undefined, row: { userid: string }) => getLimit(row.userid),
-        sortable: true
       },
       {
         name: 'balance',
@@ -146,61 +151,25 @@ export default defineComponent({
         format: (_: undefined, row: { debit: number; credit: number }) =>
           getBalance(row.debit, row.credit),
         sortable: true,
+        sort: (
+          _: undefined,
+          __: undefined,
+          a: { debit: number; credit: number },
+          b: { debit: number; credit: number }
+        ) => {
+          return (
+            parseFloat(getBalance(a.debit, a.credit)) - parseFloat(getBalance(b.debit, b.credit))
+          );
+        },
       },
     ];
 
-    interface PaginationInterface {
-      sortBy: string;
-      descending: boolean;
-      page: number;
-      rowsPerPage: number;
-      rowsNumber: number;
-    }
-
-    const pagination = ref<PaginationInterface>({
-      sortBy: 'lastname',
-      rowsPerPage: 5,
-      rowsNumber: 10,
-      descending: false,
-      page: 1,
-    })
-
-    const loading = ref(false)
-
-    async function onRequest(props: {pagination: PaginationInterface; filter?: string}) {
-      const {page, rowsPerPage, sortBy, descending} = props.pagination;
-      loading.value = true;
-      const fetchCount = rowsPerPage === 0 ? pagination.value.rowsNumber : rowsPerPage;
-      const startRow = (page - 1) * rowsPerPage;
-
-      try {
-        const result = await store.getBalances({
-          limit: fetchCount,
-          offset: startRow,
-          descending: descending ? true : undefined,
-          sortBy,
-        })
-        pagination.value.page = page;
-        pagination.value.rowsPerPage = rowsPerPage;
-        pagination.value.sortBy = sortBy;
-        pagination.value.descending = descending;
-        if (result.count) pagination.value.rowsNumber = result.count;
-        void userStore.getUsers(true, {userids: result.userids});
-        void store.getLimits({userids: result.userids});
-      } catch (error) {
-        console.warn(error)
-      }
-      console.log(pagination.value)
-      loading.value = false
-    }
-
     function getName(val: string) {
       return userStore.users.find((a) => a.userid === val)?.display_name;
     }
 
     function getLimit(val: string) {
-      const limit = store.user_limits.find((a) => a.userid === val)?.limit?.toFixed(2);
+      return store.user_limits.find((a) => a.userid === val)?.limit?.toFixed(2);
-      return limit ? `${limit} €` : undefined
     }
 
     function getBalance(debit: number, credit: number) {
@@ -225,14 +194,6 @@ export default defineComponent({
       }, 100);
     }
 
-    function getFirstname(userid: string) {
-      return userStore.users.find((a) => a.userid === userid)?.firstname
-    }
-
-    function getLastname(userid: string) {
-      return userStore.users.find((a) => a.userid === userid)?.lastname
-    }
-
     const tab = ref('add');
 
     return {
@@ -247,10 +208,6 @@ export default defineComponent({
       updateBalance,
       updateBalances,
       tab,
-      pagination,
-      onRequest,
-      getFirstname,
-      getLastname,
     };
   },
 });

src/pages/Overview.vue

@@ -10,7 +10,6 @@
         <q-table
           v-model:pagination="pagination"
           title="Buchungen"
-          flat
           :rows="data"
           :columns="columns"
           row-key="id"

src/store.ts

@@ -40,7 +40,7 @@ export const useBalanceStore = defineStore({
   }),
 
   getters: {
-    balance(): BalancesResponse | undefined {
+    balance() {
       const mainStore = useMainStore();
       return this.balances.find((v) => v.userid === mainStore.user?.userid);
     },
@@ -77,20 +77,12 @@ export const useBalanceStore = defineStore({
       return data;
     },
 
-    async getBalances(filter?: {limit?: number, offset?: number, sortBy?: string, descending?: boolean}) {
+    async getBalances(force = false) {
-      const { data } = await api.get<{balances: BalancesResponse[], count: number}>('/balance', {
+      if (force || this.balances.length == 0 || new Date().getTime() - this._balances_dirty > 60000) {
-        params: filter
+        const { data } = await api.get<BalancesResponse[]>('/balance');
-      });
+        this.balances = data;
-      this.balances = data.balances;
+      }
-      let userids = ""
+      return this.balances;
-      data.balances.forEach(response => {
-        userids += `,${response.userid}`
-      })
-      await api.get<FG.User>('/users', {
-          params: {userids: userids},
-        }
-      )
-      return {balances: this.balances, count: data.count, userids};
     },
 
     async changeBalance(amount: number, user: FG.User, sender: FG.User | undefined = undefined) {
@@ -166,10 +158,8 @@ export const useBalanceStore = defineStore({
       this._balances_dirty = 0;
     },
 
-    async getLimits(filter?: {userids: undefined|string}) {
+    async getLimits() {
-      const { data } = await api.get<Array<UserLimit>>('users/balance/limit', {
+      const { data } = await api.get<Array<UserLimit>>('users/balance/limit');
-        params: filter
-      });
       this.user_limits = data;
     },