跨节点移动修改

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>
+        <hc-page-split class="m-4">
             <template #left>
                 <hc-card scrollbar>
                     <div class="checkbox-container">
@@ -32,7 +32,7 @@
             <hc-card class="tree-card">
                 <template #search>
                     <div class="flex-1">
-                        <el-input v-model="searchInput" placeholder="请输入" />
+                        <el-input v-model="searchInput" placeholder="请输入" clearable />
                     </div>
                     <div class="ml-2">
                         <el-button       
@@ -47,9 +47,10 @@
                 <!-- 添加懒加载树 -->
                 <el-scrollbar class="tree-scrollbar mt-3" style="height: 100%;">
                     <el-tree
+                        v-if="!isShowSearch"
                         ref="treeRef"
                         node-key="id"
-                        :data="treeData"
+                       
                         :props="treeProps"
                         :load="treeLoadNode"
                         lazy
@@ -63,7 +64,29 @@
                         <template #default="{ node, data }">
                             <span class="custom-tree-node">
                                 <span>{{ node.label }}</span>
-                                <span v-if="data.code" class="ml-2 text-gray-400">({{ data.code }})</span>
+                               
+                            </span>
+                        </template>
+                    </el-tree>
+                    <el-tree
+                        v-else
+                        v-loading="treeLoading"
+                        node-key="id"
+                        default-expand-all
+                        :props="treeProps"
+                        :data="treeData"
+                       
+                        :show-checkbox="true"
+                        :check-strictly="true"
+                        :check-on-click-node="true"
+                       
+                        highlight-current
+                        @check="handleCheckChange"
+                    >
+                        <template #default="{ node, data }">
+                            <span class="custom-tree-node">
+                                <span>{{ node.label }}</span>
+                               
                             </span>
                         </template>
                     </el-tree>
@@ -136,6 +159,7 @@ const searchInput = ref('')
 // 树相关
 const treeRef = ref(null)
 const treeData = ref([])
+const isShowSearch = ref(false)
 const currentNode = ref(null)
 
 // 树配置
@@ -194,12 +218,36 @@ const handleCheckChange = (data, checked) => {
 // 搜索功能
 const searchClick = () => {
   if (!searchInput.value) {
-    window.$message.warning('请输入搜索关键词')
-    return
+     isShowSearch.value = false
+    
+  } else {
+    isShowSearch.value = true
+    getSearchTreeData()
   }
   // TODO: 实现搜索逻辑
   console.log('搜索关键词:', searchInput.value)
 }
+const treeLoading = ref(false)
+
+const getSearchTreeData = async () => {
+    treeLoading.value = true
+    const { error, code, data }
+        = await queryApi.getTreeNodeByQueryValueAndContractId({
+            contractId: contractId.value,
+            queryValue: searchInput.value,
+            tableOwner: authBtnTabKey.value,
+        })
+    //判断状态
+    if (!error && code === 200) {
+      
+        treeData.value = getArrValue(data)
+        treeLoading.value = false
+    } else {
+        treeLoading.value = false
+
+        treeData.value = []
+    }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -276,4 +324,5 @@ const searchClick = () => {
     height: 100%;
   }
 }
-</style>
+</style>
+