选择用户,性能优化

src/components/DesignForm/public/expand/rangedUserTree.vue

@@ -9,75 +9,54 @@ const props = withDefaults(
     defineProps<{
         modelValue?: string
         disabled?: boolean
+        orgAndManTree?: any;
     }>(),
     {}
 )
+
+
+
 interface User {
-    id: number
+  id: number
-    name: string
+  name: string
-    number: string
+  number: string
-    key: string
+  key: string
-    icon: string
+  icon: string
-    department: string
+  department: string
-    role: string
+  role: string
+  label: string
+  value: string
 }
 const emits = defineEmits<{
     (e: 'update:modelValue', value: string): void
 }>()
-const userDialogEl = ref()
-
-
 
-const loading = ref(true)
 const value = ref([])
-
+const loading = ref(true)
-
+watch(value,(newValue)=>{
-
+	if(newValue.length > 0){
-watch(value, (newValue) => {
+		let str = ""
-
+		
-    const checkReady = () => {
+		let userAry = new Array
-
+		
-        if (loading.value == false) {
+		newValue.forEach(item =>{
-            if (newValue.length > 0) {
+			//console.log(item)
-                let str = ""
+			userAry.push(item)
-
+			
-                let userAry = new Array
+		})
-
+		str = userAry.join(',')
-
+		//console.log(str)
-                newValue.forEach(item => {
+		emits('update:modelValue', str)
-
+		// userlist.value = userAry.join(',')
-                    userAry.push(item)
+		// 
-
+	}else{
-                })
+		let str = ""
-
+		//console.log(str)
-                str = userAry.join(',')
+		emits('update:modelValue', str)
-                //console.log(str)
+	}
-                emits('update:modelValue', str)
+},{ deep: true })
-
+
-            } else {
+function parseStringToArray(str:string) {
-                let str = ""
-
-                emits('update:modelValue', str)
-            }
-        } else {
-            // 未就绪，100ms 后重试（非阻塞）
-            setTimeout(checkReady, 100)
-        }
-
-    }
-
-    // 启动检查
-    checkReady()
-}, { deep: true })
-
-
-
-const openDialog = () => {
-    // console.log("value-----》",value.value)
-    userDialogEl.value.open()
-}
-
-function parseStringToArray(str: string) {
     try {
         // 尝试解析JSON格式字符串
         const result = JSON.parse(str);
@@ -94,127 +73,144 @@ function parseStringToArray(str: string) {
     }
 }
 onBeforeMount(() => {
-    getManConts()
+    // 启动检查
-    getTree()
+    //checkReady()
-    setTimeout(() => {
+	
-        value.value = parseStringToArray(props.modelValue)
+	//getTree()
-    }, 700)
+	setTimeout(()=>{
+		value.value = parseStringToArray(props.modelValue)
+	},500 )
 })
+
 const url = "/javasys/lowCode/manCont/getManContsByKeys"
 //console.log(attrs.value)
-const keys = computed(() => {
+const keys = computed(()=>{
-    if (attrs.queryBy == 'role') {
+	if(attrs.queryBy == 'role'){
-        return attrs.roleRange
+		return attrs.roleRange
-    } else {
+	}else{
-        return attrs.orgRange
+		return attrs.orgRange
-    }
+	}
 })
-function getManContsByKeys() {
-    //console.log(11111)
-
-    return request({
-        url: url,
-        method: "post",
-        data: {
-            keys: keys.value,
-        },
-    });
 
-}
 const options = ref([])
-
+const convertToAFormatComplate = ref(false)
-function getManConts() {
+function convertToAFormat(bTree, idArray) {
-    getManContsByKeys().then(({ data }) => {
+    const nodeMap = {};
-        data.forEach((element: any) => {
+
-            element.icon = element.name + "(" + element.number + ")"
+    // 递归收集节点，增加详细日志
-            element.deparment = "[" + element.deparment + "] - " + element.icon
+    function collectNodes(node, level = 0) {
-            element.label = element.deparment
+        if (!node) {
-            element.value = element.icon
+            //console.log(`跳过无效节点: ${node}`);
-        });
+            return;
-        options.value = data
-        //console.log(options.value)
-
-    })
-}
-
-
-const treeUrl = '/javasys/lowCode/transfer/getOrgAndManTree'
-function getOrgAndManTree() {
-    return request({
-        url: treeUrl,
-        method: 'post',
-    });
-}
-
-function processTreeData(node: any) {
-
-    // 检查节点及其所有子孙节点中是否存在id长度大于4的节点
-    function hasLongIdNode(node: { id: string | any[]; children: string | any[]; }) {
-        // 检查当前节点id长度
-        if (node.id && node.id.length > 4) {
-            return true;
         }
-
+        // 记录当前节点信息（方便调试）
-        // 处理子节点（考虑children为null的情况）
+        //console.log(`收集节点 [层级${level}]: id=${node.id}, label=${node.label}`);
-        if (node.children && Array.isArray(node.children) && node.children.length > 0) {
+        // 必须有id才存入映射表（避免非节点元素）
-            for (const child of node.children) {
+        if (node.id !== undefined && node.id !== null) {
-                if (hasLongIdNode(child)) {
+            nodeMap[node.id] = node;
-                    return true;
+        } else {
-                }
+            //console.warn(`节点缺少id，跳过:`, node);
-            }
         }
+        // 处理子节点（确保是数组，且元素有效）
+        if (Array.isArray(node.children)) {
+            node.children.forEach((child, index) => {
+                collectNodes(child, level + 1); // 层级+1，方便查看嵌套关系
+            });
+        } else if (node.children !== null && node.children !== undefined) {
+            //console.warn(`节点children不是数组，跳过:`, node.children);
+        }
+    }
 
-        return false;
+    // 处理根节点（兼容数组或单个对象）
+    if (Array.isArray(bTree)) {
+        //console.log(`bTree是数组，共${bTree.length}个根节点`);
+        bTree.forEach((root, index) => {
+            //console.log(`处理根节点${index + 1}`);
+            collectNodes(root);
+        });
+    } else {
+        //console.log(`bTree是单个根节点`);
+        collectNodes(bTree);
     }
 
-    // 递归处理节点
+    // 打印收集到的所有节点id（关键调试信息）
-    function processNode(node: any) {
+    //console.log(`收集到的节点id列表:`, Object.keys(nodeMap));
-        // 如果当前节点及其所有子孙都没有长id，则移除该节点
+
-        if (!hasLongIdNode(node)) {
+    // 匹配idArray并转换
-            return null;
+    const result = idArray.map(id => {
-        }
+        // 打印当前匹配的id，检查是否在nodeMap中
+        //console.log(`匹配id: ${id}，是否存在: ${id in nodeMap}`);
+        const targetNode = nodeMap[id];
+        if (!targetNode) return null;
+
+        return {
+            id: targetNode.id,
+            number: targetNode.value ?? '', // 用空字符串替代null/undefined
+            name: targetNode.label ?? '',
+            icon: null,
+            key: String(targetNode.id), // 确保key是字符串（与a格式一致）
+            role: '',
+            deparment: '',
+            parentId: targetNode.parentId ?? ''
+        };
+    }).filter(Boolean);
+
+    //console.log(`最终转换结果:`, result);
+    convertToAFormatComplate.value = true
+    return result;
+}
 
-        // 复制节点避免修改原对象
+function getManConts(){
-        const newNode = { ...node };
 
-        // 处理子节点
-        if (newNode.children && Array.isArray(newNode.children) && newNode.children.length > 0) {
-            // 递归处理每个子节点并过滤掉需要移除的
-            newNode.children = newNode.children
-                .map((child: any) => processNode(child))
-                .filter((child: null) => child !== null);
 
-            // 如果所有子节点都被移除，保持children为null
+    let data = convertToAFormat(props.orgAndManTree,keys.value)
-            if (newNode.children.length === 0) {
+    data.forEach((element: any) => {
-                newNode.children = null;
+			element.icon = element.name+"("+element.number+")"
-            }
+			element.deparment = ""+element.deparment+">"+element.icon
-        }
+			element.label = element.deparment
+			element.value = element.icon
+		});
+		options.value = data
 
-        return newNode;
-    }
 
-    return processNode(node);
 }
-let resData = ref([])
-
-const userList = computed({
 
-    get() {
+/**
+@ 作者: 秦东
+@ 时间: 2025-06-10 11:13:06
+@ 功能: 输出结果
+*/
+const valPrint = (val:any) => {
+	
+		if(Array.isArray(val)){
+			return val.join("、")
+		}
+	
+}
 
 
-        return [{
-            id: '全选',
-            label: '全选',
-            children: [...resData.value]
-        }]
 
+const resData = computed(()=>{
+    if(props.orgAndManTree){
+                        let data1 = processTreeData(props.orgAndManTree)
+                //console.log(data1)
+                getManConts()
+                
+                let data2 = filterTreeByList(data1.children, options.value)
 
+                data1.children = data2
 
-    },
-    set() {
 
+                
+                loading.value = false
+                return enrichTreeWithEmployeeInfo(options.value, data2)
+    }else{
+        return []
     }
+
+
 })
+
 /**
  * 根据列表数据过滤树形数据，保留value值在列表number中匹配的节点及其祖先
  * @param {Array} treeData - 树形数据
@@ -334,39 +330,55 @@ function enrichTreeWithEmployeeInfo(employees: any[], treeData: string | any[])
     return treeData;
 }
 
-function getTree() {
+function processTreeData(node: any) {
-    getOrgAndManTree().then(({ data }) => {
-
-
-        let data1 = processTreeData(data)
-        //console.log(data1)
-        let data2 = filterTreeByList(data1.children, options.value)
-
-        //console.log(data2)
-        data1.children = data2
-
-        //console.log(resData.value)
-        //console.log(`获取穿梭框接口数据`);
-        resData.value = data1.children
-        userList.value = [{
-            id: '全选',
-            label: '全选',
-            children: [...resData.value]
-        }]
-
-        enrichTreeWithEmployeeInfo(options.value, userList.value)
-        loading.value = false
 
-    })
+    // 检查节点及其所有子孙节点中是否存在id长度大于4的节点
-}
+    function hasLongIdNode(node: { id: string | any[]; children: string | any[]; }) {
+        // 检查当前节点id长度
+        if (node.id && node.id.length > 4) {
+            return true;
+        }
 
+        // 处理子节点（考虑children为null的情况）
+        if (node.children && Array.isArray(node.children) && node.children.length > 0) {
+            for (const child of node.children) {
+                if (hasLongIdNode(child)) {
+                    return true;
+                }
+            }
+        }
 
+        return false;
+    }
 
+    // 递归处理节点
+    function processNode(node: any) {
+        // 如果当前节点及其所有子孙都没有长id，则移除该节点
+        if (!hasLongIdNode(node)) {
+            return null;
+        }
 
+        // 复制节点避免修改原对象
+        const newNode = { ...node };
 
+        // 处理子节点
+        if (newNode.children && Array.isArray(newNode.children) && newNode.children.length > 0) {
+            // 递归处理每个子节点并过滤掉需要移除的
+            newNode.children = newNode.children
+                .map((child: any) => processNode(child))
+                .filter((child: null) => child !== null);
 
+            // 如果所有子节点都被移除，保持children为null
+            if (newNode.children.length === 0) {
+                newNode.children = null;
+            }
+        }
 
+        return newNode;
+    }
 
+    return processNode(node);
+}
 
 
 </script>
@@ -374,7 +386,7 @@ function getTree() {
 
 
     <div style="width:100%">
-        <el-tree-select node-key="number" v-model="value" :data="userList" multiple :render-after-expand="false"
+        <el-tree-select node-key="number" v-model="value" :data="resData" multiple :render-after-expand="false"
             show-checkbox clearable collapse-tags collapse-tags-tooltip :max-collapse-tags="4" filterable />
     </div>
 </template>

src/components/DesignForm/public/form/childTable.vue

@@ -19,6 +19,7 @@ import { SCOPE } from "element-plus";
 const props = withDefaults(
   defineProps<{
     data: any;
+    orgAndManTree?: any;
   }>(),
   {
     data: () => {
@@ -351,6 +352,7 @@ function optionsValue3Get1(data: any, fieldName: string) {
                     :data="item"
                     @asf-value-changed="asfValueChanged"
                     @optionsValue3Get1="optionsValue3Get1"
+                    :org-and-man-tree="orgAndManTree" 
                   />
 
               </div>
@@ -362,6 +364,7 @@ function optionsValue3Get1(data: any, fieldName: string) {
                   :data="item"
                   @asf-value-changed="asfValueChanged"
                   @optionsValue3Get1="optionsValue3Get1"
+                  :org-and-man-tree="orgAndManTree" 
                 />
               </div>
             </div>
@@ -375,6 +378,7 @@ function optionsValue3Get1(data: any, fieldName: string) {
               :data="item"
               @asf-value-changed="asfValueChanged"
               @optionsValue3Get1="optionsValue3Get1"
+              :org-and-man-tree="orgAndManTree" 
             />
           </div>
         </template>

src/components/DesignForm/public/form/form.vue

@@ -1716,6 +1716,27 @@ watch(
   }
 );
 // ------------------------数据处理结束------------------------
+
+
+
+const treeUrl = '/javasys/lowCode/transfer/getOrgAndManTree'
+const orgAndManTree = ref()
+function getOrgAndManTree() {
+    return request({
+        url: treeUrl,
+        method: 'post',
+    });
+}
+function getTree1() {
+    getOrgAndManTree().then(({ data }) => {
+        orgAndManTree.value = data
+
+    })
+}
+
+
+
+
 const asfs: any[] = [];
 const tables: any[] = [];
 function getAsfs() {
@@ -1803,6 +1824,7 @@ onMounted(() => {
   });
   showOrHide("kong");
   getAsfs();
+  getTree1();
 });
 onUnmounted(() => {
   if (eventName) {
@@ -2251,6 +2273,7 @@ const webPage = computed({
         :node-key="nodeKey"
         :purview="purview"
         @optionsValue3Get2="optionsValue3Get2"
+        :org-and-man-tree="orgAndManTree" 
       />
 
       <slot></slot>

src/components/DesignForm/public/form/formGroup.vue

@@ -26,6 +26,7 @@ const props = withDefaults(
     nodeKey?: string;
     purview?: any[];
     alldata?: any;
+    orgAndManTree?: any;
   }>(),
   {
     data: () => {
@@ -788,7 +789,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
                 :label="item.label"
                 :key="tIndex"
               >
-                <form-group :data="item.list" data-type="not-nested" />
+                <form-group :data="item.list" data-type="not-nested"  :org-and-man-tree="orgAndManTree" />
               </el-tab-pane>
             </el-tabs>
           </div>
@@ -818,7 +819,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
           <div class="form-table" v-if="type === 5">
             {{ element.item ? (element.item.label ? element.item.label : 2) : 3 }}
             <!-- <form-group :data="element.list" data-type="not-nested" /> -->
-            <form-group :data="element.list" data-type="not-table" />
+            <form-group :data="element.list" data-type="not-table"  :org-and-man-tree="orgAndManTree"  />
           </div>
 
           <child-table
@@ -826,6 +827,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
             :data="element"
             @asf-value-changed="asfValueChanged"
             @optionsValue3GetTable="optionsValue3GetTable"
+            :org-and-man-tree="orgAndManTree" 
           />
         </template>
         <!--格栅布局-->
@@ -846,7 +848,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
               :key="i"
               @click.stop="groupClick(col, 'gridChild')"
             >
-              <form-group :data="col.list" data-type="not-nested" />
+              <form-group :data="col.list" data-type="not-nested"  :org-and-man-tree="orgAndManTree" />
               <div class="drag-control" v-if="type === 5">
                 <div class="item-control">
                   <i
@@ -867,7 +869,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
                 {{ element.item.label }}
                 <Tooltips :content="element.help" />
               </template>
-              <form-group :data="element.list" data-type="not-nested" />
+              <form-group :data="element.list" data-type="not-nested"  :org-and-man-tree="orgAndManTree" />
             </el-collapse-item>
           </el-collapse>
         </template>
@@ -888,7 +890,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
               [element.config?.textAlign]: element.config?.textAlign,
             }"
           >
-            <form-group :data="element.list" data-type="not-nested" />
+            <form-group :data="element.list" data-type="not-nested"  :org-and-man-tree="orgAndManTree" />
           </div>
         </template>
         <!--弹性布局-->
@@ -898,7 +900,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
 						data-type="not-nested"
 						v-if="type === 5"
 					/> -->
-          <form-group :data="element.list" data-type="not-flex" v-if="type === 5" />
+          <form-group :data="element.list" data-type="not-flex" v-if="type === 5"  :org-and-man-tree="orgAndManTree" />
           <flex-box :data="element" v-else />
           <el-button
             style="position: relative; top: -28px; left: 10px"
@@ -961,6 +963,7 @@ function optionsValue3GetTable(data: any, fieldName: string) {
           :tablekey="props.tableinfo"
           :numrun="props.numrun"
           @asf-value-changed="asfValueChanged"
+          :org-and-man-tree="orgAndManTree" 
         />
 
         <!--组件设计外功能框架-->

src/components/DesignForm/public/form/formItem.vue

@@ -75,6 +75,7 @@ const props = withDefaults(
     tablekey?: any;
     numrun?: any;
     rowIndex?: any;
+    orgAndManTree?: any;
   }>(),
   {}
 );
@@ -1545,6 +1546,7 @@ const diGuiJilian = (val: any, options: any[]) => {
         :type="type"
         :rowIndex="rowIndex"
         v-model="value"
+        :org-and-man-tree="orgAndManTree" 
       />
       <component
         v-if="['lowcodeImage'].includes(data.type)"

src/widget/lowcodetransfer/lowcodeTransfer1.vue

@@ -24,7 +24,7 @@
             </div>
         </div>
 
-        <div class="rigthArea">
+        <!-- <div class="rigthArea">
             <div style="margin-bottom: 8px;">
                 <div class="transferName"><span>已选: {{ checkList.length }}</span>
                     <ElButton link style="float: right;margin-right: 5px;" @click="clearCheckList">清空</ElButton>
@@ -45,7 +45,7 @@
                 </ElTag>
 
             </ElScrollbar>
-        </div>
+        </div> -->
     </div>
 </template>
 
@@ -878,7 +878,7 @@ watch(selectedValueCompu, (newValue, oldValue) => {
 
 .leftArea {
     border: 1px solid gainsboro;
-    width: 300px;
+    width: 500px;
     border-radius: 5px;
     height: 456px;
     position: relative;