submitlLocation.vue 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <view class="task-form-item form-item-media">
  3. <view class="form-lable">
  4. <text><text class="form-must" v-if="rule && rule.required">* </text>定位:</text>
  5. <view :class="['form-lable-content' , Position.length > 0 ? 'lable-content-right' : '']" v-if="!checkPage">
  6. <view class="lable-content-btn" @click.stop="onLocation()">
  7. <text class="iconfont_yige">&#xe6a8;</text>
  8. <text>获取当前位置</text>
  9. </view>
  10. </view>
  11. </view>
  12. <view class="form-img-video form-value">
  13. {{Position}}
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. import {
  19. getLocation
  20. } from "@/utils/tool.js"
  21. export default {
  22. name: 'submintContent',
  23. model: {
  24. prop: ['lbsPosition'],
  25. event: ['onChange']
  26. },
  27. props: {
  28. checkPage: {
  29. type: Boolean,
  30. default: false
  31. },
  32. rule: {
  33. type: Object,
  34. default: null
  35. },
  36. lbsPosition: {
  37. type: String,
  38. default: ''
  39. }
  40. },
  41. data() {
  42. return {
  43. Position: ''
  44. }
  45. },
  46. methods: {
  47. onLocation() {
  48. try {
  49. getLocation().then(res => {
  50. console.log('getLocation = ', res)
  51. const {
  52. address
  53. } = res || {};
  54. if (address) {
  55. this.Position =
  56. `${address.province || ''}${address.city || ''}${address.district || ''}${address.street || ''}${address.poiName || ''}${address.streetNum || ''}`
  57. }
  58. }).catch(err => {
  59. console.log('getLocation err= ', err)
  60. })
  61. } catch (e) {
  62. console.log('showToast = ', e)
  63. uni.showToast({
  64. title: '定位失败',
  65. icon: 'none'
  66. })
  67. //TODO handle the exception
  68. }
  69. }
  70. },
  71. watch: {
  72. lbsPosition: {
  73. handler(newL, oldL) {
  74. this.Position = newL
  75. },
  76. immediate: true
  77. },
  78. Position: {
  79. handler(newL, oldL) {
  80. if (this.Position !== this.lbsPosition) {
  81. this.$emit('onChange', this.Position)
  82. }
  83. },
  84. }
  85. }
  86. }
  87. </script>
  88. <style lang="scss" scoped>
  89. @import '~./submint.scss';
  90. </style>