diff --git a/src/api/api.js b/src/api/api.js index 0bd6bed..be2b8f8 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -57,7 +57,10 @@ export const statisticsApi = { getRegionHouseStats: () => get('/statistics/region-house'), getRegionApartmentHouseStats: () => get('/statistics/region-apartment-house'), getDashboardStats: () => get('/statistics/dashboard'), - getApartmentRoomStatusStats: () => get('/statistics/apartment-room-status') + getApartmentRoomStatusStats: () => get('/statistics/apartment-room-status'), + getEmptyRoomsByApartment: () => get('/statistics/empty-rooms-by-apartment'), + getRentedRoomsByApartment: () => get('/statistics/rented-rooms-by-apartment'), + getTenantRentalStats: () => get('/statistics/tenant-rental-stats') }; // 水费管理API diff --git a/src/views/rental/List.vue b/src/views/rental/List.vue index bc732c6..967cded 100644 --- a/src/views/rental/List.vue +++ b/src/views/rental/List.vue @@ -49,6 +49,9 @@
+
+ +
房间状态统计
-
- -
@@ -27,6 +24,61 @@
房间总数:{{ totalCount }} 间
+
+

空房分布

+ + + + + + + +
+
+

在租分布

+ + + + + + + +
+
+

租客在租统计

+ + + + + + + + +
@@ -38,7 +90,10 @@ export default { name: 'RoomStatistics', data() { return { - roomStatusData: [] + roomStatusData: [], + emptyRoomsData: [], + rentedRoomsData: [], + tenantRentalData: [] } }, computed: { @@ -50,6 +105,9 @@ export default { }, mounted() { this.loadRoomStatusData() + this.loadEmptyRoomsData() + this.loadRentedRoomsData() + this.loadTenantRentalData() }, methods: { async loadRoomStatusData() { @@ -94,6 +152,30 @@ export default { } this.$router.push(`/rental/list?${query}`) + }, + async loadEmptyRoomsData() { + try { + const response = await statisticsApi.getEmptyRoomsByApartment() + this.emptyRoomsData = response + } catch (error) { + this.$message.error('加载空房分布数据失败') + } + }, + async loadRentedRoomsData() { + try { + const response = await statisticsApi.getRentedRoomsByApartment() + this.rentedRoomsData = response + } catch (error) { + this.$message.error('加载在租分布数据失败') + } + }, + async loadTenantRentalData() { + try { + const response = await statisticsApi.getTenantRentalStats() + this.tenantRentalData = response + } catch (error) { + this.$message.error('加载租客在租统计数据失败') + } } } } @@ -129,6 +211,31 @@ export default { color: #409EFF; } +.no-empty-rooms { + color: #909399; + font-style: italic; + padding: 8px 0; +} + +.expand-content { + padding: 15px 20px; + background-color: #f9f9f9; +} + +.apartment-item { + padding: 8px 0; + border-bottom: 1px dashed #e0e0e0; +} + +.apartment-item:last-child { + border-bottom: none; +} + +.no-rooms { + color: #909399; + font-style: italic; +} + .clickable-cell { cursor: pointer; transition: color 0.3s;