ldap开关联动部门、学员的新建、编辑、删除、排序、导入

src/pages/department/index.tsx

@@ -32,6 +32,9 @@ const DepartmentPage = () => {
   const [updateVisible, setUpdateVisible] = useState(false);
   const [did, setDid] = useState<number>(0);
   const [modal, contextHolder] = Modal.useModal();
+  const ldapEnabled = useSelector(
+    (state: any) => state.systemConfig.value["ldap-enabled"]
+  );
 
   const onSelect = (selectedKeys: any, info: any) => {
     setSelectKey(selectedKeys);
@@ -45,11 +48,11 @@ const DepartmentPage = () => {
   };
 
   useEffect(() => {
+    setLoading(true);
     getData();
   }, [refresh, permissions]);
 
   const getData = () => {
-    setLoading(true);
     department.departmentList().then((res: any) => {
       const departments: DepartmentsBoxModel = res.data.departments;
       if (JSON.stringify(departments) !== "{}") {
@@ -65,6 +68,16 @@ const DepartmentPage = () => {
     const arr = [];
     for (let i = 0; i < departments[id].length; i++) {
       if (!departments[departments[id][i].id]) {
+        if (ldapEnabled) {
+          arr.push({
+            title: (
+              <>
+                <div className="tree-title-elli">{departments[id][i].name}</div>
+              </>
+            ),
+            key: departments[id][i].id,
+          });
+        } else {
           arr.push({
             title: (
               <>
@@ -103,8 +116,20 @@ const DepartmentPage = () => {
             ),
             key: departments[id][i].id,
           });
+        }
       } else {
         const new_arr: Option[] = checkArr(departments, departments[id][i].id);
+        if (ldapEnabled) {
+          arr.push({
+            title: (
+              <>
+                <div className="tree-title-elli">{departments[id][i].name}</div>
+              </>
+            ),
+            key: departments[id][i].id,
+            children: new_arr,
+          });
+        } else {
           arr.push({
             title: (
               <>
@@ -146,6 +171,7 @@ const DepartmentPage = () => {
           });
         }
       }
+    }
     return arr;
   };
 
@@ -365,6 +391,7 @@ const DepartmentPage = () => {
 
   return (
     <>
+      {!ldapEnabled && (
         <div className="playedu-main-top mb-24">
           {contextHolder}
           <div className="d-flex">
@@ -379,8 +406,14 @@ const DepartmentPage = () => {
             />
           </div>
         </div>
+      )}
       <div className="playedu-main-body">
-        <div style={{ width: 366 }}>
+        {loading && (
+          <div className="float-left text-center mt-30">
+            <Spin></Spin>
+          </div>
+        )}
+        <div style={{ display: loading ? "none" : "block", width: 366 }}>
           {treeData.length > 0 && (
             <Tree
               onSelect={onSelect}

src/pages/init/index.tsx

@@ -19,6 +19,7 @@ const InitPage = (props: Props) => {
 
   if (props.configData) {
     let config: SystemConfigStoreInterface = {
+      "ldap-enabled": props.configData["ldap-enabled"],
       systemName: props.configData["system.name"],
       systemLogo: props.configData["system.logo"],
       systemApiUrl: props.configData["system.api_url"],

src/pages/login/index.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState } from "react";
 import styles from "./index.module.less";
 import { Input, Button, message } from "antd";
 import { login as loginApi, system } from "../../api/index";
@@ -59,6 +59,7 @@ const LoginPage = () => {
   const getSystemConfig = async () => {
     let res: any = await system.getSystemConfig();
     let data: SystemConfigStoreInterface = {
+      "ldap-enabled": res.data["ldap-enabled"],
       systemName: res.data["system.name"],
       systemLogo: res.data["system.logo"],
       systemApiUrl: res.data["system.api_url"],

src/pages/member/index.tsx

@@ -21,6 +21,7 @@ import {
 import { user } from "../../api/index";
 import { dateFormat } from "../../utils/index";
 import { Link, Navigate, useLocation } from "react-router-dom";
+import { useSelector } from "react-redux";
 import { TreeDepartment, PerButton } from "../../compenents";
 import { MemberCreate } from "./compenents/create";
 import { MemberUpdate } from "./compenents/update";
@@ -66,6 +67,9 @@ const MemberPage = () => {
   const [user_dep_ids, setUserDepIds] = useState<DepIdsModel>({});
   const [departments, setDepartments] = useState<DepartmentsModel>({});
   const [did, setDid] = useState(Number(result.get("did")));
+  const ldapEnabled = useSelector(
+    (state: any) => state.systemConfig.value["ldap-enabled"]
+  );
 
   useEffect(() => {
     setDid(Number(result.get("did")));
@@ -180,6 +184,8 @@ const MemberPage = () => {
                 disabled={null}
               />
             </Link>
+            {!ldapEnabled && (
+              <>
                 <div className="form-column"></div>
                 <Dropdown menu={{ items }}>
                   <Button
@@ -193,6 +199,8 @@ const MemberPage = () => {
                     </Space>
                   </Button>
                 </Dropdown>
+              </>
+            )}
           </Space>
         );
       },
@@ -297,6 +305,7 @@ const MemberPage = () => {
           </div>
           <div className="float-left j-b-flex mb-24">
             <div className="d-flex">
+              {!ldapEnabled && (
                 <PerButton
                   type="primary"
                   text="添加学员"
@@ -306,7 +315,8 @@ const MemberPage = () => {
                   onClick={() => setCreateVisible(true)}
                   disabled={null}
                 />
-              {dep_ids.length === 0 && (
+              )}
+              {!ldapEnabled && dep_ids.length === 0 && (
                 <Link style={{ textDecoration: "none" }} to={`/member/import`}>
                   <PerButton
                     type="default"

src/pages/resource/resource-category/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from "react";
-import { Button, Tree, Modal, message, Tooltip } from "antd";
+import { Button, Tree, Modal, message, Tooltip, Spin } from "antd";
 // import styles from "./index.module.less";
 import { PlusOutlined, ExclamationCircleFilled } from "@ant-design/icons";
 import { resourceCategory } from "../../../api/index";
@@ -24,6 +24,7 @@ const ResourceCategoryPage = () => {
     (state: any) => state.loginUser.value.permissions
   );
   const [loading, setLoading] = useState<boolean>(true);
+  const [init, setInit] = useState(true);
   const [refresh, setRefresh] = useState(false);
   const [treeData, setTreeData] = useState<Option[]>([]);
   const [selectKey, setSelectKey] = useState<number[]>([]);
@@ -33,6 +34,7 @@ const ResourceCategoryPage = () => {
   const [modal, contextHolder] = Modal.useModal();
 
   useEffect(() => {
+    setInit(true);
     getData();
   }, [refresh, permissions]);
 
@@ -56,6 +58,7 @@ const ResourceCategoryPage = () => {
         setTreeData(new_arr);
       }
       setLoading(false);
+      setInit(false);
     });
   };
 
@@ -390,7 +393,12 @@ const ResourceCategoryPage = () => {
         </div>
       </div>
       <div className="playedu-main-body">
-        <div style={{ width: 366 }}>
+        {init && (
+          <div className="float-left text-center mt-30">
+            <Spin></Spin>
+          </div>
+        )}
+        <div style={{ display: init ? "none" : "block", width: 366 }}>
           {treeData.length > 0 && (
             <Tree
               onSelect={onSelect}

src/pages/system/config/index.tsx

@@ -12,13 +12,18 @@ import {
   Slider,
   Space,
 } from "antd";
-// import styles from "./index.module.less";
+import { appConfig, system } from "../../../api/index";
-import { appConfig } from "../../../api/index";
 import { UploadImageButton } from "../../../compenents";
+import { useDispatch } from "react-redux";
 import type { TabsProps } from "antd";
 import type { CheckboxChangeEvent } from "antd/es/checkbox";
+import {
+  SystemConfigStoreInterface,
+  saveConfigAction,
+} from "../../../store/system/systemConfigSlice";
 
 const SystemConfigPage = () => {
+  const dispatch = useDispatch();
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(false);
   const [logo, setLogo] = useState("");
@@ -239,6 +244,23 @@ const SystemConfigPage = () => {
       message.success("保存成功！");
       setLoading(false);
       getDetail();
+      getSystemConfig();
+    });
+  };
+
+  const getSystemConfig = async () => {
+    system.getSystemConfig().then((res: any) => {
+      let data: SystemConfigStoreInterface = {
+        "ldap-enabled": res.data["ldap-enabled"],
+        systemName: res.data["system.name"],
+        systemLogo: res.data["system.logo"],
+        systemApiUrl: res.data["system.api_url"],
+        systemPcUrl: res.data["system.pc_url"],
+        systemH5Url: res.data["system.h5_url"],
+        memberDefaultAvatar: res.data["member.default_avatar"],
+        courseDefaultThumbs: res.data["default.course_thumbs"],
+      };
+      dispatch(saveConfigAction(data));
     });
   };
 

src/store/system/systemConfigSlice.ts

@@ -1,6 +1,7 @@
 import { createSlice } from "@reduxjs/toolkit";
 
 type SystemConfigStoreInterface = {
+  "ldap-enabled"?: boolean;
   systemApiUrl?: string;
   systemPcUrl?: string;
   systemH5Url?: string;