完成小区相关的接口对接

src/views/system/house/components/building.vue

@@ -8,14 +8,14 @@
     </div>
     <ul>
       <li
-        v-for="(item, index) in buildingList"
+        v-for="(item, index) in currentBuildingInfoList"
         :class="{
-          active: index === activeId
+          active: item.id === currentBuildingInfo.id
         }"
         :key="index"
-        @click="checkBuilding(index)"
+        @click="switchBuilding(item.id)"
       >
-        <div class="buildingname">{{ item.name }}</div>
+        <div class="buildingname">{{ item.villageName ?? '未知' }}</div>
         <div class="buildactions flex align-center justify-around">
           <el-icon class="pointer hover-color-blue"><Setting /></el-icon>
           <el-icon class="pointer hover-color-red"><Delete /></el-icon>
@@ -27,26 +27,11 @@
 
 <script setup lang="ts">
 import { ref } from 'vue';
-
+import { useHouseStore } from '@/store/modules/house';
+const houseStore = useHouseStore();
+const { switchBuilding } = houseStore; // 方法
+const { currentBuildingInfoList, currentBuildingInfo } = storeToRefs(houseStore); // 数据
 const router = useRouter();
-const activeId = ref(0);
-const buildingList = ref([
-  {
-    id: 1,
-    name: 'a栋'
-  },
-  {
-    id: 2,
-    name: 'b栋'
-  },
-  {
-    id: 3,
-    name: 'c栋'
-  }
-]);
-const checkBuilding = (index: number) => {
-  activeId.value = index;
-};
 
 const handleAddBuilding = () => {
   router.push({

src/views/system/house/components/components/houseItem.vue

@@ -15,6 +15,8 @@ const props = defineProps<{
   unit: any;
   fIdx: number;
 }>();
+const houstlist = ref([]);
+props.unit;
 const router = useRouter();
 const checked = ref([]);
 // 菜单
@@ -28,7 +30,6 @@ const menuList = ref([
 const contextMenu = ref();
 // 点击事件
 const handleSelect = (val) => {
-  console.log('你选择了：', val);
   switch (val) {
     case 'edit':
       break;
@@ -50,10 +51,6 @@ function handleClick(house: any) {
 const emit = defineEmits<{
   change: string[];
 }>();
-
-function handleContextMenu(e) {
-  console.log(e);
-}
 </script>
 
 <style scoped lang="scss">

src/views/system/house/components/components/table.vue

@@ -1,14 +1,21 @@
 <template>
   <div class="TableBox p-5 h-full">
-    <el-table border :data="Array.from({ length: building.totalFloors }, (_, i) => i + 1)">
+    <el-table border :data="floorsSortList">
       <el-table-column align="center" fixed label="楼层\单元" width="85">
-        <template #default="{ $index }">
-          <span>{{ $index + 1 }}楼</span>
+        <template #default="{ $index, row }">
+          <span>{{ row }}楼</span>
         </template>
       </el-table-column>
-      <el-table-column min-width="160" class="column" align="center" :label="units.unitNo" v-for="(units, index) in building.units" :key="index">
-        <template #default="{ $index }">
-          <houseItem :unit="units.houses[$index]" :f-idx="$index"></houseItem>
+      <el-table-column
+        min-width="160"
+        class="column"
+        align="center"
+        :label="units.buildingName"
+        v-for="(units, index) in currentHouseInfoList"
+        :key="index"
+      >
+        <template #default="{ $index, row }">
+          <houseItem :unit="units.floors_Json" :f-idx="row"></houseItem>
         </template>
       </el-table-column>
     </el-table>
@@ -18,72 +25,38 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import houseItem from './houseItem.vue';
-import { build } from 'vite';
-// 房屋信息
-interface House {
-  id: string; // 唯一标识，如 B-1-101
-  roomNo: string; // 房号，如 101
-  checked: boolean; // 是否选中
-  // 可扩展：面积、户型、收费标准、状态等
+import { useHouseStore } from '@/store/modules/house';
+const houseStore = useHouseStore();
+const { currentHouseInfoList } = storeToRefs(houseStore); // 数据
+console.log(currentHouseInfoList);
+const maxFloors = ref(0);
+const maxUnits = ref(currentHouseInfoList.value.length);
+const floorslist = ref(new Set());
+const floorsSortList = computed(() => {
+  const list = Array.from(floorslist.value) as string[];
+  return list.sort(sortNumberStr);
+});
+function sortNumberStr(a, b) {
+  const numA = parseFloat(a);
+  const numB = parseFloat(b);
+
+  // 如果都是有效数字 → 按数字大小排（支持负数、小数）
+  if (!isNaN(numA) && !isNaN(numB)) {
+    return numA - numB;
+  }
+
+  // 否则按自然语言排
+  return a.localeCompare(b, 'zh-CN', { numeric: true });
 }
 
-// 单元信息
-interface Unit {
-  id: string; // 唯一标识，如 1
-  unitNo: string; // 单元号，如 1单元
-  houses: House[][]; // 按楼层分组的房屋，houses[0] 对应1楼，houses[1]对应2楼...
-}
-
-// 楼栋信息
-interface Building {
-  buildingNo: string; // 楼栋号，如 B栋
-  totalFloors: number; // 总楼层
-  units: Unit[]; // 单元列表
-}
-// 初始化B栋数据
-const building: Building = {
-  buildingNo: 'B栋',
-  totalFloors: 5, // 总楼层
-  // 栋-> 单元 -> 楼 -> 房间
-  units: []
-};
-
-function init(length) {
-  const arr = Array.from({ length: length }).map((_, index) => {
-    return {
-      id: index,
-      unitNo: index + 1 + '单元',
-      // 1单元
-      houses: [
-        // 1楼
-        [
-          // 一楼房屋
-          { id: 'B-3-301', roomNo: '101', checked: true },
-          { id: 'B-3-302', roomNo: '102', checked: false },
-          { id: 'B-3-303', roomNo: '103', checked: false },
-          { id: 'B-3-304', roomNo: '104', checked: false },
-          { id: 'B-3-305', roomNo: '105', checked: false },
-          { id: 'B-3-306', roomNo: '106', checked: false },
-          { id: 'B-3-307', roomNo: '107', checked: false },
-          { id: 'B-3-308', roomNo: '108', checked: false }
-        ],
-        [
-          { id: 'B-1-201', roomNo: '201', checked: true },
-          { id: 'B-1-202', roomNo: '202', checked: false },
-          { id: 'B-1-203', roomNo: '203', checked: false },
-          { id: 'B-1-204', roomNo: '204', checked: false },
-          { id: 'B-1-205', roomNo: '205', checked: false },
-          { id: 'B-1-206', roomNo: '206', checked: false },
-          { id: 'B-1-207', roomNo: '207', checked: false },
-          { id: 'B-1-208', roomNo: '208', checked: false }
-        ]
-      ]
-    };
-  }) as any;
-  console.log(arr);
-  building.units = arr;
-}
-init(20);
+currentHouseInfoList.value.forEach((item) => {
+  maxFloors.value = Math.max(maxFloors.value, item.actualFloorCount);
+  item.floors_Json = JSON.parse(`[${item.floors.replaceAll('\\', '')}]`);
+  console.log(item.floors_Json);
+  item.floors_Json.forEach((floor) => {
+    floorslist.value.add(floor.floorNo);
+  });
+});
 </script>
 
 <style scoped lang="scss">

src/views/system/house/components/unit.vue

@@ -26,7 +26,6 @@ import { ref } from 'vue';
 import TableUnit from './components/table.vue';
 const router = useRouter();
 function handleAddHouse() {
-  console.log('add house');
   router.push({
     path: '/house/addHouse'
   });