[improvement][semantic-fe] Optimized the frontend display and code logic of visual modeling, and updated the relevant interface of the permission management module.

webapp/packages/supersonic-fe/src/components/SelectPartner/index.tsx

@@ -1,6 +1,6 @@
-import { Avatar, TreeSelect, Tag } from 'antd';
+import { TreeSelect, Tag } from 'antd';
 import React, { useEffect, useState } from 'react';
-import { getDepartmentTree, getUserByDeptid } from './service';
+import { getUserByDeptid, getOrganizationTree } from './service';
 import TMEAvatar from '@/components/TMEAvatar';
 
 type Props = {
@@ -11,6 +11,9 @@ type Props = {
 };
 
 const isDisableCheckbox = (name: string, type: string) => {
+  if (!name) {
+    return false;
+  }
   const isPersonNode = name.includes('(');
   if (type === 'selectedPerson') {
     return !isPersonNode;
@@ -25,18 +28,18 @@ const isDisableCheckbox = (name: string, type: string) => {
 };
 
 // 转化树结构
-export function changeTreeData(treeData: any = [], type: string) {
+export function changeTreeData(treeData: any = [], type: string, keyName = 'id') {
   return treeData.map((item: any) => {
     return {
       title: item.name,
-      value: item.key,
-      key: item.key,
-      isLeaf: !!item.emplid,
-      children: item?.subDepartments ? changeTreeData(item.subDepartments, type) : [],
-      disableCheckbox: isDisableCheckbox(item.name, type),
-      checkable: !isDisableCheckbox(item.name, type),
-      icon: item.name.includes('(') && (
-        <Avatar size={18} shape="square" src={`${item.avatarImg}`} alt="avatar" />
+      value: item[keyName],
+      key: item[keyName],
+      isLeaf: !item.subOrganizations,
+      children: item.subOrganizations ? changeTreeData(item.subOrganizations, type, keyName) : [],
+      disableCheckbox: isDisableCheckbox(item.displayName, type),
+      checkable: !isDisableCheckbox(item.displayName, type),
+      icon: (item.displayName || '').includes('(') && (
+        <TMEAvatar size="small" staffName={item.name} />
       ),
     };
   });
@@ -51,9 +54,12 @@ const SelectPartner: React.FC<Props> = ({
   const [treeData, setTreeData] = useState([]);
 
   const getDetpartment = async () => {
-    const res = await getDepartmentTree();
-    const data = changeTreeData(res.data, type);
-    setTreeData(data);
+    const { code, data } = await getOrganizationTree();
+    if (code === 200) {
+      const changeData = changeTreeData(data, type);
+      setTreeData(changeData);
+      return;
+    }
   };
 
   useEffect(() => {
@@ -78,13 +84,21 @@ const SelectPartner: React.FC<Props> = ({
   const onLoadData = (target: any) => {
     const { key } = target;
     const loadData = async () => {
-      const childData = await getUserByDeptid(key);
-      if (childData.data.length === 0) {
-        return;
+      const { code, data } = await getUserByDeptid(key);
+      if (code === 200) {
+        const list = data.reduce((userList: any[], item: any) => {
+          const { name, displayName } = item;
+          if (name && displayName) {
+            userList.push({ key: `${key}-${item.id}`, ...item });
+          }
+          return userList;
+        }, []);
+        setTimeout(() => {
+          setTreeData((origin) => {
+            return updateTreeData(origin, key, changeTreeData(list, type, 'key'));
+          });
+        }, 300);
       }
-      setTimeout(() => {
-        setTreeData((origin) => updateTreeData(origin, key, changeTreeData(childData.data, type)));
-      }, 300);
     };
     return new Promise<void>((resolve) => {
       loadData().then(() => {