<template>
  <view class="wk-field wk-field-adderss" @click.stop="chooseLocation">
    <view v-if="_label" class="wk-field__label">
      <view v-if="field.isNull === 1" class="line" />
      {{ _label }}
    </view>
    <view class="wk-field__body">
      <view class="wk-field__body-core">
        {{ valueStr }}
      </view>
      <image :src="$static('images/icon/address.png')" class="icon-pic" />
    </view>
  </view>
</template>

<script>
  import {
    bMapTransQQMap,
    qqMapTransBMap
  } from '@/utils/map.js'
  import mixins from './mixins'
	
  export default {
    name: 'WkFieldAddress',
    mixins: [mixins],
    data() {
      return {
      }
    },
    computed: {
      valueStr() {
        if (!this.formValue) return ''
        const obj = this.formValue
        const areaStr = (obj.address || '').replace(/,/g, '')
        return (obj.detailAddress || '').startsWith(areaStr) ? (obj.detailAddress || '') : (areaStr + obj.detailAddress || '')
      }
    },
    methods: {
      chooseLocation() {
        let query = {}
        if (this.formValue.lng && this.formValue.lat) {
          const point = bMapTransQQMap(this.formValue.lng, this.formValue.lat)
          query = bMapTransQQMap(this.formValue.lng, this.formValue.lat)
        }
				
        uni.$once('choose-location', this.selectedLocation)
        this.$Router.navigateTo({
          url: '/pages_common/map/chooseLocation',
          query
        })
      },
			
      selectedLocation(data) {
        console.log('选择:', data)
				
        if (!this.$isEmpty(data)) {
          // >> 高德地图
          // const area = `${data.pname || ''},${data.cityname || ''},${data.adname || ''}`
					
          // >> 腾讯地图
          if (!data.ad_info) data.ad_info = {}
          const area = `${data.ad_info.province || ''},${data.ad_info.city || ''},${data.ad_info.district || ''}`
					
          const addr = `${data.address || ''}${data.name || ''}`
          const point = qqMapTransBMap(data.longitude, data.latitude)
          this.formValue = {
            address: area,
            detailAddress: addr,
            lat: point.latitude,
            lng: point.longitude,
            location: addr
          }
        } else {
          this.formValue = {
            address: '',
            detailAddress: '',
            lat: '',
            lng: '',
            location: ''
          }
        }
				
        this.$emit('input', this.formValue)
        this.$emit('change', {
          index: this.index,
          field: this.field,
          value: this.formValue
        })
      }
    }
  }
</script>

<style scoped lang="scss">
	@import './wkField.scss';
	
	.icon-pic {
		width: 32rpx;
		height: 32rpx;
	}
</style>
