完成小区相关的接口对接

2026-04-07 18:02:18 +08:00
parent ee55b4dca7
commit b87a594d4e
32 changed files with 913 additions and 384 deletions
--- a/src/views/system/house/components/building.vue
+++ b/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({
--- a/src/views/system/house/components/components/houseItem.vue
+++ b/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">
--- a/src/views/system/house/components/components/table.vue
+++ b/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">
--- a/src/views/system/house/components/unit.vue
+++ b/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'
  });
--- a/src/views/system/house/index.vue
+++ b/src/views/system/house/index.vue
@@ -3,8 +3,8 @@
    <PageHeader>
      <template #content>
        <div class="houseAdressBox">
-          <span class="mr-50px">当前小区：北境碧桂园小区</span>
-          <span>小区地址：北境朝北市塔里克儿大道368号</span>
+          <span class="mr-50px">当前小区：{{ currentVilageInfo && currentVilageInfo.villageName }}</span>
+          <span>小区地址：{{ currentVilageInfo && currentVilageInfo.city }} {{ currentVilageInfo && currentVilageInfo.address }}</span>
        </div>
        <div class="houseTypeBox flex">
          <div
@@ -31,47 +31,19 @@
 import building from './components/building.vue';
 import unit from './components/unit.vue';
 import PageHeader from '@/components/Pageheader/index.vue';
-const housetypelist = ['住宅', '办公', '商用', '公寓'];
+import { useHouseStore } from '@/store/modules/house';
+const houseStore = useHouseStore();
+const { currentVilageInfo } = storeToRefs(houseStore);
+console.log(currentVilageInfo);

+const housetypelist = ['住宅', '办公', '商用', '公寓'];
 const active = ref(0);
 const changeHouseType = (index: number) => {
  active.value = index;
 };

-let ojb = {
-  'code': 200,
-  'msg': '操作成功',
-  'data': [
-    {
-      'unitNo': '1',
-      'houses': '{"houseId":5,"houseNo":"1201室"}, {"houseId":6,"houseNo":"1202室"}',
-      'houseCount': 2,
-      'floorNo': '12',
-      'buildingId': 54564
-    },
-    {
-      'unitNo': '1',
-      'houses': '{"houseId":1,"houseNo":"1301室"}, {"houseId":2,"houseNo":"1302室"}',
-      'houseCount': 2,
-      'floorNo': '13',
-      'buildingId': 54564
-    },
-    {
-      'unitNo': '2',
-      'houses': '{"houseId":7,"houseNo":"1201室"}',
-      'houseCount': 1,
-      'floorNo': '12',
-      'buildingId': 54564
-    },
-    {
-      'unitNo': '2',
-      'houses': '{"houseId":3,"houseNo":"1301室"}, {"houseId":4,"houseNo":"1302室"}',
-      'houseCount': 2,
-      'floorNo': '13',
-      'buildingId': 54564
-    }
-  ]
-};
+// 初始化数据
+houseStore.initHouse(active.value);
 </script>

 <style lang="scss" scoped>