Collection replace SubResource component

components/Ui/SubResource.vue → components/Ui/Collection.vue

@@ -3,7 +3,7 @@
 <template>
   <main>
     <v-skeleton-loader
-      v-if="$fetchState.pending"
+      v-if="fetchState.pending"
       :type="loaderType"
     />
     <div v-else>
@@ -22,22 +22,22 @@
 
 <script lang="ts">
 import {
-  defineComponent, computed, useContext, useFetch, toRefs, ToRefs, ComputedRef
+  defineComponent, computed, useContext, toRefs, ToRefs, ComputedRef
 } from '@nuxtjs/composition-api'
 import { Query } from '@vuex-orm/core'
 import { Collection } from '@vuex-orm/core/dist/src/data/Data'
 import { queryHelper } from '~/services/store/query'
-import { QUERY_TYPE } from '~/types/enums'
+import {useDataUtils} from "~/composables/data/useDataUtils";
 
 export default defineComponent({
   props: {
     rootModel: {
       type: Function,
-      required: true
+      required: false
     },
     rootId: {
       type: Number,
-      required: true
+      required: false
     },
     model: {
       type: Function,
@@ -60,19 +60,13 @@ export default defineComponent({
   setup (props) {
     const { rootModel, rootId, model, query }: ToRefs = toRefs(props)
     const { $dataProvider } = useContext()
-    useFetch(async () => {
-      await $dataProvider.invoke({
-        type: QUERY_TYPE.MODEL,
-        model: model.value,
-        rootModel: rootModel.value,
-        rootId: rootId.value
-      })
-    })
-
+    const { getCollection } = useDataUtils($dataProvider)
+    const {fetchState} = getCollection(model.value, rootModel.value, rootId.value)
     const items: ComputedRef<Collection> = computed(() => queryHelper.getCollection(query.value))
 
     return {
-      items
+      items,
+      fetchState
     }
   }
 })

pages/organization/index.vue

@@ -96,7 +96,7 @@ Contient toutes les informations sur l'organization courante
             <v-container fluid class="container">
               <v-row>
                 <v-col cols="12" sm="12">
-                  <UiSubResource
+                  <UiCollection
                     :query="repositories().addressRepository.with('addressPostal')"
                     :root-model="models().Organization"
                     :root-id="id"
@@ -142,7 +142,7 @@ Contient toutes les informations sur l'organization courante
                         </v-row>
                       </v-container>
                     </template>
-                  </UiSubResource>
+                  </UiCollection>
                 </v-col>
               </v-row>
             </v-container>
@@ -153,7 +153,7 @@ Contient toutes les informations sur l'organization courante
             <v-container class="container">
               <v-row>
                 <v-col cols="12" sm="12">
-                  <UiSubResource
+                  <UiCollection
                     :query="repositories().contactPointRepository.query()"
                     :root-model="models().Organization"
                     :root-id="id"
@@ -192,7 +192,7 @@ Contient toutes les informations sur l'organization courante
                         </v-row>
                       </v-container>
                     </template>
-                  </UiSubResource>
+                  </UiCollection>
                 </v-col>
               </v-row>
             </v-container>
@@ -296,7 +296,7 @@ Contient toutes les informations sur l'organization courante
             <v-container class="container">
               <v-row>
                 <v-col cols="12" sm="12">
-                  <UiSubResource
+                  <UiCollection
                     :query="repositories().netWorkOrganizationRepository.with('network')"
                     :root-model="models().Organization"
                     :root-id="id"
@@ -308,7 +308,7 @@ Contient toutes les informations sur l'organization courante
                         <span>{{ item.network.name }}</span> - <span>{{$t('first_subscription')}} : <UiTemplateDate :data="item.startDate" /></span>
                       </div>
                     </template>
-                  </UiSubResource>
+                  </UiCollection>
                 </v-col>
                 <v-col v-if="organizationProfile.isFfec()" cols="12" sm="6">
                   <UiInputText field="budget" :data="entry['budget']" type="number" @update="updateRepository" />
@@ -367,7 +367,7 @@ Contient toutes les informations sur l'organization courante
                 </v-col>
 
                 <v-col cols="12" sm="12">
-                  <UiSubResource
+                  <UiCollection
                     :query="repositories().organizationArticleRepository.query()"
                     :root-model="models().Organization"
                     :root-id="id"
@@ -387,7 +387,7 @@ Contient toutes les informations sur l'organization courante
                         <template #item.date="{item}"><UiTemplateDate :data="item.date" /></template>
                       </UiTemplateDataTable>
                     </template>
-                  </UiSubResource>
+                  </UiCollection>
                 </v-col>
 
               </v-row>
@@ -399,7 +399,7 @@ Contient toutes les informations sur l'organization courante
             <v-container class="container">
               <v-row>
                 <v-col cols="12" sm="12">
-                  <UiSubResource
+                  <UiCollection
                     :query="repositories().bankAccountRepository.query()"
                     :root-model="models().Organization"
                     :root-id="id"
@@ -435,7 +435,7 @@ Contient toutes les informations sur l'organization courante
                         </v-row>
                       </v-container>
                     </template>
-                  </UiSubResource>
+                  </UiCollection>
                 </v-col>
               </v-row>
             </v-container>