<template>
|
<div class="click-location">
|
<el-row>
|
<el-input type="text" v-model="clickLocation" clearable @change="focusLocation"></el-input>
|
</el-row>
|
<el-row>
|
<el-button type="primary" @click="confirm" style="text-align: right">确认</el-button>
|
</el-row>
|
</div>
|
</template>
|
|
<script>
|
|
import { reportLocationSearch } from '../../../../api/request'
|
import { pulseEffect } from '../../../../utils/utils'
|
export default {
|
name: 'ReportLocationSearch',
|
data () {
|
return {
|
// 点击定位绑定数据
|
clickLocation: ''
|
}
|
},
|
methods: {
|
// 获得焦点 进行定位
|
focusLocation () {
|
// console.log(this.clickLocation)
|
// console.log(window.map.getZoom())
|
// console.log(window.map.getBounds())
|
const getBoundsData = '' + window.map.getBounds()._southWest.lng + ',' + window.map.getBounds()._southWest.lat + ',' + window.map.getBounds()._northEast.lng + ',' + window.map.getBounds()._northEast.lat
|
const data = {
|
postStr: {
|
keyWord: this.clickLocation,
|
level: window.map.getZoom(),
|
mapBound: getBoundsData,
|
queryType: 7,
|
count: 14,
|
start: 0,
|
queryTerminal: 10000
|
},
|
type: 'query'
|
}
|
// console.log(data)
|
reportLocationSearch(data).then(res => {
|
console.log(res)
|
// const as = res.pois[0].lonlat.trim().split(' ')
|
// window.map.setView([as[1], as[0]], 17)
|
// pulseEffect([as[1], as[0]])
|
for (let i = 0; i < res.pois.length; i++) {
|
const as = res.pois[i].lonlat.trim().split(' ')
|
if (res.pois[i].name.indexOf(this.clickLocation) >= 0) {
|
window.map.setView([as[1], as[0]], 17)
|
pulseEffect([as[1], as[0]])
|
}
|
}
|
})
|
},
|
// 点击确认按钮事件
|
confirm () {
|
// 通过子组件向父组件传递数据
|
this.$emit('locationClick', this.LongLatPos)
|
console.log('搜索定位')
|
}
|
}
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.click-location {
|
margin: 0 auto;
|
text-align: center;
|
|
.el-input {
|
width: 80%;
|
margin: 15px auto;
|
}
|
|
.el-button {
|
margin: 15px auto;
|
}
|
}
|
</style>
|
