feat(map): 添加楼栋人数统计功能

linwei

2026-06-10 98091511a4fa958ae8d6c243fba27cc9f9bcb62d

feat(map): 添加楼栋人数统计功能

- 在地图组件中新增楼栋人数统计按钮和弹窗界面
- 实现楼栋人数统计API接口调用功能
- 添加街道和社区筛选功能支持精确查询
- 集成分页功能支持大数据量展示
- 更新样式文件适配响应式布局设计
- 修改配置文件更新内网QX服务地址
- 调整地图界面按钮布局和定位样式
- 优化场所详情框搜索和筛选功能
- 完善页面缩放和全屏模式下的按钮定位

 public/static/config.js

@@ -24,7 +24,7 @@
  // 内网部署
  VUE_APP_INTRANET_SEARCH: 'http://47.212.32.93:9004/ga',

  VUE_APP_INTRANET_QX: 'http://47.212.32.95:12210/',
  VUE_APP_INTRANET_QX: 'http://47.212.37.25:12210/',

  // 视频监控平台
  // 本地开发

 src/api/dept/index.js

@@ -319,6 +319,17 @@
  })
}

// 楼栋人数统计
export const getBuildingPersonStatistic = (params) => {
  return request({
    url: `/api/villagePersonInfo/villagePersonInfo/getBuildingPersonStatistic`,
    method: 'get',
    params: {
      ...params
    }
  })
}

// 户籍人口、重点人口信息
export const getVillagePersonInfo = (resBusId, buildId, status, current, realName, phone) => {
  return request({

 src/components/map/index.vue

@@ -25,6 +25,12 @@
      </el-tooltip>
    </div>

      <div class="home-person-btn">
         <el-tooltip content="楼栋人数" placement="top" effect="dark">
           <i class="el-icon-s-home" style="vertical-align: middle; cursor: pointer" @click.stop="showBuildingPersonBtn = !showBuildingPersonBtn"></i>
       </el-tooltip>
    </div>

    <div class="over-look-btn">
      <el-tooltip content="一键俯视" placement="top" effect="dark">
        <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
@@ -43,6 +49,43 @@
        <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="switchShowHomeContent"></i>
      </el-tooltip>
    </div>
     <div class="building-person-list" v-show="showBuildingPersonBtn" @click.stop>
        <div class="building-person-header">
          <span>楼栋人数统计</span>
          <div class="close" @click.stop="showBuildingPersonBtn = false; buildingPersonCurrentPage = 1">
            <i class="el-icon-close"></i>
          </div>
        </div>
        <div class="building-person-search">
          <el-select v-model="buildingPersonSearchTown" placeholder="请选择街道" size="mini" clearable @change="handleTownChange" style="width: 160px; margin-right: 8px;">
            <el-option v-for="item in townList" :key="item.id" :label="item.name" :value="item.name"></el-option>
          </el-select>
          <el-select v-model="buildingPersonSearchCommunity" placeholder="请选择社区" size="mini" clearable style="width: 160px; margin-right: 8px;">
            <el-option v-for="item in communityList" :key="item.id" :label="item.name" :value="item.name"></el-option>
          </el-select>
          <el-input v-model="buildingPersonSearchName" placeholder="请输入小区名称" size="mini" clearable @keyup.enter.native="searchBuildingPerson" style="width: 200px;"></el-input>
          <el-button type="primary" size="mini" @click="searchBuildingPerson">查询</el-button>
        </div>
        <div class="building-person-content" v-loading="buildingPersonLoading" element-loading-background="rgba(0,0,0,0)">
          <el-table :data="buildingPersonList" style="width: 100%" size="mini">
            <el-table-column prop="town" label="街道" min-width="80" show-overflow-tooltip></el-table-column>
            <el-table-column prop="community" label="社区" min-width="80" show-overflow-tooltip></el-table-column>
            <el-table-column prop="aoiName" label="小区名称" min-width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="buildName" label="楼栋名称" min-width="80" show-overflow-tooltip></el-table-column>
            <el-table-column prop="personCount" label="人数" width="80" align="center"></el-table-column>
          </el-table>
        </div>
        <div class="building-person-pagination">
          <el-pagination
            small
            layout="total, prev, pager, next"
            :total="buildingPersonTotal"
            :page-size="buildingPersonPageSize"
            :current-page.sync="buildingPersonCurrentPage"
            @current-change="handleBuildingPersonPageChange">
          </el-pagination>
        </div>
      </div>
    <!-- 切换矢量图按钮 -->
    <div class="image-switch-icon-btn">
      <el-tooltip content="图层、模型、视角" placement="top" effect="dark">
@@ -50,6 +93,7 @@
          <img src="/img/base_map.png" alt />
        </div>
      </el-tooltip>
      

      <div class="image-switch-img-btn" v-show="showImgBtn" @click.stop>
        <div class="layer-change-box">
@@ -85,6 +129,8 @@
          <el-checkbox v-model="angleCheck" @change="angleChange"></el-checkbox>
        </div>
      </div>

     
    </div>

    <map-popup></map-popup>
@@ -194,7 +240,8 @@
import { mapGetters } from "vuex"
import { getLineSpeed } from "@/utils/turfPolygon"
import {
  get3dTiles
  get3dTiles,
  getBuildingPersonStatistic
} from "@/api/dept/index.js"
export default {
  name: "mapBox",
@@ -228,6 +275,51 @@
      videoTotal: 0,
      carTotal: 0,
      showImgBtn: false,
      showBuildingPersonBtn: false,
      buildingPersonLoading: false,
      buildingPersonList: [],
      buildingPersonTotal: 0,
      buildingPersonCurrentPage: 1,
      buildingPersonPageSize: 10,
      buildingPersonSearchName: '',
      buildingPersonSearchTown: '',
      buildingPersonSearchCommunity: '',
      // 街道列表（静态数据）
      townList: [
        { id: 'xingyuan', name: '兴园街道' },
        { id: 'dongtuan', name: '董团乡' }
      ],
      // 社区列表（根据街道动态变化）
      communityList: [],
      // 社区映射数据（静态数据）
      communityMap: {
        '兴园街道': [
          { id: 'sujiacun', name: '苏家村' },
          { id: 'longmen', name: '龙门村' },
          { id: 'wuyi', name: '武夷社区' },
          { id: 'huangyuan', name: '黄源社区' },
          { id: 'lingchuang', name: '领创社区' },
          { id: 'fenghuang', name: '凤凰社区' },
          { id: 'binhe', name: '滨河社区' },
          { id: 'xinke', name: '新科社区' },
          { id: 'bincheng', name: '滨城社区' },
          { id: 'banqiao', name: '板桥村' },
          { id: 'qianshan', name: '前山社区' }
        ],
        '董团乡': [
          { id: 'dongtuan', name: '董团村' },
          { id: 'xianshan', name: '仙山村' },
          { id: 'taiping', name: '太平村' },
          { id: 'wuzhou', name: '吴洲村' },
          { id: 'zhongwei', name: '中魏村' },
          { id: 'zhonglu', name: '中路村' },
          { id: 'dadi', name: '大地村' },
          { id: 'lianxing', name: '联星村' },
          { id: 'lianhe', name: '联合村' },
          { id: 'liansheng', name: '联胜村' },
          { id: 'hongshi', name: '红石村' }
        ]
      },
      imgtype: 0,
      tilesetLayerType: "",
      angleCheck: true,
@@ -702,7 +794,85 @@
    })
  },

  watch: {
    showBuildingPersonBtn (newVal) {
      if (newVal && this.buildingPersonList.length === 0) {
        this.fetchBuildingPersonStatistic()
      }
    }
  },

  methods: {
    /**
     * @description: 获取楼栋人数统计数据
     * @return {void}
     */
    fetchBuildingPersonStatistic () {
      this.buildingPersonLoading = true
      const params = {
        current: this.buildingPersonCurrentPage,
        size: this.buildingPersonPageSize
      }
      // 添加街道参数
      if (this.buildingPersonSearchTown) {
        params.town = this.buildingPersonSearchTown
      }
      // 添加社区参数
      if (this.buildingPersonSearchCommunity) {
        params.community = this.buildingPersonSearchCommunity
      }
      // 添加小区名称参数
      if (this.buildingPersonSearchName) {
        params.aoiName = this.buildingPersonSearchName
      }
      getBuildingPersonStatistic(params).then(res => {
        if (res.data && res.data.data) {
          this.buildingPersonList = res.data.data.records || res.data.data
          this.buildingPersonTotal = res.data.data.total || 0
        }
      }).catch(err => {
        console.error('获取楼栋人数统计失败:', err)
      }).finally(() => {
        this.buildingPersonLoading = false
      })
    },

    /**
     * @description: 街道选择变化时获取社区列表
     * @param {string} townName - 选中的街道名称
     * @return {void}
     */
    handleTownChange (townName) {
      // 步骤1: 清空社区选择
      this.buildingPersonSearchCommunity = ''
      // 步骤2: 如果街道被清空，清空社区列表
      if (!townName) {
        this.communityList = []
        return
      }
      // 步骤3: 根据选中的街道名称从静态数据中获取社区列表
      this.communityList = this.communityMap[townName] || []
    },

    /**
     * @description: 搜索楼栋人数
     * @return {void}
     */
    searchBuildingPerson () {
      this.buildingPersonCurrentPage = 1
      this.fetchBuildingPersonStatistic()
    },

    /**
     * @description: 分页改变事件
     * @param {number} page - 当前页码
     * @return {void}
     */
    handleBuildingPersonPageChange (page) {
      this.buildingPersonCurrentPage = page
      this.fetchBuildingPersonStatistic()
    },

    /**
      * @description: 获取3D模型列表数据
      * @param {Object} params - 请求参数
@@ -734,7 +904,7 @@
          }
        })
        // 发起请求
        // const response = await this.$http.get('http://47.212.32.95:12210/shangrao-3d-upload/model/list', {
        // const response = await this.$http.get('http://47.212.37.25:12210/shangrao-3d-upload/model/list', {
        //   params: requestParams
        // })

@@ -1033,6 +1203,7 @@
          .querySelector(".dc-container .dc-zoom-controller")
          .classList.add("homebottom")
        document.querySelector(".screen-full-btn").classList.add("homebottom")
        document.querySelector(".home-person-btn").classList.add("homebottom")
        document.querySelector(".over-look-btn").classList.add("homebottom")
        document.querySelector(".compass-btn").classList.add("homebottom")
        document
@@ -1046,6 +1217,8 @@
        document
          .querySelector(".screen-full-btn")
          .classList.remove("homebottom")
        document.querySelector(".home-person-btn").classList.remove("homebottom")

        document.querySelector(".over-look-btn").classList.remove("homebottom")
        document.querySelector(".compass-btn").classList.remove("homebottom")
        document

 src/styles/dc/index.scss

@@ -55,6 +55,33 @@
    bottom: 362px !important;
}

.home-person-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 10px;
    bottom: 300px;
    width: 36px;
    height: 36px;
    font-size: 20px;
    color: #fff;
    background: #fff;
    border-radius: 5px;
    z-index: 97;
    background-color: $bg-color !important;
}

.home-person-btn.homebottom {
    left: 402px !important;
    bottom: 620px;
}

.home-person-btn.shrink-btn {
    left: 410px !important;
}


.over-look-btn {
    display: flex;
    align-items: center;
@@ -149,13 +176,13 @@

.image-switch-icon-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 10px;
    bottom: 178px;
    bottom: 280px;
    width: 36px;
    height: 36px;
    font-size: 20px;

    color: #fff;
@@ -171,8 +198,8 @@
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        width: 36px;
        height: 36px;
        background-color: $bg-color !important;
        border-radius: 5px;
    }
@@ -249,4 +276,122 @@
    .high {
        background-image: url(/img/mx.png);
    }
}

.building-person-btn {
    margin-top: 10px;
    margin-bottom: 0;
}

.building-person-list {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 740px;
    max-height: 580px;
    min-height: 580px;
    background: $bg-color;
    border-radius: 5px;
    z-index: 97;
    overflow: hidden;

    .building-person-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 15px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        font-size: 16px;
        font-weight: bold;
        color: #fff;

        .close {
            cursor: pointer;
            font-size: 18px;
            color: #aaa;

            &:hover {
                color: #fff;
            }
        }
    }

    .building-person-search {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 15px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);

        .el-input__inner {
            background: rgba(255, 255, 255, 0.1);
            border-color: rgba(255, 255, 255, 0.2);
            color: #fff;

            &::placeholder {
                color: rgba(255, 255, 255, 0.5);
            }
        }
    }

    .building-person-pagination {
        display: flex;
        justify-content: center;
        padding: 10px 15px;
        border-top: 1px solid rgba(255, 255, 255, 0.1);

        .el-pagination {
            .el-pagination__total,
            .el-pagination__jump {
                color: #fff;
            }

            .btn-prev,
            .btn-next,
            .el-pager li {
                background: transparent;
                color: #fff;

                &.active {
                    color: #409eff;
                }

                &:hover {
                    color: #409eff;
                }
            }
        }
    }

    .building-person-content {
        padding: 10px;
        max-height: 540px !important;
        overflow-y: auto;

        .el-table {
            background: transparent;

            th {
                background: rgba(32, 60, 96, 0.8) !important;
                color: #fff;
            }

            td {
                color: #fff;
            }

            .el-table__row {
                background: transparent;

                &:hover > td {
                    background: rgba(255, 255, 255, 0.05) !important;
                }
            }

            &::before {
                background-color: transparent;
            }
        }
    }
}

 src/styles/media/index.scss

@@ -2541,6 +2541,25 @@
                    left: countSizeVw(400, 1920);
                }

                .home-person-btn.homebottom {
                    left: countSizeVw(402, 1920) !important;
                    bottom: calc((100% - maxCountSizeVh(120)) / 3 + countSizeVh(310));
                }

                .home-person-btn.shrink-btn {
                    left: countSizeVw(410, 1920) !important;
                    bottom: countSizeVh(308);
                }

                // 地图，控制按钮
                .home-person-btn {
                    left: countSizeVh(10);
                    bottom: countSizeVh(308);
                    width: countSizeVh(36);
                    height: countSizeVh(36);
                    font-size: countSizeVh(20);
                }

                .over-look-btn.homebottom {
                    left: countSizeVw(402, 1920) !important;
                    bottom: calc((100% - maxCountSizeVh(120)) / 3 + countSizeVh(222));
@@ -2725,6 +2744,38 @@
                            }
                        }

                    }
                }

                .building-person-list {
                    width:  countSizeVw(740, 1920) !important;
                    height: countSizeVh(580) !important;
                    border-radius: countSizeVh(5);

                    .building-person-header {
                        padding: countSizeVh(12) countSizeVw(15, 1920);
                        border-bottom: countSizeVh(1) solid rgba(255, 255, 255, 0.1);
                        font-size: countSizeVh(16);

                        .close {
                            font-size: countSizeVh(18);
                        }
                    }

                    .building-person-search {
                        gap: countSizeVw(10, 1920);
                        padding: countSizeVh(10) countSizeVw(15, 1920);
                        border-bottom: countSizeVh(1) solid rgba(255, 255, 255, 0.1);
                    }

                    .building-person-pagination {
                        padding: countSizeVh(10) countSizeVw(15, 1920);
                        border-top: countSizeVh(1) solid rgba(255, 255, 255, 0.1);
                    }

                    .building-person-content {
                        padding: countSizeVh(10) countSizeVw(15, 1920);
                        max-height: countSizeVh(540) !important;
                    }
                }

@@ -2973,7 +3024,7 @@

                    .el-select {
                        display: flex;
                    align-items: center;
                        align-items: center;
                        height: countSizeVh(32);
                        box-sizing: border-box;

@@ -2983,27 +3034,27 @@
                                color: #fff;
                            }
                        }
                        

                    .el-input {
                             display: flex;
                    align-items: center;

                     &>input {
                        height: countSizeVh(32) !important;
                        font-size: countSizeVh(12);
                        text-indent: 1em;
                        color: #ffffff;
                        background-color: rgba(24, 79, 202, 0.6);
                        border: 1px solid rgb(0, 92, 169);
                        border-radius: countSizeVh(5);
                    }
                        .el-input {
                            display: flex;
                            align-items: center;

                    .el-input__suffix {
                         display: flex;
                    align-items: center;
                    }
                    }
                            &>input {
                                height: countSizeVh(32) !important;
                                font-size: countSizeVh(12);
                                text-indent: 1em;
                                color: #ffffff;
                                background-color: rgba(24, 79, 202, 0.6);
                                border: 1px solid rgb(0, 92, 169);
                                border-radius: countSizeVh(5);
                            }

                            .el-input__suffix {
                                display: flex;
                                align-items: center;
                            }
                        }
                    }

                    &>input {
@@ -3017,12 +3068,11 @@
                        border-radius: countSizeVh(5);
                    }

                     &>input:focus {
                    &>input:focus {
                        outline: none;
                    }

                     &>input::-webkit-input-placeholder
                     {
                    &>input::-webkit-input-placeholder {
                        color: rgba(238, 238, 238, 0.7);
                    }
                }

 src/views/home/components/dialog/otherPlaceDetailsBox.vue

@@ -4,30 +4,24 @@
      :modal-append-to-body="false" :close-on-click-modal="false" class="land-details-box">
      <div class="header">
        <div>
          场所名称：
          <input type="text" v-model="placeName" placeholder="请输入场所名称" />
          场所名称2：
          <input type="text" v-model="placeName" clearable placeholder="请输入场所名称" />
        </div>
        <div>
          场所负责人：
          <input type="text" v-model="principal" placeholder="请输入场所负责人" />
          <input type="text" v-model="principal" clearable placeholder="请输入场所负责人" />
        </div>

        <!-- <div>
          所属责任区： <el-select v-model="areaName" placeholder="请选择所属责任区" clearable filterable>
            <el-option v-for="area in areaOptions" :key="area" :label="area" :value="area">
        <!-- 场所类型 下来选择 -->
        <div>
          场所类型：
          <el-select v-model="smallCategory" placeholder="请选择场所类型" clearable collapse-tags filterable @change="handlesmallCategoryChange">
            <el-option v-for="type in filteredSmallCategoryOptions" :key="type.value" :label="type.label" :value="type.value">
            </el-option>
          </el-select>
        </div> -->
        <!-- <div>
          所属派出所：
          <el-select v-model="policeStationName" clearable filterable  placeholder="请输入所属派出所">
            <el-option label="兴园派出所" value="兴园派出所"></el-option>
            <el-option label="董团派出所" value="董团派出所"></el-option>
          </el-select>
        </div> -->
        </div>
        <div>
          所属派出所：
          <el-select v-model="community" placeholder="请选择所属派出所" clearable  collapse-tags  filterable>
          <el-select v-model="community" placeholder="请选择所属派出所" clearable collapse-tags filterable>
            <el-option v-for="street in streetOptions" :key="street.value" :label="street.label" :value="street.value">
            </el-option>
          </el-select>
@@ -41,12 +35,12 @@
          </el-select>
        </div>
        <div>
          民警名称： <el-select v-model="policeName" placeholder="请选择民警名称" clearable filterable collapse-tags  multiple>
          民警名称： <el-select v-model="policeName" placeholder="请选择民警名称" clearable filterable collapse-tags multiple>
            <el-option v-for="area in nameOptions" :key="area" :label="area" :value="area">
            </el-option>
          </el-select>
        </div>
        <el-button type="primary" icon="el-icon-search" @click="getNinePage">搜索</el-button>
        <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button type="primary" icon="el-icon-delete" @click="clearSearchValue">清空</el-button>
      </div>
      <div v-loading="curLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
@@ -56,10 +50,10 @@
          'background-color': '#203c60',
          borderColor: '#324e75',
        }" :cell-style="{
  'text-align': 'center',
  borderColor: '#324e75',
  cursor: 'default',
}">
          'text-align': 'center',
          borderColor: '#324e75',
          cursor: 'default',
        }">
          <template slot="empty">
            <div>{{ landEmptyText }}</div>
          </template>
@@ -95,7 +89,7 @@
                @click="rowClick(scope.row)">
                <i class="el-icon-location" :style="{ color: positionColor(scope.row) }"></i>
              </el-button>
           

            </template>
          </el-table-column>
        </el-table>
@@ -117,11 +111,12 @@
export default {
  props: ["policeStaionID"],

  data () {
  data() {
    return {
      type: null,
      isDanger: null,
      placeName: "",
      smallCategory: "",
      areaName: [],
      policeName: [],
      typeOptions: [],
@@ -132,12 +127,60 @@
      curLoading: false,
      landEmptyText: "",
      visible: false,
      title: "“九+N”小场所列表",
      title: "九+N小场所列表",
      callPhone: "",
      pages: {
        total: 0,
        pageSize: 12,
        current: 1,
      },
      // 场所类型子类映射（根据大类显示对应的子类）
      smallCategoryMap: {
        '其他行业': [
          { label: '其他行业', value: '其他行业' },
          { label: '制造业', value: '制造业' },
          { label: '建筑业', value: '建筑业' },
          { label: '餐饮业', value: '餐饮业' }
        ],
        '内保单位': [
          { label: '其他内保单位', value: '其他内保单位' }
        ],
        '危险物品场所': [
          { label: '剧毒物品', value: '剧毒物品' },
          { label: '易制爆', value: '易制爆' }
        ],
        '娱乐场所': [
          { label: 'KTV', value: 'KTV' },
          { label: '桑拿足浴按摩', value: '桑拿足浴按摩' },
          { label: '游戏厅', value: '游戏厅' },
          { label: '网吧', value: '网吧' }
        ],
        '宗教场所': [
          { label: '基督教', value: '基督教' },
          { label: '道教', value: '道教' }
        ],
        '特种行业': [
          { label: '典当拍卖', value: '典当拍卖' },
          { label: '寄卖业', value: '寄卖业' },
          { label: '旅社', value: '旅社' },
          { label: '机动车修理', value: '机动车修理' },
          { label: '特种行业', value: '特种行业' },
          { label: '金属收购', value: '金属收购' }
        ],
        '重点管制场所': [
          { label: '二手车交易场所', value: '二手车交易场所' }
        ],
        '重点要害单位': [
          { label: '加气站', value: '加气站' },
          { label: '加油站', value: '加油站' },
          { label: '医疗机构', value: '医疗机构' },
          { label: '政府机构', value: '政府机构' },
          { label: '教育机构', value: '教育机构' },
          { label: '金融单位', value: '金融单位' }
        ],
        '九小场所': [
          { label: '九小场所', value: '九小场所' }
        ]
      },
      nineType: "",
      areaId: null,
@@ -191,7 +234,7 @@
  },
  watch: {
    community: {
      handler (newVal) {
      handler(newVal) {
        // 当街道选择变化时，更新责任区选项
        if (newVal && newVal.length > 0) {
          // 获取当前选择的街道下的所有村庄
@@ -212,8 +255,15 @@
    }
  },
  computed: {
    // 根据title动态获取场所类型子类选项
    filteredSmallCategoryOptions() {
      // 步骤1: 根据title从映射中获取对应的子类列表
      const options = this.smallCategoryMap[this.title] || []
      // 步骤2: 如果没有匹配的title，返回空数组
      return options
    },
    // 获取当前选择的街道下的村庄选项
    filteredVillageOptions () {
    filteredVillageOptions() {
      if (!this.community || this.community.length === 0) {
        return this.villageOptions
      }
@@ -222,7 +272,7 @@
        this.community.includes(village.parent)
      )
    },
    positionColor () {
    positionColor() {
      return (row) => {
        if (
          (row.X && row.X != 0) ||
@@ -237,7 +287,7 @@
      }
    },

    positionDisabled () {
    positionDisabled() {
      return (row) => {
        if (
          (row.X && row.X != 0) ||
@@ -254,7 +304,7 @@
  },
  methods: {
    // 判断是否应该显示营业状态
    shouldShowBusinessStatus (mediumCategory) {
    shouldShowBusinessStatus(mediumCategory) {
      // 根据mediumCategory判断是否显示营业状态
      // 这里可以根据实际业务需求调整判断条件
      const showBusinessStatusCategories = ['宗教场所']
@@ -262,7 +312,7 @@
    },

    // 获取列标题
    getColumnLabel () {
    getColumnLabel() {
      // 可以根据实际需求调整判断逻辑
      // 方法1: 根据第一条数据判断
      if (this.tableData.length > 0) {
@@ -274,7 +324,7 @@
    },

    // 点击定位
    rowClick (row) {
    rowClick(row) {
      this.landBeforeClose()

      // let lng = global.DC.CoordTransform.GCJ02ToWGS84(row.lng, row.lat)[0]
@@ -319,7 +369,7 @@
      })
    },

    siteClick (e) {
    siteClick(e) {
      let row = e.overlay.attrParams

      this.$store.commit('SET_PLACEBASEPOPUP', true)
@@ -346,7 +396,7 @@
    // },

    // 清空按钮-清除图标图层
    clearRow () {
    clearRow() {
      this.isDanger = null
      this.placeName = null
      this.areaName = []
@@ -363,7 +413,7 @@
      this.getNinePage()
    },
    // 切换登记类型
    typeChange (item) {
    typeChange(item) {
      this.pages.current = 1
      this.getNinePage()
    },
@@ -375,7 +425,7 @@
     * @param {*} value 类型参数
     * @return {*}
     */
    showplacedetail (type, name, value, areaId) {
    showplacedetail(type, name, value, areaId) {
      this.type = type
      this.areaId = areaId
      this.visible = true
@@ -385,14 +435,31 @@
      // 获取九小场所隐患数量统计
      this.getNinePage()
    },
    search() {
      this.pages.current = 1
      this.getNinePage()
    },

    getNinePage () {
    /**
     * @description: 场所类型选择变化时触发搜索
     * @param {string} value - 选中的场所类型
     * @return {void}
     */
    handlesmallCategoryChange(value) {
      // 步骤1: 重置页码为第一页
      this.pages.current = 1
      // 步骤2: 触发搜索查询
      this.getNinePage()
    },

    getNinePage() {
      this.curLoading = true
      getNinePage({
        current: this.pages.current,
        size: this.pages.pageSize,
        mediumCategory: this.poiCode,
        placeName: this.placeName,
        smallCategory: this.smallCategory,
        areaName: this.areaName.join(","),
        policeName: this.policeName.join(","),
        principal: this.principal,
@@ -420,14 +487,15 @@
     * @description: 九小场所列表弹窗中搜索
     * @return {*}
     */
    searchCurent () {
    searchCurent() {
      this.landPage.current = 1
      this.getNinePage()
    },

    clearSearchValue () {
    clearSearchValue() {
      // this.isDanger = null;
      this.placeName = null
      this.smallCategory = null
      this.areaName = []
      this.policeName = []
      this.principal = null
@@ -442,15 +510,16 @@
     * @param {*} currentPage 当前页数
     * @return {*}
     */
    handleCurrentChange (currentPage) {
    handleCurrentChange(currentPage) {
      this.pages.current = currentPage
      this.getNinePage()
    },
    landBeforeClose () {
    landBeforeClose() {
      this.clearSearchValue()
      this.visible = false
    },
  },
  destroyed () {
  destroyed() {
    this.$store.commit('SET_PLACEBASEPOPUP', false)
  }
}

 src/views/home/components/dialog/placeDetailsBox.vue

@@ -47,7 +47,7 @@
            </el-option>
          </el-select>
        </div>
        <el-button type="primary" icon="el-icon-search" @click="getNinePage">搜索</el-button>
        <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button type="primary" icon="el-icon-delete" @click="clearSearchValue">清空</el-button>
      </div>
      <div v-loading="curLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
@@ -440,6 +440,10 @@
        }
      })
    },
    search () {
      this.pages.current = 1
      this.getNinePage()
    },
    getNinePage () {
      this.curLoading = true
      getNinePage({

 src/views/home/index.vue

@@ -1005,6 +1005,7 @@
      document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
      // document.querySelector('.dc-container .dc-location-bar').classList.add('homebottom')
      document.querySelector('.screen-full-btn').classList.add('homebottom')
      document.querySelector('.home-person-btn').classList.add('homebottom')
      document.querySelector('.over-look-btn').classList.add('homebottom')
      document.querySelector('.compass-btn').classList.add('homebottom')
      document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
@@ -2872,6 +2873,7 @@
        // if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
        document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
        document.querySelector('.screen-full-btn').classList.add('homebottom')
        document.querySelector('.home-person-btn').classList.add('homebottom')
        document.querySelector('.over-look-btn').classList.add('homebottom')
        document.querySelector('.compass-btn').classList.add('homebottom')
        document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
@@ -2993,6 +2995,7 @@
    document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom')
    // document.querySelector('.dc-container .dc-location-bar').classList.remove('homebottom')
    document.querySelector('.screen-full-btn').classList.remove('homebottom')
    document.querySelector('.home-person-btn').classList.remove('homebottom')
    document.querySelector('.over-look-btn').classList.remove('homebottom')
    document.querySelector('.compass-btn').classList.remove('homebottom')
    document.querySelector('.image-switch-icon-btn').classList.remove('iconbottom')

 src/views/layout/index.vue

@@ -332,6 +332,7 @@
          // if (document.querySelector('.dc-container .dc-zoom-controller') == null) return
          document.querySelector('.dc-container .dc-zoom-controller').classList.remove('shrink-btn')
          document.querySelector('.screen-full-btn').classList.remove('shrink-btn')
          document.querySelector('.home-person-btn').classList.remove('shrink-btn')
          document.querySelector('.over-look-btn').classList.remove('shrink-btn')
          document.querySelector('.compass-btn').classList.remove('shrink-btn')
          document.querySelector('.image-switch-icon-btn').classList.remove('shrink-btn')
@@ -444,6 +445,7 @@
        // if (document.querySelector('.dc-container .dc-zoom-controller') == null) return
        document.querySelector('.dc-container .dc-zoom-controller').classList.add('shrink-btn')
        document.querySelector('.screen-full-btn').classList.add('shrink-btn')
        document.querySelector('.home-person-btn').classList.add('shrink-btn')
        document.querySelector('.over-look-btn').classList.add('shrink-btn')
        document.querySelector('.compass-btn').classList.add('shrink-btn')
        document.querySelector('.image-switch-icon-btn').classList.add('shrink-btn')
@@ -451,6 +453,7 @@
        // if (document.querySelector('.dc-container .dc-zoom-controller') == null) return
        document.querySelector('.dc-container .dc-zoom-controller').classList.remove('shrink-btn')
        document.querySelector('.screen-full-btn').classList.remove('shrink-btn')
        document.querySelector('.home-person-btn').classList.remove('shrink-btn')
        document.querySelector('.over-look-btn').classList.remove('shrink-btn')
        document.querySelector('.compass-btn').classList.remove('shrink-btn')
        document.querySelector('.image-switch-icon-btn').classList.remove('shrink-btn')
@@ -469,6 +472,7 @@
          // if (document.querySelector('.dc-container .dc-zoom-controller') == null) return
          document.querySelector('.dc-container .dc-zoom-controller').classList.add('shrink-btn')
          document.querySelector('.screen-full-btn').classList.add('shrink-btn')
          document.querySelector('.home-person-btn').classList.add('shrink-btn')
          document.querySelector('.over-look-btn').classList.add('shrink-btn')
          document.querySelector('.compass-btn').classList.add('shrink-btn')
          document.querySelector('.image-switch-icon-btn').classList.add('shrink-btn')
@@ -476,6 +480,7 @@
          // if (document.querySelector('.dc-container .dc-zoom-controller') == null) return
          document.querySelector('.dc-container .dc-zoom-controller').classList.remove('shrink-btn')
          document.querySelector('.screen-full-btn').classList.remove('shrink-btn')
          document.querySelector('.home-person-btn').classList.remove('shrink-btn')
          document.querySelector('.over-look-btn').classList.remove('shrink-btn')
          document.querySelector('.compass-btn').classList.remove('shrink-btn')
          document.querySelector('.image-switch-icon-btn').classList.remove('shrink-btn')