wk-field-address.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <template>
  2. <view class="wk-field wk-field-adderss" @click.stop="chooseLocation">
  3. <view v-if="_label" class="wk-field__label">
  4. <view v-if="field.isNull === 1" class="line" />
  5. {{ _label }}
  6. </view>
  7. <view class="wk-field__body">
  8. <view class="wk-field__body-core">
  9. {{ valueStr }}
  10. </view>
  11. <image :src="$static('images/icon/address.png')" class="icon-pic" />
  12. </view>
  13. </view>
  14. </template>
  15. <script>
  16. import {
  17. bMapTransQQMap,
  18. qqMapTransBMap
  19. } from '@/utils/map.js'
  20. import mixins from './mixins'
  21. export default {
  22. name: 'WkFieldAddress',
  23. mixins: [mixins],
  24. data() {
  25. return {
  26. }
  27. },
  28. computed: {
  29. valueStr() {
  30. if (!this.formValue) return ''
  31. const obj = this.formValue
  32. const areaStr = (obj.address || '').replace(/,/g, '')
  33. return (obj.detailAddress || '').startsWith(areaStr) ? (obj.detailAddress || '') : (areaStr + obj.detailAddress || '')
  34. }
  35. },
  36. methods: {
  37. chooseLocation() {
  38. let query = {}
  39. if (this.formValue.lng && this.formValue.lat) {
  40. const point = bMapTransQQMap(this.formValue.lng, this.formValue.lat)
  41. query = bMapTransQQMap(this.formValue.lng, this.formValue.lat)
  42. }
  43. uni.$once('choose-location', this.selectedLocation)
  44. this.$Router.navigateTo({
  45. url: '/pages_common/map/chooseLocation',
  46. query
  47. })
  48. },
  49. selectedLocation(data) {
  50. console.log('选择:', data)
  51. if (!this.$isEmpty(data)) {
  52. // >> 高德地图
  53. // const area = `${data.pname || ''},${data.cityname || ''},${data.adname || ''}`
  54. // >> 腾讯地图
  55. if (!data.ad_info) data.ad_info = {}
  56. const area = `${data.ad_info.province || ''},${data.ad_info.city || ''},${data.ad_info.district || ''}`
  57. const addr = `${data.address || ''}${data.name || ''}`
  58. const point = qqMapTransBMap(data.longitude, data.latitude)
  59. this.formValue = {
  60. address: area,
  61. detailAddress: addr,
  62. lat: point.latitude,
  63. lng: point.longitude,
  64. location: addr
  65. }
  66. } else {
  67. this.formValue = {
  68. address: '',
  69. detailAddress: '',
  70. lat: '',
  71. lng: '',
  72. location: ''
  73. }
  74. }
  75. this.$emit('input', this.formValue)
  76. this.$emit('change', {
  77. index: this.index,
  78. field: this.field,
  79. value: this.formValue
  80. })
  81. }
  82. }
  83. }
  84. </script>
  85. <style scoped lang="scss">
  86. @import './wkField.scss';
  87. .icon-pic {
  88. width: 32rpx;
  89. height: 32rpx;
  90. }
  91. </style>