派生自 wuyushui/SewerAndRainNetwork

陈泽平
2021-05-30 9532b65e0d5d1bef4508c442721953b21a4768e6
src/components/base-page/enterprise-emergency/events-reported/ReportLocationSearch.vue
@@ -12,6 +12,30 @@
    <el-row v-for="(item,index) in searchList.slice((currentPage-1)*pageSize,currentPage*pageSize)" :key="index"
            style="display: flex;align-items: center;margin: 0.1343rem 15px;text-align: left"
            class="environmental-risk-list">
<!--      <div v-if="item.resultType === 1">-->
        <el-col :span="4">
          <img src="../../../../../public/assets/images/map/marker-icon.png" alt="" class="state"
               style="background: none;margin: 0 15px">
        </el-col>
        <el-col :span="12">
          <div class=search-list>
            <!--                        <h4 :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称:<h3 style="display: inline-block">{{ item.name }}</h3></h4>-->
            <h3 :class="activeNum===index?'hover':''" @click="handleLocation(index)">名称:{{ item.name }}</h3>
            <p style="text-overflow: ellipsis;white-space: nowrap;overflow: hidden">地址:<span>{{ item.address }}</span>
            <p>电话:<span>{{ item.phone }}</span></p>
          </div>
        </el-col>
        <el-col :span="8" style="text-align: right">
          <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(item,index)">
            定位
          </el-button>
        </el-col>
<!--      </div>-->
    </el-row>
    <el-row v-for="(item,index) in searchListStatistics.slice((currentPage-1)*pageSize,currentPage*pageSize)" :key="index"
            style="display: flex;align-items: center;margin: 0.1343rem 15px;text-align: left"
            class="environmental-risk-list">
      <!--      <div v-if="item.resultType === 1">-->
      <el-col :span="4">
        <img src="../../../../../public/assets/images/map/marker-icon.png" alt="" class="state"
             style="background: none;margin: 0 15px">
@@ -29,10 +53,12 @@
          定位
        </el-button>
      </el-col>
      <!--      </div>-->
    </el-row>
    <!--        </el-scrollbar>-->
    <!--        <el-card class="footer-page" >-->
    <div v-if="total > 10">
<!--    <div v-if="item.resultType === 2">-->
<!--      <span>没有数据了</span>-->
<!--    </div>-->
    <div v-if="total > 5">
      <el-pagination
          small
          @current-change="handlePage"
@@ -44,7 +70,6 @@
      >
      </el-pagination>
    </div>
    <!--        </el-card>-->
    <el-row style="text-align: right">
      <el-button type="primary" size="small" @click="confirm">确认</el-button>
    </el-row>
@@ -63,17 +88,21 @@
  data () {
    return {
      activeNum: -1,
      // 点击定位绑定数据
      clickLocation: '',
      searchList: [],
      marker: window.L.layerGroup().addTo(window.map),
      layer: window.L.layerGroup().addTo(window.map),
      layersGroupArrList: [],
      // 分页
      total: 0,
      // 分页 默认展示
      currentPage: 1,
      // 分页 每页多少数据
      pageSize: 3
      pageSize: 3,
      // 定位点展示
      marker: window.L.layerGroup().addTo(window.map),
      layersGroupArrList: [],
      // 点击定位绑定数据
      clickLocation: '',
      // 搜索数据展示列表 1
      searchList: [],
      // 搜索数据展示列表 2
      searchListStatistics: []
    }
  },
  methods: {
@@ -86,14 +115,18 @@
    },
    // 搜索定位
    focusLocation () {
      const getBoundsData = '' + window.map.getBounds()._southWest.lng + ',' + window.map.getBounds()._southWest.lat + ',' + window.map.getBounds()._northEast.lng + ',' + window.map.getBounds()._northEast.lat
      // 每次进行搜索 都对之前数组列表进行置空
      this.searchList = []
      this.total = ''
      // 搜索数据data参数
      const getBoundsData = '' + window.map.getBounds().getSouthWest().lng + ',' + window.map.getBounds().getSouthWest().lat + ',' + window.map.getBounds().getNorthEast().lng + ',' + window.map.getBounds().getNorthEast().lat
      const data = {
        postStr: {
          keyWord: this.clickLocation,
          level: window.map.getZoom(),
          mapBound: getBoundsData,
          queryType: 7,
          count: 14,
          count: 20,
          start: 0,
          queryTerminal: 10000
        },
@@ -101,11 +134,16 @@
      }
      // $http.get('http://10.246.133.164//api/search?', data)
      reportLocationSearch(data).then(res => {
        // console.log(res)
        this.searchList = res.pois
        this.total = res.pois.length
        // this.searchList = res.statistics.priorityCitys
        // this.total = res.statistics.priorityCitys.length
        console.log(res)
        // 返回数据类型 1(普通POI)
        if (res.resultType === 1) {
          this.searchList = res.pois
          this.total = res.pois.length
        } else if (res.resultType === 2) {
          // 返回数据类型 2(统计
          this.searchListStatistics = res.statistics.priorityCitys
          this.total = res.statistics.priorityCitys.length
        }
      })
    },
    // 点击定位