From 116dfa8acae123d3d86c6286dcd638eae7d74ddb Mon Sep 17 00:00:00 2001
From: mahula <lenzmath@posteo.de>
Date: Thu, 17 Nov 2022 18:48:37 +0100
Subject: [PATCH] set auto width for statistics table and right align text in
 colunms

---
 .../src/components/Tables/StatisticTable.vue  | 39 +++++++------------
 1 file changed, 15 insertions(+), 24 deletions(-)

diff --git a/admin/src/components/Tables/StatisticTable.vue b/admin/src/components/Tables/StatisticTable.vue
index 0095a8f57..624619a95 100644
--- a/admin/src/components/Tables/StatisticTable.vue
+++ b/admin/src/components/Tables/StatisticTable.vue
@@ -1,11 +1,11 @@
 <template>
   <div class="statistic-table">
-    <b-table-simple class="mt-5" :items="items" :fields="fields" striped stacked="md" responsive>
+    <b-table-simple style="width: auto;" class="mt-5" :items="items" :fields="fields" striped stacked="md">
       <b-thead>
         <b-tr>
           <b-th></b-th>
-          <b-th>{{ $t('statistic.count') }}</b-th>
-          <b-th>{{ $t('statistic.detail') }}</b-th>
+          <b-th class="text-right">{{ $t('statistic.count') }}</b-th>
+          <b-th class="text-right">{{ $t('statistic.detail') }}</b-th>
         </b-tr>
       </b-thead>
       <b-tbody>
@@ -13,50 +13,50 @@
           <b-td>
             <b>{{ $t('statistic.totalUsers') }}</b>
           </b-td>
-          <b-td>{{ value.totalUsers }}</b-td>
+          <b-td class="text-right">{{ value.totalUsers }}</b-td>
           <b-td></b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.activeUsers') }}</b>
           </b-td>
-          <b-td>{{ value.activeUsers }}</b-td>
+          <b-td class="text-right">{{ value.activeUsers }}</b-td>
           <b-td></b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.deletedUsers') }}</b>
           </b-td>
-          <b-td>{{ value.deletedUsers }}</b-td>
+          <b-td class="text-right">{{ value.deletedUsers }}</b-td>
           <b-td></b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.totalGradidoCreated') }}</b>
           </b-td>
-          <b-td>{{ $n(value.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }}</b-td>
-          <b-td>{{ value.totalGradidoCreated }}</b-td>
+          <b-td class="text-right">{{ $n(value.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }}</b-td>
+          <b-td class="text-right">{{ value.totalGradidoCreated }}</b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.totalGradidoDecayed') }}</b>
           </b-td>
-          <b-td>{{ $n(value.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }}</b-td>
-          <b-td>{{ value.totalGradidoDecayed }}</b-td>
+          <b-td class="text-right">{{ $n(value.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }}</b-td>
+          <b-td class="text-right">{{ value.totalGradidoDecayed }}</b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.totalGradidoAvailable') }}</b>
           </b-td>
-          <b-td>{{ $n(value.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }}</b-td>
-          <b-td>{{ value.totalGradidoAvailable }}</b-td>
+          <b-td class="text-right">{{ $n(value.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }}</b-td>
+          <b-td class="text-right">{{ value.totalGradidoAvailable }}</b-td>
         </b-tr>
         <b-tr>
           <b-td>
             <b>{{ $t('statistic.totalGradidoUnbookedDecayed') }}</b>
           </b-td>
-          <b-td>{{ $n(value.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }}</b-td>
-          <b-td>{{ value.totalGradidoUnbookedDecayed }}</b-td>
+          <b-td class="text-right">{{ $n(value.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }}</b-td>
+          <b-td class="text-right">{{ value.totalGradidoUnbookedDecayed }}</b-td>
         </b-tr>
       </b-tbody>
     </b-table-simple>
@@ -67,18 +67,9 @@ export default {
   name: 'StatisticTable',
   props: {
     value: {
-      type: Array,
+      type: Object,
       required: true,
     },
-    fields: {
-      type: Array,
-      required: true,
-    },
-  },
-  data() {
-    return {
-      // CONFIG,
-    }
   },
 }
 </script>