Browse Source

跨节点展开指定节点修改

duy 3 weeks ago
parent
commit
179e2f1f28
1 changed files with 40 additions and 5 deletions
  1. 40 5
      src/views/data-fill/components/JumpTreeDialog.vue

+ 40 - 5
src/views/data-fill/components/JumpTreeDialog.vue

@@ -1,6 +1,6 @@
 <template>
     <hc-new-dialog v-model="moveModal" is-table title="跨节点移动" widths="72rem" @close="closeModal">
-        <hc-page-split class="m-4" :options="{ sizes: [50, 50] }">
+        <hc-page-split class="p-4" :options="{ sizes: [50, 50] }">
             <!-- 左侧内容保持不变 -->
             <template #left>
                 <hc-card scrollbar>
@@ -54,12 +54,14 @@
                         v-if="!isShowSearch"
                         ref="treeRef"
                         :key="treeKey"
-                        node-key="id" 
+                        node-key="primaryKeyId" 
                         :props="treeProps"
                         :load="treeLoadNode"
                         lazy
                         :check-strictly="true"
                         highlight-current
+                        :default-expanded-keys="TreeAutoExpandKeys"
+                        
                         @node-click="handleNodeClick"
                     >
                         <template #default="{ node, data }">
@@ -80,7 +82,7 @@
                     <el-tree
                         v-else
                         v-loading="treeLoading"
-                        node-key="id"
+                        node-key="primaryKeyId"
                         default-expand-all
                         :props="treeProps"
                         :data="treeData"
@@ -115,7 +117,7 @@
 import { nextTick, ref, watch } from 'vue'
 import { getArrValue, getObjValue } from 'js-fast-way'
 import queryApi from '~api/data-fill/query'
-
+import { getStoreValue, setStoreValue } from '~src/utils/storage'
 // 接收父组件传入的属性
 const props = defineProps({
   contractId: {
@@ -142,7 +144,7 @@ const contractId = ref(props.contractId)
 const classType = ref(props.classType) 
 const authBtnTabKey = ref(props.authBtnTabKey)
 const primaryKeyId = ref(props.primaryKeyId)
-
+const TreeAutoExpandKeys = ref(getStoreValue('wbsTreeExpandKeys') || [])
 // 监听
 watch(() => [
     props.contractId,
@@ -255,6 +257,12 @@ const searchClick = () => {
      // 重新加载原始树
      if (treeRef.value) {
        refreshTree()
+           // 重新展开节点
+        nextTick(() => {
+            if (treeRef.value && TreeAutoExpandKeys.value.length > 0) {
+                expandNodesManually(TreeAutoExpandKeys.value)
+            }
+        })
      }
   } else {
     isShowSearch.value = true
@@ -290,6 +298,7 @@ const getSearchTreeData = async () => {
 
 // 获取左侧数据
 const cityLoading = ref(false)
+// 获取左侧数据
 const getSameLevelsTreeData = async () => { 
     cityLoading.value = true
     const { error, code, data } = await queryApi.getSiblingWbsContract({
@@ -298,11 +307,37 @@ const getSameLevelsTreeData = async () => {
     
     if (!error && code === 200) {
         cities.value = getArrValue(data)
+                // 等待DOM更新后执行展开操作
+        nextTick(() => {
+            // 方案1: 使用 store 方法
+            // 方案2: 备用方案 - 使用 setTimeout 确保DOM已渲染
+            setTimeout(() => {
+                expandNodesManually(TreeAutoExpandKeys.value)
+            }, 300)
+        })
+        
+ 
     } else {
         cities.value = []
     }
     cityLoading.value = false
 }
+// 添加手动展开节点的方法
+const expandNodesManually = (keys) => {
+    console.log(treeRef.value, 'treeRef.value')
+    
+    if (!treeRef.value) return
+    
+    keys.forEach(key => {
+        const node = treeRef.value.getNode(key)
+         console.log(node, 'node')
+        if (node && !node.expanded) {
+           
+            
+            node.expand()
+        }
+    })
+}
 
 // 提交移动
 const moveLoading = ref(false)