fix: '解决角色管理复选框bug'

src/components/CheckGroup/ItemCard.jsx

+/* eslint-disable no-unused-expressions */
 /* eslint-disable import/order */
 import React, { useState, useEffect } from 'react';
 import { Checkbox } from 'antd';
@@ -7,7 +8,7 @@ import { checkChildrenByCondition, checkIsGroup, getId } from '.';
 import { FolderFilled, FileOutlined } from '@ant-design/icons';
 
 const ListCardItem = props => {
-  const { searchWord, item, valueList, updateValueList, ouid, changedItem, flag } = props;
+  const { searchWord, item, valueList, updateValueList, ouid, changedItem, flag, roleID } = props;
 
   // id
   const id = getId(item);
@@ -17,13 +18,11 @@ const ListCardItem = props => {
   // 当前组件是否是分组id
   const isGroup = checkIsGroup(item);
   const [indeterminate, setIndeterminate] = useState(isGroup);
-  const [childrenKeys, setChildrenKeys] = useState([]);
+  const [childrenKeys, setChildrenKeys] = useState([]); // 本次循环item的全部子元素id
+  const [flag1, setFlag1] = useState(); // 首次进入刷新回显
 
   useEffect(() => {
-    console.log(valueList);
-    console.log(changedItem); // 改变项
-    console.log(item); // 本次进循环的项
-    // console.log(childrenKeys); // 本次循环item的全部子元素id
+    setFlag1(roleID);
     // 子节点勾选状态变化时
     if (isGroup) {
       const keys = item.children
@@ -31,40 +30,72 @@ const ListCardItem = props => {
         .flat(Infinity);
       setChildrenKeys(keys);
     }
+    if (checkIsGroup(changedItem.item)) {
+      // 菜单组当前项，完整一次循环当前项不变
+      if (isGroup) {
+        if (childrenKeys.every(c => valueList.includes(c))) {
+          // 全选
+          updateValueList([id], [id], { item, value: true });
+          setIndeterminate(false);
+        } else if (childrenKeys.some(c => valueList.includes(c))) {
+          // 半选
+          valueList.includes(id) && updateValueList([], [id], { item, value: true });
+          setIndeterminate(true);
+        } else {
+          // 零选
+          valueList.includes(id) && updateValueList([], [id], { item, value: true });
+          setIndeterminate(false);
+        }
+      }
+    } else {
+      // eslint-disable-next-line no-lonely-if
       if (
-      isGroup
+        isGroup &&
         // changedItem.item !== item &&
         // !checkIsGroup(changedItem.item) &&
-      // childrenKeys.includes(getId(changedItem.item))
+        childrenKeys.includes(getId(changedItem.item)) // 判断本次item是否是改变的本次的子选项用来父级回显,全选时要取消这一限制条件
       ) {
-      // console.log(childrenKeys.every(c => valueList.includes(c)));
-      console.log(item);
-      console.log(childrenKeys);
         if (childrenKeys.every(c => valueList.includes(c))) {
           // 全选
-        console.log(2121);
           updateValueList([id], [id], { item, value: true });
-        console.log(valueList);
           setIndeterminate(false);
         } else if (childrenKeys.some(c => valueList.includes(c))) {
-        console.log(211231);
-        console.log(valueList);
-        console.log(id);
           // 半选
-        // eslint-disable-next-line no-unused-expressions
           valueList.includes(id) && updateValueList([], [id], { item, value: false });
           setIndeterminate(true);
         } else {
           // 零选
-        console.log(232323);
-        console.log(valueList);
-        console.log(id);
-        // eslint-disable-next-line no-unused-expressions
           valueList.includes(id) && updateValueList([], [id], { item, value: false });
           setIndeterminate(false);
         }
       }
-  }, [changedItem.item, changedItem.value, flag]);
+    }
+  }, [changedItem.item, changedItem.value]);
+
+  useEffect(() => {
+    // 子节点勾选状态变化时
+    if (isGroup) {
+      const keys = item.children
+        .map(child => checkChildrenByCondition(child, c => getId(c), true, 'map'))
+        .flat(Infinity);
+      setChildrenKeys(keys);
+    }
+    if (isGroup) {
+      if (childrenKeys.every(c => valueList.includes(c))) {
+        // 全选
+        updateValueList([id], [id], { item, value: true });
+        setIndeterminate(false);
+      } else if (childrenKeys.some(c => valueList.includes(c))) {
+        // 半选
+        valueList.includes(id) && updateValueList([], [id], { item, value: false });
+        setIndeterminate(true);
+      } else {
+        // 零选
+        valueList.includes(id) && updateValueList([], [id], { item, value: false });
+        setIndeterminate(false);
+      }
+    }
+  }, [flag, flag1]); // 全选刷新，首次进入刷新标识
 
   // 勾选事件处理
   const handleChecked = e => {
@@ -74,8 +105,6 @@ const ListCardItem = props => {
       updateValueList(v ? result : [], result, { item, value: v });
       setIndeterminate(false);
     } else {
-      // console.log(item);
-      // console.log(v);
       updateValueList(v ? [id] : [], [id], { item, value: v });
     }
   };
@@ -89,6 +118,7 @@ const ListCardItem = props => {
         updateValueList={updateValueList}
         valueList={valueList}
         ouid={ouid}
+        roleID={roleID}
         changedItem={changedItem}
         searchWord={searchWord}
         flag={flag}
@@ -97,7 +127,6 @@ const ListCardItem = props => {
   // 通过把isChecked为true的id存在valueList集合里面，递归数据当id是否被包含在valueList中时返回值来渲染true或false
   return (
     <>
-      {/* {console.log(valueList, 'valueList')} */}
       <div
         className={classnames({
           [styles.divBox]: isGroup,

src/components/CheckGroup/index.jsx

@@ -4,6 +4,7 @@ import { Spin, Checkbox, Button, Empty } from 'antd';
 import _ from 'lodash';
 import ListCardItem from './ItemCard';
 import styles from './ItemCard.less';
+import { GetMapSetByGroupID } from '@/services/userManage/api';
 
 const tip = 'loading...';
 
@@ -23,7 +24,6 @@ export const checkChildrenByCondition = (item, fn, withGroup = true, method = 'e
 };
 
 const ListCard = props => {
-  console.log(props, 'props');
   const {
     ouid,
     searchWord,
@@ -33,6 +33,7 @@ const ListCard = props => {
     checkList,
     btnLoading = false,
     loading,
+    roleID,
   } = props;
   const [valueList, setValueList] = useState([]); // 选中值
   const [changedItem, setChangedItem] = useState({ item: {} }); // 改变的项
@@ -43,7 +44,6 @@ const ListCard = props => {
 
   // 首次进入处理数据后续不触发
   useEffect(() => {
-    console.log(dataList);
     let aa = dataList
       .map(l => checkChildrenByCondition(l, it => [getId(it)], true, 'map').flat(Infinity))
       .flat(Infinity)
@@ -63,16 +63,11 @@ const ListCard = props => {
   }, [dataList, loading, checkList]);
 
   // 处理选中的值
-  const updateValueList = (checkedKeys, childrenKeys, sourceItem) => {
-    // console.log(checkedKeys);
-    // console.log(childrenKeys);
-    console.log(sourceItem);
-    console.log(changedItem);
+  const updateValueList = (checkedKeys, childrenKeys, sourceItem, aa) => {
     const removekeys = _.difference(childrenKeys, checkedKeys);
     let result = _.uniq(_.union(checkedKeys, valueList));
     _.remove(result, v => removekeys.includes(v));
     setValueList(result);
-    console.log(result);
     setChangedItem(sourceItem);
     onChange && onChange(result);
     if (result.length === 0) {
@@ -157,6 +152,7 @@ const ListCard = props => {
                   item={item}
                   ouid={ouid}
                   flag={flag}
+                  roleID={roleID}
                   changedItem={changedItem}
                   updateValueList={updateValueList}
                   valueList={valueList}

src/pages/userCenter/roleManage/AddModal.jsx

@@ -242,8 +242,8 @@ const AddModal = props => {
           name="BuiltInRole"
         >
           <Radio.Group onChange={onChangeRadio} value={value} defaultValue={value}>
-            <Radio value={1}>是</Radio>
             <Radio value={2}>否</Radio>
+            <Radio value={1}>是</Radio>
           </Radio.Group>
         </Item>
         <Item label="角色分组" name="group">

src/pages/userCenter/roleManage/EditModal.jsx

@@ -164,8 +164,8 @@ const AddModal = props => {
         >
           {console.log(value, 'nalie')}
           <Radio.Group onChange={onChangeRadio} value={value}>
-            <Radio value={1}>是</Radio>
             <Radio value={2}>否</Radio>
+            <Radio value={1}>是</Radio>
           </Radio.Group>
         </Item>
         <Item label="角色分组" name="group">

src/pages/userCenter/roleManage/RoleManage.jsx

@@ -188,6 +188,14 @@ const SiteManage = () => {
             list.push({ ...defaultConfig, ...item });
           });
         const finalList = buildMap(list);
+        // if (finalList[0].text == '地图组件') {
+        //   if (finalList[0].children.find(i => i.isChecked == false)) {
+        //     finalList[0].isChecked = false;
+        //   } else {
+        //     finalList[0].isChecked = true;
+        //   }
+        // }
+        // console.log(finalList);
         setdataList(finalList);
         setValueList(
           finalList
@@ -549,7 +557,7 @@ const SiteManage = () => {
           notification.error({
             message: '提示',
             duration: 15,
-            description: res.message,
+            description: res.msg,
           });
         }
       })
@@ -837,6 +845,7 @@ const SiteManage = () => {
           >
             {roleID ? (
               <ListCard
+                roleID={roleID}
                 loading={loading}
                 checkList={valueList}
                 dataList={dataList}