吉安感知网项目-前端
chenyao
2026-02-03 ec10ac7a0b3a5f728d18e2f566340d019cc0ef65
applications/task-work-order/src/views/orderView/appConfiguration/inventory/FormDiaLog.vue
@@ -42,23 +42,12 @@
         <el-row>
            <el-col :span="12">
               <el-form-item label="所属区划" prop="areaCode">
                  <el-tree-select
                     class="gd-select"
                     popper-class="gd-tree-select-popper"
                     v-model="formData.areaCode"
                     node-key="id"
                     :default-expanded-keys="expandedKeys"
                     :props="treeSelectProps"
                     placeholder="请选择"
                     clearable
                     filterable
                     :check-strictly="true"
                     lazy
                     :load="loadRegionNode"
                     :render-after-expand="false"
                     @change="handleAreaChange"
                  />
               </el-form-item>
               <RegionSelect
                  v-model="formData.areaCode"
                  placeholder="请选择"
                  @change="handleAreaChange"
               />
            </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="实施清单名称" prop="implementName">
@@ -106,7 +95,8 @@
import { computed, ref, inject } from 'vue'
import { ElMessage } from 'element-plus'
import { fieldRules } from '@ztzf/utils'
import { inventorySubmitApi, inventoryDetailApi, regionLazyTreeApi } from './inventoryApi'
import { inventorySubmitApi, inventoryDetailApi } from './inventoryApi'
import RegionSelect from '@/components/RegionSelect/main.vue'
// 初始化表单数据
const initForm = () => ({
@@ -135,20 +125,6 @@
const submitting = ref(false) // 提交中
const dialogReadonly = computed(() => dialogMode.value === 'view')
const titleEnum = ref({ edit: '编辑', view: '查看', add: '新增' })
const expandedKeys = ref([]) // 树形选择器展开的节点
const regionNodeCache = ref(new Map()) // 缓存区域节点及其父节点关系
// 区域树形选择器配置
const treeSelectProps = ref({
   value: 'id',
   label: 'name',
   children: 'children',
   // 判断叶子节点
   isLeaf: (data, node) => {
      // 如果是第二级节点,则认为是叶子节点
      return node.level >= 2
   },
})
// 表单校验规则
const rules = {
@@ -188,10 +164,14 @@
      formData.value.areaName = ''
      return
   }
   // 从缓存中获取区域名称
   const node = regionNodeCache.value.get(value)
   if (node) {
      formData.value.areaName = node.name || ''
   // 处理RegionSelect组件传递的包含code和name的对象
   if (typeof value === 'object' && value.code) {
      formData.value.areaCode = value.code
      formData.value.areaName = value.name || ''
   } else {
      // 兼容旧的字符串值格式
      formData.value.areaCode = value
      formData.value.areaName = ''
   }
}
@@ -220,62 +200,6 @@
      data.areaCode = String(data.areaCode)
   }
   formData.value = data
   // 如果是编辑模式,获取区域节点的路径以展开树形选择器
   if (dialogMode.value === 'edit' && data.areaCode) {
      await loadRegionPath(data.areaCode)
   }
}
// 加载区域节点路径
async function loadRegionPath(areaCode) {
   try {
      const path = []
      const queue = [{ code: '360800000000', currentPath: ['360800000000'] }]
      let found = false
      // 广度优先搜索,逐层加载节点直到找到目标节点
      while (queue.length > 0 && !found) {
         const { code, currentPath } = queue.shift()
         // 获取当前节点的子节点
         const res = await regionLazyTreeApi({ parentCode: code })
         const nodes = res?.data?.data || []
         for (const node of nodes) {
            const nodeId = node.id || node.value
            // 缓存节点及其父节点关系
            regionNodeCache.value.set(nodeId, {
               id: nodeId,
               name: node.name || node.title || node.label,
               parentId: code,
               hasChildren: node.hasChildren || false,
            })
            // 检查是否找到目标节点
            if (nodeId === areaCode) {
               path.push(...currentPath, nodeId)
               found = true
               break
            }
            // 如果有子节点,加入队列继续搜索
            if (node.hasChildren) {
               queue.push({
                  code: nodeId,
                  currentPath: [...currentPath, nodeId],
               })
            }
         }
      }
      if (path.length > 0) {
         expandedKeys.value = path
      }
   } catch (error) {
      console.error('加载区域路径失败:', error)
   }
}
// 打开弹框
@@ -284,45 +208,6 @@
   formData.value = dialogMode.value === 'add' ? initForm() : row
   if (dialogMode.value !== 'add') {
      await loadDetail()
   }
}
// 懒加载获取区域节点数据
async function loadRegionNode(node, resolve) {
   try {
      // 限制只加载两级,当前节点 level >= 1 时不加载子节点
      if (node.level >= 2) {
         resolve([])
         return
      }
      // 初始化加载时传递 code 参数,加载子节点时传递 parentCode 参数
      const params = node.data?.id ? { parentCode: node.data.id } : { code: '360800000000' }
      const parentCode = node.data?.id || '360800000000'
      const res = await regionLazyTreeApi(params)
      const nodes = res?.data?.data || []
      // 处理返回的节点数据
      const processedNodes = nodes.map(item => {
         const nodeId = item.id || item.value
         // 缓存节点及其父节点关系
         regionNodeCache.value.set(nodeId, {
            id: nodeId,
            name: item.name || item.title || item.label,
            parentId: parentCode,
            hasChildren: item.hasChildren || false,
         })
         return {
            id: nodeId,
            name: item.name || item.title || item.label,
            hasChildren: item.hasChildren || false,
         }
      })
      resolve(processedNodes)
   } catch (error) {
      console.error('获取区域数据失败:', error)
      resolve([])
   }
}