Optimize load data

src/pages/system/Group.tsx

@@ -11,6 +11,7 @@ import {
     DATABASE_UPDATE_SUCCESS
 } from '@/constants/common.constants'
 import { utcToLocalTime } from '@/utils/common'
+import { useUpdatedEffect } from '@/utils/hooks'
 import {
     r_sys_group_add,
     r_sys_group_change_status,
@@ -174,6 +175,9 @@ const Group: React.FC = () => {
         form.setFieldValue('name', newFormValues?.name)
         form.setFieldValue('roleIds', newFormValues?.roleIds)
         form.setFieldValue('enable', newFormValues?.enable ?? true)
+        if (!roleData || !roleData.length) {
+            getRoleData()
+        }
     }
 
     const handleOnListDeleteBtnClick = () => {
@@ -220,6 +224,9 @@ const Group: React.FC = () => {
                 value.roles.map((role) => role.id)
             )
             form.setFieldValue('enable', value.enable)
+            if (!roleData || !roleData.length) {
+                getRoleData()
+            }
             void form.validateFields()
         }
     }
@@ -469,11 +476,7 @@ const Group: React.FC = () => {
         }
     }, [formValues])
 
-    useEffect(() => {
+    useUpdatedEffect(() => {
-        getRoleData()
-    }, [])
-
-    useEffect(() => {
         getGroup()
     }, [
         JSON.stringify(tableParams.filters),

src/pages/system/Log.tsx

@@ -6,6 +6,7 @@ import {
     DATABASE_SELECT_SUCCESS
 } from '@/constants/common.constants'
 import { dayjsToUtc, utcToLocalTime } from '@/utils/common'
+import { useUpdatedEffect } from '@/utils/hooks'
 import { r_sys_log_get } from '@/services/system'
 import FitFullScreen from '@/components/common/FitFullScreen'
 import Card from '@/components/common/Card'
@@ -256,7 +257,7 @@ const Log: React.FC = () => {
             })
     }
 
-    useEffect(() => {
+    useUpdatedEffect(() => {
         getLog()
     }, [
         JSON.stringify(tableParams.filters),

src/pages/system/Role.tsx

@@ -11,6 +11,7 @@ import {
     DATABASE_UPDATE_SUCCESS
 } from '@/constants/common.constants'
 import { utcToLocalTime, powerListToPowerTree } from '@/utils/common'
+import { useUpdatedEffect } from '@/utils/hooks'
 import {
     r_sys_role_add,
     r_sys_role_change_status,
@@ -166,6 +167,9 @@ const Role: React.FC = () => {
         form.setFieldValue('name', newFormValues?.name)
         form.setFieldValue('powerIds', newFormValues?.powerIds)
         form.setFieldValue('enable', newFormValues?.enable ?? true)
+        if (!powerTreeData || !powerTreeData.length) {
+            getPowerTreeData()
+        }
     }
 
     const handleOnListDeleteBtnClick = () => {
@@ -212,6 +216,9 @@ const Role: React.FC = () => {
                 value.operations.map((operation) => operation.id)
             )
             form.setFieldValue('enable', value.enable)
+            if (!powerTreeData || !powerTreeData.length) {
+                getPowerTreeData()
+            }
             void form.validateFields()
         }
     }
@@ -478,11 +485,7 @@ const Role: React.FC = () => {
         }
     }, [formValues])
 
-    useEffect(() => {
+    useUpdatedEffect(() => {
-        getPowerTreeData()
-    }, [])
-
-    useEffect(() => {
         getRole()
     }, [
         JSON.stringify(tableParams.filters),

src/pages/system/User.tsx

@@ -12,6 +12,7 @@ import {
     DATABASE_UPDATE_SUCCESS
 } from '@/constants/common.constants'
 import { utcToLocalTime, isPastTime, localTimeToUtc, dayjsToUtc, getNowUtc } from '@/utils/common'
+import { useUpdatedEffect } from '@/utils/hooks'
 import {
     r_sys_group_get_list,
     r_sys_role_get_list,
@@ -259,6 +260,12 @@ const User: React.FC = () => {
         form.setFieldValue('roleIds', newFormValues?.roleIds)
         form.setFieldValue('groupIds', newFormValues?.groupIds)
 
+        if (!roleData || !roleData.length) {
+            getRoleData()
+        }
+        if (!groupData || !groupData.length) {
+            getGroupData()
+        }
         getAvatar()
     }
 
@@ -429,6 +436,12 @@ const User: React.FC = () => {
                 'groupIds',
                 value.groups.map((group) => group.id)
             )
+            if (!roleData || !roleData.length) {
+                getRoleData()
+            }
+            if (!groupData || !groupData.length) {
+                getGroupData()
+            }
             void form.validateFields()
         }
     }
@@ -718,11 +731,7 @@ const User: React.FC = () => {
         }
     }, [formValues])
 
-    useEffect(() => {
+    useUpdatedEffect(() => {
-        handleOnDrawerRefresh()
-    }, [])
-
-    useEffect(() => {
         getUser()
     }, [
         JSON.stringify(tableParams.filters),

src/utils/hooks.tsx

@@ -0,0 +1,16 @@
+import React from 'react'
+
+export const useUpdatedEffect = (
+    effect: React.EffectCallback,
+    dependencies: React.DependencyList
+) => {
+    const isFirstRender = useRef(true)
+
+    useEffect(() => {
+        if (isFirstRender.current) {
+            isFirstRender.current = false
+        } else {
+            effect()
+        }
+    }, dependencies)
+}