关联构建编码

src/api/modules/data-fill/wbs.js

@@ -611,4 +611,20 @@ export default {
             data: form,
         })
     },
+    //获取第三方树根节点
+    async getChildNodes(form) {
+        return HcApi({
+            url: '/api/blade-manager/wbsDivide/getChildNodes',
+            method: 'get',
+            params: form,
+        })
+    },
+    //绑定阶段
+     async batchBind(form) {
+        return HcApi({
+            url: '/api/blade-manager/wbsDivide/batchBind',
+            method: 'post',
+            data: form,
+        })
+    },
 }

src/views/data-fill/components/linkData.vue

@@ -1,5 +1,5 @@
 <template>
-    <hc-new-dialog v-model="linkModal" is-table title="关联构建编码" widths="72rem" @close="closeModal">
+    <hc-new-dialog v-model="linkModal" is-table title="关联构建编码" widths="72rem" :loading="confirmLoad" @close="closeModal" @save="confirmLink">
         <div class="link-dialog-box h-full p-2">
             <hc-page-split>
                 <template #left>
@@ -22,33 +22,38 @@
                  
                     
                     <el-scrollbar class="mt-4 h-[calc(100%-60px)]">
-                        <el-tree
-                            ref="treeRef"
-                            :data="treeData"
-                            :props="treeProps"
-                            :default-expand-all="false"
+                        <template v-if="leftRadio">
+                            <el-tree
+                                ref="treeRef"
+                                :data="treeData"
+                                :props="treeProps"
+                                :default-expand-all="false"
                         
-                            :filter-node-method="filterNode"
-                            :load="loadNode"  
-                            lazy  
-                            node-key="id"
-                            check-strictly
-                            @node-click="handleNodeClick"
-                        >
-                            <!-- 自定义节点内容，使用单选框 -->
-                            <template #default="{ node, data }">
-                                <span class="custom-tree-node">
-                                    <!-- 使用单选框替代复选框 -->
-                                    <el-radio 
-                                        v-model="selectedNodeId" 
-                                        :value="data.id"
-                                        :disabled="data.nodeType === 6"
-                                        class="mr-2"
-                                    />
-                                    <span>{{ node.label }}</span>
-                                </span>
-                            </template>
-                        </el-tree>
+                                :filter-node-method="filterNode"
+                                :load="loadNode"  
+                                lazy  
+                                node-key="id"
+                                check-strictly
+                                @node-click="handleNodeClick"
+                            >
+                                <!-- 自定义节点内容，使用单选框 -->
+                                <template #default="{ node, data }">
+                                    <span class="custom-tree-node">
+                                        <!-- 使用单选框替代复选框 -->
+                                        <el-radio 
+                                            v-model="selectedNodeId" 
+                                            :value="data.id"
+                                            :disabled="data.nodeType === 6"
+                                            class="mr-2"
+                                        />
+                                        <span>{{ node.label }}</span>
+                                    </span>
+                                </template>
+                            </el-tree>
+                        </template>
+                        <template v-else>
+                            <div class="py-10 text-center text-gray-500">请先选择左侧工区</div>
+                        </template>
                     </el-scrollbar>
                 </hc-card>
             </hc-page-split>
@@ -57,27 +62,35 @@
 </template>
 
 <script setup> 
-import { computed, ref, watch } from 'vue'
-
+import { ref, watch } from 'vue'
+import wbsApi from '~api/data-fill/wbs'
+import { getArrValue, getObjValue } from 'js-fast-way'
 // 接收父组件传入的属性
-const props = defineProps({})
-
+const props = defineProps({
+    pKeyId:{
+        type: String,
+        default: '',
+    },
+})
 const emit = defineEmits(['close', 'save'])
-
+const pKeyId = ref(props.pKeyId)
+watch(() => props.pKeyId, (val) => {
+    pKeyId.value = val
+})
 // 对话框显示状态
 const linkModal = defineModel('modelValue', {
     default: false,
 })
 
 // 左侧单选框值
-const leftRadio = ref('1')
+const leftRadio = ref('')
 const sourceData = ref([
-    { id: '1', name: '一工区' },
-    { id: '2', name: '二工区' },
-    { id: '4', name: '四工区' },
-    { id: '5', name: '五工区' },
-    { id: '6', name: '六工区' },
-    { id: '7', name: '二期工程' },
+    { id: '54e8a314de8a493d9f08a9d3cf7c', name: '一工区' },
+    { id: 'f4fb6834d501474194410c15e9f5', name: '二工区' },
+    { id: '7a5e3bb9c36d43c8a08bfb44b13e', name: '四工区' },
+    { id: '9e61c9bc6dd742d9922aa61b8bd1', name: '五工区' },
+    { id: '119739d00e974214acd85b3ad661', name: '六工区' },
+    { id: 'cc10f104ddb64320ab59ac7abec9', name: '二期工程' },
 ])
 
 // 搜索关键词
@@ -110,69 +123,66 @@ watch(() => linkModal.value, (val) => {
 })
 
 // 加载根节点数据
-const loadRootNodes = (workArea) => {
-    console.log(`加载${workArea}的根节点数据`)
-    // 实际项目中这里应该是接口请求根节点
-    // 模拟根节点数据
-    treeData.value = [
-        { id: 1, name: '路基工程', isLeaf: false },
-        { id: 2, name: '涵洞通道', isLeaf: false },
-        { id: 3, name: '人字预制装配护坡', isLeaf: false },
-        { id: 4, name: '路肩墙', isLeaf: false },
-        { id: 5, name: '其他工程', isLeaf: false },
-    ]
+const loadRootNodes = async (workArea) => {
+  // 清空现有树形数据
+  treeData.value = []
+  // 重置选中节点ID
+  selectedNodeId.value = ''
+  
+  if (!workArea) return // 如果没有选中工区则不加载
+  
+  try {
+    // 加载根节点（parentId设为0表示根节点）
+    const { data } = await wbsApi.getChildNodes({
+      contractId: workArea,
+      pKeyId: pKeyId.value || '',
+      parentId: 0, // 明确请求根节点数据
+    })
+    
+    // 设置根节点数据
+    treeData.value = getArrValue(data)
+    // 重置树形组件状态
+    if (treeRef.value) {
+        console.log(treeRef.value, 'treeRef.value.')
+ 
+      treeRef.value.setCheckedKeys([])
+    }
+  } catch (error) {
+    console.error('加载根节点失败:', error)
+  }
 }
-
 // 懒加载节点方法
-const loadNode = (node, resolve) => {
-    // node为当前点击的节点，resolve用于返回子节点数据
-    if (node.level === 0) {
-        // 根节点已经在treeData中定义，不需要额外加载
-        return resolve([])
+
+const loadNode = async (node, resolve) => {
+    const { level, data: item } = node
+    let parentId = 0
+    if (level !== 0) {
+        const nodeData = getObjValue(item)
+        parentId = nodeData?.id
+        
     }
     
-    console.log(`加载节点${node.data.id}的子节点`)
-    
-    // 实际项目中这里应该是接口请求，根据node.data.id获取子节点
-    // 模拟异步加载子节点
-    setTimeout(() => {
-        // 模拟不同节点的子节点数据
-        let children = []
-        switch (node.data.id) {
-            case 1:
-                children = [{ id: 11, name: 'K54+467.791~K54+707.3 路基工程', isLeaf: true }]
-                break
-            case 2:
-                children = [{ id: 21, name: 'K54+469~K54+721.5 涵洞通道', isLeaf: true }]
-                break
-            case 3:
-                children = [
-                    { id: 31, name: '人字预制装配护坡', isLeaf: true },
-                    { id: 32, name: '人字预制装配护坡 (右侧)', isLeaf: true },
-                ]
-                break
-            case 4:
-                children = [
-                    { id: 41, name: '路肩墙', isLeaf: true },
-                    { id: 42, name: '人字预制装配护坡 (右侧)', isLeaf: true },
-                ]
-                break
-            case 5:
-                children = [
-                    { id: 51, name: '喷射植草', isLeaf: true },
-                    { id: 52, name: '人字预制装配护坡 (右侧)', isLeaf: true },
-                ]
-                break
-            default:
-                children = []
-        }
-        resolve(children)
-    }, 500) // 模拟网络延迟
+    // 获取数据
+    const { data } = await wbsApi.getChildNodes({
+        contractId: leftRadio.value || '',
+      
+        pKeyId: pKeyId.value || '',
+        parentId,
+      
+       
+       
+    })
+
+    resolve(getArrValue(data))
 }
+// 修改加载根节点数据方法
 
 // 关闭对话框
 const closeModal = () => {
     linkModal.value = false
+    selectedNodeData.value = null
+    selectedNodeId.value = null
+    leftRadio.value = null
     emit('close')
 }
 
@@ -188,47 +198,42 @@ const filterNode = (value, data) => {
 }
 
 // 处理节点点击事件
+const selectedNodeData = ref(null)
 const handleNodeClick = (data) => {
     // 如果是叶子节点才允许选中
         selectedNodeId.value = data.id
+        selectedNodeData.value = data
+
 }
 
 // 确认关联
-const confirmLink = () => {
+const confirmLoad = ref(false)
+const confirmLink = async () => {
     if (!selectedNodeId.value) {
         // 提示用户未选择节点
+        window?.$message?.warning('请选择节点')
         return
     }
+     confirmLoad.value = true
+    const { error, code, data, msg } = await wbsApi.batchBind([
+        selectedNodeData.value,
+    ])
+    confirmLoad.value = false
     
-    // 找到选中的节点数据（实际项目中可能需要根据ID重新请求详情）
-    const findSelectedNode = async (nodes, id) => {
-        for (const node of nodes) {
-            if (node.id === id) return node
-            if (!node.isLeaf) {
-                // 如果不是叶子节点，尝试加载其子节点再查找
-                // 这里简化处理，实际可能需要更复杂的逻辑
-                const children = await new Promise(resolve => {
-                    loadNode({ data: node }, resolve)
-                })
-                const found = findSelectedNode(children, id)
-                if (found) return found
-            }
-        }
-        return null
+    if (!error && code === 200) {
+        window.$message?.success(msg ?? '操作成功')
+        closeModal()
     }
+
     
-    findSelectedNode(treeData.value, selectedNodeId.value).then(selectedData => {
-        if (selectedData) {
-            emit('save', selectedData)
-            closeModal()
-        }
-    })
+
 }
 
 // 监听左侧工区变化，重新加载根节点数据
 watch(leftRadio, (newVal) => {
     loadRootNodes(newVal)
     selectedNodeId.value = ''
+    selectedNodeData.value = null
 })
 </script>
 

src/views/data-fill/wbs.vue

@@ -1539,7 +1539,7 @@
         <!-- 关联构建编码 -->
         <linkData
             v-model="wbsLinkModal"
-           
+            :p-key-id=" primaryKeyId"
             @save="linkSaveClick"
             @close="linkModalClose"
         />