From 8400bd158c30c4b3b42d5215c39b9fd1bd50839f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Wed, 8 Oct 2025 12:42:10 +0800
Subject: [PATCH] =?UTF-8?q?feat(community):=20=E5=AE=9E=E7=8E=B0=E5=B0=8F?=
 =?UTF-8?q?=E5=8C=BA=E8=AF=A6=E6=83=85=E9=A1=B5=E9=9D=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增获取小区详情的API接口communityDetailReq
- 优化小区详情页面展示逻辑，完善数据回显- 增加小区详情数据加载状态提示与异常处理
- 完善小区列表跳转详情页的参数校验与错误提示
- 调整小区详情页面UI布局与字段展示逻辑
- 优化小区列表页点击事件绑定位置提升交互体验
---
 api/common.js              |  2 ++
 pages/community/detail.vue | 55 +++++++++++++++++++++++++-------------
 pages/community/index.vue  | 29 +++++++++++++++++---
 3 files changed, 63 insertions(+), 23 deletions(-)

diff --git a/api/common.js b/api/common.js
index 58a23a7..3107173 100644
--- a/api/common.js
+++ b/api/common.js
@@ -12,6 +12,8 @@ export const swiperListReq = () => get('/sys/sys-swiper')
 
 export const communityListReq = () => get('/zhsq/zhsq-base-village?withFeeItem=true&withPopulation=true')
 
+export const communityDetailReq = (id) => get(`/zhsq/zhsq-base-village/${id}?withFeeItem=true&withPopulation=true`)
+
 export const roomListReq = params => get('/zhsq/zhsq-base-room', {params})
 
 export const miniRoomListReq = params => get('/zhsq/zhsq-base-room/mini', {params})
diff --git a/pages/community/detail.vue b/pages/community/detail.vue
index fbbfcdf..07a82c0 100644
--- a/pages/community/detail.vue
+++ b/pages/community/detail.vue
@@ -1,15 +1,13 @@
 <template>
   <view class="container">
     <view class="detail-card" v-if="detail">
-      <u-cell-group>
+      <u-cell-group :border="false">
         <u-cell title="小区名称" :value="detail.name"></u-cell>
-        <u-cell title="联系电话" :value="detail.contactPhone || '暂无'"></u-cell>
-        <u-cell title="服务等级" :value="detail.serviceLevel || '暂无'"></u-cell>
-        <u-cell title="物业费单价" :value="detail.propertyFeeUnit ? detail.propertyFeeUnit + '元/㎡' : '暂无'"></u-cell>
-        <u-cell title="地址" :value="detail.address || '暂无'"></u-cell>
-        <u-cell title="简介" :value="detail.intro || '暂无'"></u-cell>
+        <u-cell title="联系电话" :value="detail.contactPhone || detail.tel || '暂无'"></u-cell>
+        <u-cell title="服务等级" :value="[ '一级', '二级', '三级', '四级', '五级' ][detail.level] || detail.serviceLevel || '暂无'"></u-cell>
+        <u-cell title="物业费单价" :value="detail.feeItem || '暂无'"></u-cell>
       </u-cell-group>
-      
+
       <view class="intro-section" v-if="detail.intro">
         <view class="section-title">小区介绍</view>
         <view class="intro-content">
@@ -17,42 +15,61 @@
         </view>
       </view>
     </view>
-    
+
     <u-empty v-else text="加载中..." />
   </view>
 </template>
 
 <script>
-import {communityListReq} from "@/api/common";
+import {communityDetailReq} from "@/api/common";
 
 export default {
   data() {
     return {
       id: null,
-      detail: null,
-      allCommunityList: [] // 缓存所有小区数据
+      detail: null
     }
   },
   methods: {
-    async getCommunityList() {
+    async getCommunityDetail() {
       try {
-        const {data} = await communityListReq()
-        this.allCommunityList = data
-        // 根据ID找到对应的小区详情
-        this.detail = data.find(item => item.id === this.id) || null
+        // 显示加载提示
+        uni.showLoading({
+          title: '加载中...'
+        })
+
+        const {data} = await communityDetailReq(this.id)
+        this.detail = data
+
+        // 添加调试信息
+        console.log('获取到的小区详情:', data)
       } catch (error) {
         console.error('获取小区详情失败:', error)
         uni.showToast({
           title: '获取数据失败',
-          icon: 'none'
+          icon: 'none',
+          duration: 2000
         })
+      } finally {
+        // 隐藏加载提示
+        uni.hideLoading()
       }
     }
   },
   onLoad(options) {
+    console.log('页面加载参数:', options)
     this.id = options.id
+
+    // 检查ID是否存在
     if (this.id) {
-      this.getCommunityList()
+      this.getCommunityDetail()
+    } else {
+      console.error('缺少小区ID参数')
+      uni.showToast({
+        title: '参数错误',
+        icon: 'none',
+        duration: 2000
+      })
     }
   }
 }
@@ -86,4 +103,4 @@ export default {
   background-color: #f9f9f9;
   border-radius: 10rpx;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/community/index.vue b/pages/community/index.vue
index 3b46f16..802708f 100644
--- a/pages/community/index.vue
+++ b/pages/community/index.vue
@@ -12,8 +12,8 @@
           </view>
         </u-list-item>
         <!-- 列表项 -->
-        <u-list-item v-for="(item, index) in list" :key="index" @click="goToDetail(item)">
-          <view class="table-row">
+        <u-list-item v-for="(item, index) in list" :key="index">
+          <view class="table-row" @click="goToDetail(item)">
             <view class="table-cell name-cell">{{ item.name }}</view>
            <view class="table-cell">{{ item.tel || '暂无' }}</view>
             <view class="table-cell">{{ ['一级', '二级', '三级', '四级', '五级'][item.level] || '暂无' }}</view>
@@ -53,9 +53,30 @@ export default {
       }
     },
     goToDetail(item) {
+      console.log('点击详情，item:', item)
+      // 检查item和item.id是否存在
+      if (!item || !item.id) {
+        console.error('缺少小区ID，无法跳转到详情页')
+        uni.showToast({
+          title: '数据异常，无法查看详情',
+          icon: 'none'
+        })
+        return
+      }
+
       // 跳转到详情页，传递小区ID
       uni.navigateTo({
-        url: `/pages/community/detail?id=${item.id}`
+        url: `/pages/community/detail?id=${item.id}`,
+        success: () => {
+          console.log('成功跳转到详情页')
+        },
+        fail: (err) => {
+          console.error('跳转详情页失败:', err)
+          uni.showToast({
+            title: '跳转失败，请重试',
+            icon: 'none'
+          })
+        }
       })
     }
   },
@@ -94,4 +115,4 @@ export default {
 .header-cell {
   color: #333;
 }
-</style>
\ No newline at end of file
+</style>