fix: '角色管理搭建平台操作权限全选，分类全选'

src/pages/userCenter/roleManage/SelectUser/OpePermissions.jsx

@@ -19,9 +19,7 @@ const CheckboxGroup = Checkbox.Group;
 
 const OpePermissions = props => {
   const { confirmModal, onCancel, visible, itemObj, roleID } = props;
-  const [checkedList, setCheckedList] = useState();
-  const [indeterminate, setIndeterminate] = useState(true);
-  const [checkAll, setCheckAll] = useState(false);
+  const [checkAll, setCheckAll] = useState({});
   const [loading, setLoading] = useState(false);
   const [option, setOption] = useState([]);
   const [groupList, setGroupList] = useState([]);
@@ -41,9 +39,11 @@ const OpePermissions = props => {
           setOption(res.data.dicPermissions);
           setGroupList(res.data.projectPermission);
           setKeepGroupList(res.data.projectPermission);
+          getAllData(res.data.projectPermission);
         } else {
           setOption([]);
           setGroupList([]);
+          getAllData({});
         }
       })
       .catch(err => {
@@ -51,6 +51,37 @@ const OpePermissions = props => {
       });
   };
 
+  const getAllData = val => {
+    let obj = { 预览: [], 编辑: [], 发布: [], 删除: [], 导出: [] };
+    val.map(i => {
+      if (i.permission.indexOf('预览') !== -1) {
+        obj.预览 = [...obj.预览, i.projectName];
+      }
+      if (i.permission.indexOf('编辑') !== -1) {
+        obj.编辑 = [...obj.编辑, i.projectName];
+      }
+      if (i.permission.indexOf('发布') !== -1) {
+        obj.发布 = [...obj.发布, i.projectName];
+      }
+      if (i.permission.indexOf('删除') !== -1) {
+        obj.删除 = [...obj.删除, i.projectName];
+      }
+      if (i.permission.indexOf('导出') !== -1) {
+        obj.导出 = [...obj.导出, i.projectName];
+      }
+    });
+    if (
+      obj.预览.length === val.length &&
+      obj.编辑.length === val.length &&
+      obj.发布.length === val.length &&
+      obj.删除.length === val.length &&
+      obj.导出.length === val.length
+    ) {
+      obj.全选 = true;
+    }
+    setCheckAll(obj);
+  };
+
   const onChange = (list, id) => {
     let newData = JSON.parse(JSON.stringify(groupList));
     let item = newData.find(i => i.projeectId === id);
@@ -58,7 +89,9 @@ const OpePermissions = props => {
     item.permission = list;
     newData[index] = item;
     setGroupList(newData);
+    getAllData(newData);
   };
+
   const onCheckAllChange = (e, id) => {
     let newData = JSON.parse(JSON.stringify(groupList));
     let item = newData.find(i => i.projeectId === id);
@@ -66,7 +99,61 @@ const OpePermissions = props => {
     item.permission = e.target.checked ? option : [];
     newData[index] = item;
     setGroupList(newData);
+    getAllData(newData);
   };
+
+  const onCheckAll = (e, val) => {
+    let newData = JSON.parse(JSON.stringify(groupList));
+    newData.map(i => {
+      if (e.target.checked) {
+        if (val === '预览') {
+          if (i.permission.indexOf('预览') === -1) {
+            i.permission.push('预览');
+          }
+        } else if (val === '编辑') {
+          if (i.permission.indexOf('编辑') === -1) {
+            i.permission.push('编辑');
+          }
+        } else if (val === '发布') {
+          if (i.permission.indexOf('发布') === -1) {
+            i.permission.push('发布');
+          }
+        } else if (val === '删除') {
+          if (i.permission.indexOf('删除') === -1) {
+            i.permission.push('删除');
+          }
+        } else if (val === '导出') {
+          if (i.permission.indexOf('导出') === -1) {
+            i.permission.push('导出');
+          }
+        }
+      } else {
+        if (val === '预览') {
+          i.permission = i.permission.filter(item => item !== '预览');
+        } else if (val === '编辑') {
+          i.permission = i.permission.filter(item => item !== '编辑');
+        } else if (val === '发布') {
+          i.permission = i.permission.filter(item => item !== '发布');
+        } else if (val === '删除') {
+          i.permission = i.permission.filter(item => item !== '删除');
+        } else if (val === '导出') {
+          i.permission = i.permission.filter(item => item !== '导出');
+        }
+      }
+    });
+    setGroupList(newData);
+    getAllData(newData);
+  };
+
+  const onAll = e => {
+    let newData = JSON.parse(JSON.stringify(groupList));
+    newData.map(i => {
+      i.permission = e.target.checked ? option : [];
+    });
+    setGroupList(newData);
+    getAllData(newData);
+  };
+
   // 提交勾选人员
   const onFinish = () => {
     let arrList = [];
@@ -77,7 +164,6 @@ const OpePermissions = props => {
       }
     });
     console.log(arrList);
-    debugger;
     let arr = [];
     if (arrList.length > 0) {
       arrList.forEach(item => {
@@ -110,7 +196,46 @@ const OpePermissions = props => {
   return (
     <>
       {/* 头部搜索框 */}
-      <div className={styles.headerLeft}>
+      <div className={styles.header}>
+        <div>
+          <Checkbox
+            style={{ marginRight: '20px' }}
+            checked={checkAll?.全选}
+            onChange={e => onAll(e)}
+          >
+            全选
+          </Checkbox>
+          <Checkbox
+            checked={checkAll?.预览?.length === groupList?.length}
+            onChange={e => onCheckAll(e, '预览')}
+          >
+            预览全选
+          </Checkbox>
+          <Checkbox
+            checked={checkAll?.编辑?.length === groupList?.length}
+            onChange={e => onCheckAll(e, '编辑')}
+          >
+            编辑全选
+          </Checkbox>
+          <Checkbox
+            checked={checkAll?.发布?.length === groupList?.length}
+            onChange={e => onCheckAll(e, '发布')}
+          >
+            发布全选
+          </Checkbox>
+          <Checkbox
+            checked={checkAll?.删除?.length === groupList?.length}
+            onChange={e => onCheckAll(e, '删除')}
+          >
+            删除全选
+          </Checkbox>
+          <Checkbox
+            checked={checkAll?.导出?.length === groupList?.length}
+            onChange={e => onCheckAll(e, '导出')}
+          >
+            导出全选
+          </Checkbox>
+        </div>
         <Button onClick={onFinish} type="primary" htmlType="submit">
           提交
         </Button>

src/pages/userCenter/roleManage/SelectUser/SelectUser.less

@@ -2,9 +2,11 @@
   display: flex;
   justify-content: space-between;
 }
-.headerLeft {
+.header {
   display: flex;
-  justify-content: flex-end;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 20px;
 }
 .pushTestContent {
   .ant-table-body {