Просмотр исходного кода

fix: 修复权限列表渲染为空的bug

BaiLuoYan 2 дней назад
Родитель
Сommit
f1f84609b7

+ 4 - 2
src/pages/Admin/_shared/PermTree/components/PermList.tsx

@@ -17,8 +17,10 @@ export const PermList = memo(({ perms, checkedIds, onToggle, mode }: PermListPro
           {mode === 'edit' && (
             <Checkbox checked={checkedIds.has(p.id)} onChange={() => onToggle?.(p)} />
           )}
-          <span className="text-xs font-mono text-(--ant-color-primary)">{p.code}</span>
-          <span className="text-xs text-(--ant-color-text-tertiary)">{p.name}</span>
+          <span className="text-xs">
+            {p.name}
+            <span className="font-mono text-(--ant-color-text-quaternary) ml-1">({p.code})</span>
+          </span>
         </label>
       ))}
     </div>

+ 6 - 1
src/pages/Admin/_shared/PermTree/hooks/usePermTree.ts

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { buildPairMap, getPairId, groupPerms, matchesPerm, sortPerms } from '../lib/permUtils';
 
 interface UsePermTreeOptions {
@@ -13,6 +13,11 @@ export const usePermTree = ({ allPerms, initialCheckedIds = [], onChange }: UseP
   const onChangeRef = useRef(onChange);
   onChangeRef.current = onChange;
 
+  const checkedKey = initialCheckedIds.join(',');
+  useEffect(() => {
+    setCheckedIds(new Set(initialCheckedIds));
+  }, [checkedKey]);
+
   const sorted = useMemo(() => sortPerms(allPerms), [allPerms]);
   const grouped = useMemo(() => groupPerms(sorted), [sorted]);
   const pairMap = useMemo(() => buildPairMap(allPerms), [allPerms]);