区域详情优化与图片展示改进

src/api/data.js

@@ -43,6 +43,16 @@ export function getCommunityByDeptId(deptId) {
   })
 }
 /**
+ * 根据小区ID查小区详情
+ * @returns {*}
+ */
+export function getCommunityById(id) {
+  return request({
+    url: '/sooka-digital-construction/community/'+id,
+    method: 'get',
+  })
+}
+/**
  * 根据小区查询用户
  * @returns {*}
  */

src/views/SentryPage.vue

@@ -241,19 +241,26 @@
             <i class="el-icon el-icon-close" style="margin-left: 5%;cursor: pointer;" @click="closeAreaDetail"></i>
           </h1>
           <p>市区：{{ areaDetailInfo.address || '--' }}</p>
-          <p>街道：{{ areaDetailInfo.street || '--' }}</p>
-          <p>社区：{{ areaDetailInfo.community || '--' }}</p>
-          <p>区域名称：{{ areaDetailInfo.communityName || '--' }}</p>
+          <p>街道：{{ areaDetailInfo.streetName || '--' }}</p>
+          <p>社区：{{ areaDetailInfo.communityName || '--' }}</p>
           <p>负责人：{{ areaDetailInfo.principal || '--' }}</p>
           <p>负责人电话：{{ areaDetailInfo.phone || '--' }}</p>
-          <p>户数：{{ areaDetailInfo.houseNum || '--' }}</p>
-          <p>人数：{{ areaDetailInfo.personNum || '--' }}</p>
-          <router-link to="#" v-for="item in areaDetailInfo.imageUrls">
-            <el-image :src="item"
-                      :preview-src-list="assetTypeAnImage(item)"
-                      style="width:6rem; height:6rem;margin: 2px;">
-            </el-image>
-          </router-link>
+          <template v-if="areaDetailInfo.attachPaths && areaDetailInfo.attachPaths.trim()">
+            <router-link to="#"
+                         v-for="(item, index) in areaDetailInfo.attachPaths.split(',')"
+                         :key="index">
+              <el-image :src="item"
+                        :preview-src-list="assetTypeAnImage(item)"
+                        style="width:6rem; height:6rem;margin: 2px;">
+              </el-image>
+            </router-link>
+          </template>
+          <!-- 如果attachPaths为空，显示提示信息 -->
+          <template v-else>
+            <div style="text-align: center; padding: 20px;">
+              暂无图片
+            </div>
+          </template>
         </div>
       </div>
 		</div>
@@ -288,6 +295,7 @@
     import {
       treeselectAll
     } from '@/api/system/dept'
+    import { getCommunityById } from '@/api/data'
   export default {
     name: 'MyChart',
     components: {
@@ -406,8 +414,11 @@
         ];
       },
       openAreaDetails(param){
-        this.isAreaDetailVisible = true;
-        this.areaDetailInfo = param;
+        let that = this;
+        getCommunityById(param.id).then(req => {
+          that.areaDetailInfo = req.data;
+          that.isAreaDetailVisible = true;
+        })
       },
       closeAreaDetail(){
         this.isAreaDetailVisible = false;