Blame view

src/components/fee/communityRoomTree.vue 3.01 KB
b25b036d   wuxw   v1.9 优化日期
1
  <template>
a42b3256   wuxw   HC小区管理系统前段vue版正在开发中
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
    <el-card class="tree-card">
      <el-tree
        ref="tree"
        :data="treeData"
        :props="defaultProps"
        node-key="id"
        highlight-current
        @node-click="handleNodeClick"
      />
    </el-card>
  </template>
  
  <script>
  import { queryCommunityUnitTree, queryAdminRoomsTree } from '@/api/fee/adminRoomFeeApi'
  
  export default {
    name: 'CommunityRoomTree',
    data() {
      return {
        treeData: [],
        defaultProps: {
          children: 'children',
          label: 'text'
        },
        loadedUnits: new Set() // Track which units have loaded their rooms
      }
    },
    mounted() {
      this.initCommunityRoomTree()
    },
    methods: {
      async initCommunityRoomTree() {
        try {
          const res = await queryCommunityUnitTree({ a: 1 })
          if (res.code === 0) {
            this.treeData = res.data
          }
        } catch (error) {
          console.error('Failed to load community tree:', error)
        }
      },
  
      async handleNodeClick(data) {
        // Only handle unit nodes (u_ prefix) that haven't been loaded yet
        if (data.id.startsWith('u_') && !this.loadedUnits.has(data.id)) {
          await this.loadRooms(data.unitId || data.id.replace('u_', ''))
          this.loadedUnits.add(data.id)
        }
        
        // Emit event for room selection
        if (data.id.startsWith('r_')) {
          this.$emit('select-room', {
            roomName: data.roomName,
            roomId: data.roomId
          })
        }
      },
  
      async loadRooms(unitId) {
        try {
          const param = {
            page: 1,
            row: 1000,
            unitId: unitId
          }
  
          const res = await queryAdminRoomsTree(param)
          if (res.rooms && res.rooms.length > 0) {
            const rooms = res.rooms.map(room => ({
              id: `r_${room.roomId}`,
              roomId: room.roomId,
              roomName: `${room.floorNum}-${room.unitNum}-${room.roomNum}`,
              text: room.ownerName ? `${room.roomNum}(${room.ownerName})` : room.roomNum
            }))
  
            // Find and update the unit node
            const unitNode = this.findNodeById(`u_${unitId}`, this.treeData)
            if (unitNode) {
              this.$set(unitNode, 'children', rooms)
              
              // Auto-select the first room if needed
              if (rooms.length > 0) {
                this.$nextTick(() => {
                  this.$refs.tree.setCurrentKey(rooms[0].id)
                  this.$emit('select-room', {
                    roomName: rooms[0].roomName,
                    roomId: rooms[0].roomId
                  })
                })
              }
            }
          }
        } catch (error) {
          console.error('Failed to load rooms:', error)
        }
      },
  
      findNodeById(id, nodes) {
        if (!nodes) return null
        
        for (const node of nodes) {
          if (node.id === id) return node
          if (node.children) {
            const found = this.findNodeById(id, node.children)
            if (found) return found
          }
        }
        return null
      }
    }
  }
  </script>
  
  <style scoped>
  .tree-card {
07e12785   wuxw   v1.9 admin账户中部分页面...
117
118
    max-height: 80vh;
    overflow-y: auto;
a42b3256   wuxw   HC小区管理系统前段vue版正在开发中
119
120
  }
  </style>