liukangdong
2024-09-29 b2d360d9113b6955287108ca9e90d76a1f3c1419
admin/src/components/business/OperaShopWindow.vue
@@ -63,6 +63,8 @@
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import { jsonp } from 'vue-jsonp'
export default {
  name: 'OperaShopWindow',
  extends: BaseOpera,
@@ -71,8 +73,8 @@
    return {
      geocoder: null,
      map: [],
      searchValue:'',
      marker:null,
      searchValue: '',
      marker: null,
      // 表单数据
      provinces: [],
      cities: [],
@@ -108,9 +110,22 @@
    })
  },
  methods: {
    searchAddress( ){
      if(this.geocoder && this.searchValue){
        this.geocoder.getLocation(this.searchValue)
    searchAddress () {
      if (  this.searchValue) {
       var that = this
        jsonp('https://apis.map.qq.com/ws/geocoder/v1/', {
          address: this.searchValue,
          key: 'HIDBZ-2QXL4-TAWUD-XET6Q-EKTJE-CCBSQ',
          output: 'jsonp'
        }).then(result => {
          console.log(result)
          if(result.result.location){
            that.changePostion(result.result.location.lng, result.result.location.lat)
          }
        }).catch(error => {
          // 请求失败处理
          console.log(error)
        })
      }
    },
    initMap (lat, long) {
@@ -120,20 +135,20 @@
        center: center,
        zoom: 17
      })
      this.changePostion(long,lat)
      this.changePostion(long, lat)
      qq.maps.event.addListener(this.map, 'click',
        function (event) {
          that.changePostion(event.latLng.lng, event.latLng.lat)
        }
      )
      this.geocoder = new qq.maps.Geocoder()
     /* this.geocoder = new qq.maps.Geocoder()
      this.geocoder.setComplete(function (result) {
        that.changePostion(result.detail.location.lng,result.detail.location.lat)
        that.changePostion(result.detail.location.lng, result.detail.location.lat)
      })
      // 若服务请求失败,则运行以下函数
      this.geocoder.setError(function () {
        console.log('逆解析失败')
      })
      this.geocoder.setError(function (e) {
        console.log(that.searchValue + '=====逆解析失败')
      })*/
    },
    open (title, target) {
      this.title = title
@@ -157,7 +172,7 @@
        const mapContainer = this.$refs.mapContainer // 获取地图容器
        if (mapContainer) {
          // 初始化地图之前检查容器是否存在
          this.initMap(this.form.latitude,this.form.longitude)
          this.initMap(this.form.latitude, this.form.longitude)
          // 初始化腾讯地图
        }
      })
@@ -167,9 +182,12 @@
        .then(res => {
          this.provinces = res
        })
      if (this.form.provinceCode) {
        this.selectProvince(this.form.provinceCode, true)
      }
    },
    // 选择省份
    selectProvince (val) {
    selectProvince (val, isInit) {
      this.provinces.forEach(item => {
        if (item.id == val) {
          this.form.provinceName = item.name
@@ -177,30 +195,36 @@
      })
      this.cities = []
      this.areas = []
      this.form.cityName = ''
      this.form.areaCode = ''
      this.form.cityCode = ''
      this.form.areaName = ''
      if(!val || val ==''){
      if (!isInit) {
        this.form.cityName = ''
        this.form.areaCode = ''
        this.form.cityCode = ''
        this.form.areaName = ''
      }
      if (!val || val == '') {
        return
      }
      this.api.areaList({ pid: val })
        .then(res => {
          this.cities = res
          this.selectCity(this.form.cityId)
          if (isInit) {
            this.selectCity(this.form.cityCode, isInit)
          }
        })
    },
    // 选择城市
    selectCity (val) {
    selectCity (val, isInit) {
      this.cities.forEach(item => {
        if (item.id == val) {
          this.form.cityName = item.name
        }
      })
      this.areas = []
      this.form.areaCode = ''
      this.form.areaName = ''
      if(!val || val ==''){
      if (!isInit) {
        this.form.areaCode = ''
        this.form.areaName = ''
      }
      if (!val || val == '') {
        return
      }
      this.api.areaList({ pid: val })
@@ -215,24 +239,24 @@
        }
      })
    },
    changeMapCenter(){
       this.searchValue = (this.form.provinceName||'')+(this.form.cityName||'')+(this.form.areaName||'')+(this.form.address||'')
    changeMapCenter () {
      this.searchValue = (this.form.provinceName || '') + (this.form.cityName || '') + (this.form.areaName || '') + (this.form.address || '')
      this.searchAddress()
    },
    changePostion (lng, lat) {
      if (lng || lat) {
        this.form.longitude = lng
        this.form.latitude = lat
        if(this.map){
          if(this.marker){
        if (this.map) {
          if (this.marker) {
            this.marker.setMap(null)
          }
          var pos =new qq.maps.LatLng(lat,lng);
          var pos = new qq.maps.LatLng(lat, lng)
          this.map.setCenter(pos)
          this.marker= new qq.maps.Marker({
          this.marker = new qq.maps.Marker({
            position: pos,
            animation:qq.maps.MarkerAnimation.DROP,
            map:this.map
            animation: qq.maps.MarkerAnimation.DROP,
            map: this.map
          })
        }
      }