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,85 +68,108 @@ const DepartmentPage = () => {
     const arr = [];
     for (let i = 0; i < departments[id].length; i++) {
       if (!departments[departments[id][i].id]) {
-        arr.push({
-          title: (
-            <>
-              <div className="tree-title-elli">{departments[id][i].name}</div>
-              <div className="d-flex">
-                <Tooltip placement="top" title="可拖拽排序">
-                  <i
-                    className="iconfont icon-icon-drag mr-16"
-                    style={{ fontSize: 24 }}
-                  />
-                </Tooltip>
-                {through("department-cud") && (
-                  <>
+        if (ldapEnabled) {
+          arr.push({
+            title: (
+              <>
+                <div className="tree-title-elli">{departments[id][i].name}</div>
+              </>
+            ),
+            key: departments[id][i].id,
+          });
+        } else {
+          arr.push({
+            title: (
+              <>
+                <div className="tree-title-elli">{departments[id][i].name}</div>
+                <div className="d-flex">
+                  <Tooltip placement="top" title="可拖拽排序">
                     <i
-                      className="iconfont icon-icon-edit mr-16"
+                      className="iconfont icon-icon-drag mr-16"
                       style={{ fontSize: 24 }}
-                      onClick={() => {
-                        setDid(departments[id][i].id);
-                        setUpdateVisible(true);
-                      }}
                     />
-                    <i
-                      className="iconfont icon-icon-delete"
-                      style={{ fontSize: 24 }}
-                      onClick={() =>
-                        removeItem(
-                          departments[id][i].id,
-                          departments[id][i].name
-                        )
-                      }
-                    />
-                  </>
-                )}
-              </div>
-            </>
-          ),
-          key: departments[id][i].id,
-        });
+                  </Tooltip>
+                  {through("department-cud") && (
+                    <>
+                      <i
+                        className="iconfont icon-icon-edit mr-16"
+                        style={{ fontSize: 24 }}
+                        onClick={() => {
+                          setDid(departments[id][i].id);
+                          setUpdateVisible(true);
+                        }}
+                      />
+                      <i
+                        className="iconfont icon-icon-delete"
+                        style={{ fontSize: 24 }}
+                        onClick={() =>
+                          removeItem(
+                            departments[id][i].id,
+                            departments[id][i].name
+                          )
+                        }
+                      />
+                    </>
+                  )}
+                </div>
+              </>
+            ),
+            key: departments[id][i].id,
+          });
+        }
       } else {
         const new_arr: Option[] = checkArr(departments, departments[id][i].id);
-        arr.push({
-          title: (
-            <>
-              <div className="tree-title-elli">{departments[id][i].name}</div>
-              <div className="d-flex">
-                <Tooltip placement="top" title="可拖拽排序">
-                  <i
-                    className="iconfont icon-icon-drag mr-16"
-                    style={{ fontSize: 24 }}
-                  />
-                </Tooltip>
-                {through("department-cud") && (
-                  <>
+        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: (
+              <>
+                <div className="tree-title-elli">{departments[id][i].name}</div>
+                <div className="d-flex">
+                  <Tooltip placement="top" title="可拖拽排序">
                     <i
-                      className="iconfont icon-icon-edit mr-16"
+                      className="iconfont icon-icon-drag mr-16"
                       style={{ fontSize: 24 }}
-                      onClick={() => {
-                        setDid(departments[id][i].id);
-                        setUpdateVisible(true);
-                      }}
                     />
-                    <i
-                      className="iconfont icon-icon-delete"
-                      style={{ fontSize: 24 }}
-                      onClick={() =>
-                        removeItem(
-                          departments[id][i].id,
-                          departments[id][i].name
-                        )
-                      }
-                    />
-                  </>
-                )}
-              </div>
-            </>
-          ),
-          key: departments[id][i].id,
-          children: new_arr,
-        });
+                  </Tooltip>
+                  {through("department-cud") && (
+                    <>
+                      <i
+                        className="iconfont icon-icon-edit mr-16"
+                        style={{ fontSize: 24 }}
+                        onClick={() => {
+                          setDid(departments[id][i].id);
+                          setUpdateVisible(true);
+                        }}
+                      />
+                      <i
+                        className="iconfont icon-icon-delete"
+                        style={{ fontSize: 24 }}
+                        onClick={() =>
+                          removeItem(
+                            departments[id][i].id,
+                            departments[id][i].name
+                          )
+                        }
+                      />
+                    </>
+                  )}
+                </div>
+              </>
+            ),
+            key: departments[id][i].id,
+            children: new_arr,
+          });
+        }
       }
     }
     return arr;
@@ -365,22 +391,29 @@ const DepartmentPage = () => {
 
   return (
     <>
-      <div className="playedu-main-top mb-24">
-        {contextHolder}
-        <div className="d-flex">
-          <PerButton
-            type="primary"
-            text="新建部门"
-            class="mr-16"
-            icon={<PlusOutlined />}
-            p="department-cud"
-            onClick={() => setCreateVisible(true)}
-            disabled={null}
-          />
+      {!ldapEnabled && (
+        <div className="playedu-main-top mb-24">
+          {contextHolder}
+          <div className="d-flex">
+            <PerButton
+              type="primary"
+              text="新建部门"
+              class="mr-16"
+              icon={<PlusOutlined />}
+              p="department-cud"
+              onClick={() => setCreateVisible(true)}
+              disabled={null}
+            />
+          </div>
         </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,19 +184,23 @@ const MemberPage = () => {
                 disabled={null}
               />
             </Link>
-            <div className="form-column"></div>
-            <Dropdown menu={{ items }}>
-              <Button
-                type="link"
-                className="b-link c-red"
-                onClick={(e) => e.preventDefault()}
-              >
-                <Space size="small" align="center">
-                  更多
-                  <DownOutlined />
-                </Space>
-              </Button>
-            </Dropdown>
+            {!ldapEnabled && (
+              <>
+                <div className="form-column"></div>
+                <Dropdown menu={{ items }}>
+                  <Button
+                    type="link"
+                    className="b-link c-red"
+                    onClick={(e) => e.preventDefault()}
+                  >
+                    <Space size="small" align="center">
+                      更多
+                      <DownOutlined />
+                    </Space>
+                  </Button>
+                </Dropdown>
+              </>
+            )}
           </Space>
         );
       },
@@ -297,16 +305,18 @@ const MemberPage = () => {
           </div>
           <div className="float-left j-b-flex mb-24">
             <div className="d-flex">
-              <PerButton
-                type="primary"
-                text="添加学员"
-                class="mr-16"
-                icon={<PlusOutlined />}
-                p="user-store"
-                onClick={() => setCreateVisible(true)}
-                disabled={null}
-              />
-              {dep_ids.length === 0 && (
+              {!ldapEnabled && (
+                <PerButton
+                  type="primary"
+                  text="添加学员"
+                  class="mr-16"
+                  icon={<PlusOutlined />}
+                  p="user-store"
+                  onClick={() => setCreateVisible(true)}
+                  disabled={null}
+                />
+              )}
+              {!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 } from "../../../api/index";
+import { appConfig, system } 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;