Amélioration de la gestion des états d'identité en ajustant les paramètres 'lazy' et 'immediate' dans les requêtes HTTP et en ajoutant des mises à jour réactives dans les composants

Author: tacxou

nuxt.config.ts

@@ -123,6 +123,7 @@ export default defineNuxtConfig({
         target: SESAME_APP_API_URL,
         secure: false,
         changeOrigin: true,
+        xfwd: true,
       }
     },
     cors: false,

src/components/2pan/index.vue

@@ -275,6 +275,12 @@ const route = useRoute()
 const { pagination, onRequest, initializePagination } = usePagination()
 initializePagination(props.total)
 
+watch(() => props.data, async () => {
+  if (pagination.value) {
+    pagination.value.rowsNumber = props.total
+  }
+})
+
 const emit = defineEmits(['create', 'refresh', 'read', 'update', 'delete'])
 const { debug } = useDebug()
 

src/composables/usePagination.ts

@@ -13,7 +13,7 @@ export default function usePagination() {
     rowsPerPage: 16,
     sortBy: 'metadata.lastUpdatedAt',
     descending: true,
-  })
+  }) as Ref<QTableProps['pagination']>
 
   async function initializePagination(total: number = 0) {
     if (!pagination.value) return

src/pages/identities/index.vue

@@ -111,6 +111,10 @@ const {
 } = await useHttp<Response>('/management/identities', {
   method: 'get',
   query: queryWithoutRead,
+  onResponse: () => {
+    const identityStateStore = useIdentityStateStore()
+    identityStateStore.fetchAllStateCount()
+  },
 })
 
 if (error.value) {

src/pages/identities/readonly.vue

@@ -19,7 +19,7 @@ q-page.container
     :titleKey=["inetOrgPerson.cn"]
     :crud="crud"
     :actions="actions"
-    hide-left-buttons="true"
+    :hide-left-buttons="true"
     :defaultRightPanelButton="false"
   )
     template(#right-panel-title-before="props")
@@ -101,6 +101,10 @@ const {
 } = await useHttp<Response>('/management/identities', {
   method: 'get',
   query: queryWithoutRead,
+  onResponse: () => {
+    const identityStateStore = useIdentityStateStore()
+    identityStateStore.fetchAllStateCount()
+  },
 })
 
 if (error.value) {

src/stores/identityState.ts

@@ -40,7 +40,7 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchTotalCount() {
       try {
         const { data } = await useHttp<any>('/management/identities/count?limit=99999999', {
-          lazy: true,
+          lazy: false,
           immediate: false,
         });
         this.total = data.value?.data;
@@ -52,8 +52,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchToCompleteCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.TO_COMPLETE}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.TO_COMPLETE] = data.value?.data;
       } catch (error) {
@@ -63,8 +63,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchToValidateCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.TO_VALIDATE}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.TO_VALIDATE] = data.value?.data;
       } catch (error) {
@@ -74,8 +74,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchOnErrorCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.ON_ERROR}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.ON_ERROR] = data.value?.data;
       } catch (error) {
@@ -85,8 +85,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchToSyncCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.TO_SYNC}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.TO_SYNC] = data.value?.data;
       } catch (error) {
@@ -96,8 +96,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchProcessingCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.PROCESSING}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.PROCESSING] = data.value?.data;
       } catch (error) {
@@ -107,8 +107,8 @@ export const useIdentityStateStore = defineStore('identityStates', {
     async fetchSyncedCount() {
       try {
         const { data } = await useHttp<any>(`/management/identities/count?filters[@state][]=${IdentityState.SYNCED}&limit=99999999`, {
-          lazy: true,
-          immediate: false,
+          lazy: false,
+          immediate: true,
         });
         this[IdentityState.SYNCED] = data.value?.data;
       } catch (error) {