管理人员页面重构

src/compenents/index.ts

@@ -6,6 +6,7 @@ export * from "./tree-department";
 export * from "./back-bar";
 export * from "./permission-button";
 export * from "./tree-category";
+export * from ".//tree-adminroles";
 export * from "./duration-text";
 export * from "./upload-video-sub";
 export * from "./select-resource";

src/compenents/left-menu/index.tsx

@@ -62,7 +62,7 @@ const items = [
     [
       getItem("系统配置", "/system/config/index", null, null, null),
       getItem("管理人员", "/system/administrator", null, null, null),
-      getItem("角色配置", "/system/adminroles", null, null, null),
+      // getItem("角色配置", "/system/adminroles", null, null, null),
     ],
     null
   ),

src/compenents/tree-adminroles/index.tsx

@@ -1,3 +1,71 @@
 import { Tree } from "antd";
 import { useState, useEffect } from "react";
-import { adminRole } from "../../api/index";
+import { adminRole } from "../../api/index";
+
+interface Option {
+  key: string | number;
+  title: any;
+  children: any[];
+}
+
+interface PropInterface {
+  type: string;
+  text: string;
+  onUpdate: (keys: any, title: any) => void;
+}
+
+export const TreeAdminroles = (props: PropInterface) => {
+  const [treeData, setTreeData] = useState<any>([]);
+  const [loading, setLoading] = useState<boolean>(true);
+  const [selectKey, setSelectKey] = useState<any>([]);
+
+  useEffect(() => {
+    adminRole.adminRoleList().then((res: any) => {
+      let adminrole = res.data;
+      if (adminrole.length > 0) {
+        const new_arr: Option[] = [];
+        for (let i = 0; i < adminrole.length; i++) {
+          new_arr.push({
+            title: adminrole[i].name,
+            key: adminrole[i].id,
+            children: [],
+          });
+        }
+        setTreeData(new_arr);
+      }
+    });
+  }, []);
+  const onSelect = (selectedKeys: any, info: any) => {
+    let label = "全部" + props.text;
+    if (info) {
+      label = info.node.title;
+    }
+    props.onUpdate(selectedKeys, label);
+    setSelectKey(selectedKeys);
+  };
+
+  return (
+    <div>
+      <div
+        className={
+          selectKey.length === 0
+            ? "mb-8 category-label active"
+            : "mb-8 category-label"
+        }
+        onClick={() => {
+          onSelect([], "");
+        }}
+      >
+        <div className="j-b-flex">
+          <span>全部{props.text}</span>
+        </div>
+      </div>
+      <Tree
+        onSelect={onSelect}
+        selectedKeys={selectKey}
+        treeData={treeData}
+        switcherIcon={<i className="iconfont icon-icon-fold c-gray" />}
+      />
+    </div>
+  );
+};