fix:bug修复

src/components/CheckBoxTree/index.tsx

-import React, { RefObject, useRef } from 'react';
+import React, { RefObject, useRef, useEffect } from 'react';
 import { Button, Checkbox } from 'antd';
 import { useSelections } from '@umijs/hooks';
 import { findTreeKeys } from '@/utils';
@@ -13,6 +13,7 @@ export interface CheckboxTreeProps {
   showSave?;
   disabled?: boolean;
   actions?: RefObject<any>;
+  checkIds: any;
 }
 
 const CheckboxTree: React.FC<CheckboxTreeProps> = props => {
@@ -24,6 +25,7 @@ const CheckboxTree: React.FC<CheckboxTreeProps> = props => {
     disabled,
     showSave,
     handleSubmit,
+    checkIds,
   } = props;
   const checkedKeys = findTreeKeys(checkedNodes, 'id');
   const {
@@ -49,8 +51,13 @@ const CheckboxTree: React.FC<CheckboxTreeProps> = props => {
       selectAll();
     }
   };
-
+  useEffect(() => {
+    for (let i = 0; i < checkIds?.length; i++) {
+      selected.push(checkIds[i])
+    }
+  }, [checkIds])
   const checkChange = (e?) => {
+
     handleChange && handleChange(e);
   };
   return (
@@ -60,11 +67,11 @@ const CheckboxTree: React.FC<CheckboxTreeProps> = props => {
           <div>{props.title}</div>
           <div>
             <Button onClick={toggleSelectAll} type="link" disabled={disabled}>
-              {allSelected ? intl.formatMessage({id: 'components.quxiaoquanxuan'}) : intl.formatMessage({id: 'components.quanxuan'})}
+              {allSelected ? intl.formatMessage({ id: 'components.quxiaoquanxuan' }) : intl.formatMessage({ id: 'components.quanxuan' })}
             </Button>
             {showSave && (
               <Button onClick={handleSubmit} type="link" disabled={disabled}>
-                {intl.formatMessage({id: 'components.baocun'})}
+                {intl.formatMessage({ id: 'components.baocun' })}
               </Button>
             )}
           </div>
@@ -80,8 +87,9 @@ const CheckboxTree: React.FC<CheckboxTreeProps> = props => {
                   disabled={disabled}
                   onClick={() => toggle(v.id)}
                   checked={isSelected(v.id)}
+                // checked={checkIds?.indexOf[v?.id] != -1 ? false : true}
                 >
-                  {v.buttonName}
+                  {v.name}
                 </Checkbox>
               </li>
             );

src/pages/authConfig/memberSystem/memberDetail.tsx

@@ -125,6 +125,8 @@ const MemberDetail: React.FC<{}> = () => {
   const formInitValue = nodeRecord ? getButtonAuth(nodeRecord.key) : {};
   const [errors, setErrors] = useState<boolean>(false);
   const [formValue, setFormValue] = useState<any>(null);
+  // 控制按钮权限是否能勾选
+  const [checkflag, setcheckflag] = useState<boolean>(false)
 
   // 储存的按钮数据
   const [buttonInfos, setButtonInfos] = useState<any>([]);
@@ -161,12 +163,8 @@ const MemberDetail: React.FC<{}> = () => {
         menuId: node ? node.id : nodeRecord.id,
         ...params,
       });
-      console.log(data, 'data')
       if (!isAdd && data.orgIds) {
-        console.log(plateformTreeData, 'plateformTreeData');
-        console.log(data.orgIds, 'data.orgIds');
         let plateformTreeDataList = mapkey(plateformTreeData, data.orgIds, [])
-        console.log(plateformTreeDataList)
         setplateformTreeList(plateformTreeDataList)
       }
       setButtonAuth(node.id, data);
@@ -195,8 +193,12 @@ const MemberDetail: React.FC<{}> = () => {
   });
 
   const handleNodeSelected = async (selectKey, selectNode) => {
+    console.log(actionRef.current.selected)
     try {
       const { node } = await handleSelect(selectKey, selectNode);
+      const res = getMemberRoleAuthButton({ menuId: selectKey })
+      setcheckflag(treeActions.getSelectKeys().indexOf(selectKey) != -1)
+      // console.log(node)
       if (nodeRecord) {
         return new Promise((resolve, reject) => {
           if (selectKey !== nodeRecord.key) {
@@ -204,6 +206,7 @@ const MemberDetail: React.FC<{}> = () => {
               .then(() => {
                 setNodeRecord(node);
                 fetchItemDetailData(node);
+                setButtonInfos(node.buttons)
                 resolve(true);
               })
               .catch(() => {
@@ -220,6 +223,12 @@ const MemberDetail: React.FC<{}> = () => {
     } catch (error) { }
   };
 
+  const handleCheck = async (e) => {
+    const { checked } = e;
+    if (nodeRecord) {
+      setcheckflag(checked.indexOf(nodeRecord.id) != -1 ? true : false)
+    }
+  }
   // 编辑和预览模式下需回显数据
   const fetchRoleMenuDetail = async id => {
     // 10秒缓存
@@ -243,10 +252,8 @@ const MemberDetail: React.FC<{}> = () => {
   }, []);
 
   useEffect(() => {
+    // console.log(formInitValue)
     if (formInitValue) {
-      // 显示右侧checkbox
-      setButtonInfos(formInitValue.buttons || []);
-      // 回显右侧checkbox的值
       if (actionRef.current.setSelected) {
         actionRef.current.setSelected();
       }
@@ -310,6 +317,7 @@ const MemberDetail: React.FC<{}> = () => {
         list = publicarr.filter((element, index, self) => {
           return self.findIndex(x => x.menuId === element.menuId) === index
         })
+        console.log(actionRef.current.selected)
         const publicParams = {
           ...values,
           imFlag: !!values.imFlag,
@@ -317,21 +325,13 @@ const MemberDetail: React.FC<{}> = () => {
           auth: (flag && dataId.length === 0) ? [] : list.map(v => ({
             menuId: v.menuId,
             // @todo 暂时写死为空
-            buttonIds: [],
+            buttonIds: actionRef.current.selected,
             checked: v.checked,
             hasDataAuth: authInfos[v.menuId]?.hasDataAuth ? authInfos[v.menuId]?.hasDataAuth : 0,
             orgIds: authInfos[v.menuId]?.hasDataAuth ? authInfos[v.menuId]?.orgIds : [],
           }))
-          // auth: treeCheckIds.map(v => ({
-          //   menuId: v,
-          //   // @todo 暂时写死为空
-          //   buttonIds: [],
-          //   checked: true,
-          //   hasDataAuth: authInfos[v]?.hasDataAuth,
-          //   orgIds: authInfos[v]?.orgIds
-          // })),
+
         };
-        console.log(publicarr, 'publicarr', flag, 'flag', publicParams)
         delete publicParams.checkIds
         if (pageStatus === PageStatus.EDIT) {
           await postMemberRoleUpdate({
@@ -346,7 +346,7 @@ const MemberDetail: React.FC<{}> = () => {
         history.goBack(-1);
       })
       .catch(err => {
-        console.log(err);
+        // console.log(err);
         if (Array.isArray(err)) {
           setErrors(true);
         }
@@ -354,7 +354,7 @@ const MemberDetail: React.FC<{}> = () => {
   };
 
   const changeTabs = key => {
-    console.log(key)
+    // console.log(key)
     // if (key === '2' && id) {
     //   fetchRoleMenuDetail(id).then(res => {
     //     const { data } = res;
@@ -428,10 +428,10 @@ const MemberDetail: React.FC<{}> = () => {
         { orgIds: selectKeys },
       ),
     });
-    console.log(plateformTreeData, 'plateformTreeData');
-    console.log(selectKeys, 'selectKeys');
+    // console.log(plateformTreeData, 'plateformTreeData');
+    // console.log(selectKeys, 'selectKeys');
     let plateformTreeDataList = mapkey(plateformTreeData, selectKeys, [])
-    console.log(plateformTreeDataList)
+    // console.log(plateformTreeDataList)
     setplateformTreeList(plateformTreeDataList)
     // console.log(plateformTreeDataList, 'plateformTreeData')
     setOrgModalVisible(false);
@@ -517,6 +517,7 @@ const MemberDetail: React.FC<{}> = () => {
                   treeData={treeData}
                   handleSelect={handleNodeSelected}
                   checkStrictly={true}
+                  handleCheck={handleCheck}
                   customKey="id"
                   disabled={pageStatus === PageStatus.PREVIEW}
                 />
@@ -525,8 +526,9 @@ const MemberDetail: React.FC<{}> = () => {
               <Col span={7} className={styled['menu-role-tree']}>
                 <CheckboxTree
                   actions={actionRef}
-                  disabled={pageStatus === PageStatus.PREVIEW}
+                  disabled={!checkflag}
                   checkedNodes={buttonInfos}
+                  checkIds={checkIds}
                   title={intl.formatMessage({ id: 'authConfig.MenuInterfaceAccess' })}
                 />
               </Col>