trying setup store

src/views/Employees/Index.vue

@@ -36,8 +36,8 @@
             </th>
         </tr>
     </thead>
-    <transition-group name="list" tag="tbody">
-        <tr v-for="employee in rows" :key="employee.id" @click="router.push({name: 'Employees/Details', params: {id: employee.id}})">
+    <transition-group name="list" tag="tbody" mode="out-in">
+        <tr v-for="employee in store.rows" :key="employee.id" @click="router.push({name: 'Employees/Details', params: {id: employee.id}})">
             <td v-for="col in settings.employeesIndexColumnsSelected">
                 {{ employee[col] }}       
             </td>
@@ -45,7 +45,7 @@
     </transition-group>
 </table>
 
-<h5 v-show="rows.length === 0" class="text-muted">Keine Daten anzuzeigen...</h5>
+<h5 v-show="store.rows.length === 0" class="text-muted">Keine Daten anzuzeigen...</h5>
 
 <VPaginator 
     :radius="1" 
@@ -64,7 +64,7 @@ import VPaginator from '@/components/VPaginator.vue';
 import { onMounted, reactive, computed } from 'vue'
 import { useRouter } from 'vue-router'
 import { storeToRefs } from 'pinia'
-import { useEmployees } from '@/stores/employees'
+import useEmployees from '@/stores/employees'
 import { useSettings } from '@/stores/settings';
 import _difference from 'lodash/difference'
 
@@ -72,8 +72,6 @@ const store = useEmployees()
 const router = useRouter()
 const settingsStore = useSettings()
 
-const { rows, columns } = storeToRefs(store)
-
 const { settings } = storeToRefs(settingsStore)
 
 const sort_by = reactive({
@@ -108,7 +106,6 @@ function onSortBy(col : string) {
 
     sort_by.column = col
     store.sort_by = (sort_by.asc ? 'asc(' : 'desc(') + sort_by.column + ')'
-    store.fetchFromApi() 
 }
 
 const iconSort = computed(() => {