Commit c1d77499b011e73e2386077b0ec1e8b884f1731e
Merge branch 'fix/device-location-map' into 'main_dev'
fix: 修改设备位置第一次需要点击地图才显示位置问题 See merge request yunteng/thingskit-front!821
Showing
2 changed files
with
28 additions
and
5 deletions
| ... | ... | @@ -145,6 +145,8 @@ |
| 145 | 145 | // !!!此处需要删除地图的属性,否则会报堆栈溢出的错误 Uncaught RangeError: Maximum call stack size exceeded |
| 146 | 146 | Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'map'); |
| 147 | 147 | Reflect.deleteProperty(DeviceStep1Ref.value.positionState, 'marker'); |
| 148 | + Reflect.deleteProperty(DeviceStep1Ref.value.devicePositionState, 'map'); | |
| 149 | + Reflect.deleteProperty(DeviceStep1Ref.value.devicePositionState, 'marker'); | |
| 148 | 150 | setModalProps({ |
| 149 | 151 | confirmLoading: true, |
| 150 | 152 | }); |
| ... | ... | @@ -156,7 +158,7 @@ |
| 156 | 158 | customerId: currentDeviceData.customerId, |
| 157 | 159 | deviceInfo: { |
| 158 | 160 | avatar: DeviceStep1Ref.value?.devicePic, |
| 159 | - ...DeviceStep1Ref.value?.positionState, | |
| 161 | + ...DeviceStep1Ref.value?.devicePositionState, | |
| 160 | 162 | }, |
| 161 | 163 | }; |
| 162 | 164 | validateNameLength(stepRecord.name); |
| ... | ... | @@ -168,7 +170,7 @@ |
| 168 | 170 | sn: stepRecord.name, |
| 169 | 171 | deviceInfo: { |
| 170 | 172 | avatar: DeviceStep1Ref.value?.devicePic, |
| 171 | - ...DeviceStep1Ref.value?.positionState, | |
| 173 | + ...DeviceStep1Ref.value?.devicePositionState, | |
| 172 | 174 | }, |
| 173 | 175 | deviceToken: |
| 174 | 176 | unref(current) === 0 || !unref(stepState).addAgree | ... | ... |
| ... | ... | @@ -46,7 +46,7 @@ |
| 46 | 46 | </div> |
| 47 | 47 | </template> |
| 48 | 48 | <template #deviceAddress> |
| 49 | - <Input disabled v-model:value="positionState.address"> | |
| 49 | + <Input disabled v-model:value="devicePositionState.address"> | |
| 50 | 50 | <template #addonAfter> |
| 51 | 51 | <EnvironmentTwoTone @click="selectPosition" /> |
| 52 | 52 | </template> |
| ... | ... | @@ -128,6 +128,7 @@ |
| 128 | 128 | import { useDrawer } from '/@/components/Drawer'; |
| 129 | 129 | import DeptDrawer from '/@/views/system/organization/OrganizationDrawer.vue'; |
| 130 | 130 | import { TaskTypeEnum } from '/@/views/task/center/config'; |
| 131 | + import { toRaw } from 'vue'; | |
| 131 | 132 | |
| 132 | 133 | export default defineComponent({ |
| 133 | 134 | components: { |
| ... | ... | @@ -239,8 +240,14 @@ |
| 239 | 240 | const selectPosition = () => { |
| 240 | 241 | visible.value = true; |
| 241 | 242 | if (!positionState.longitude) { |
| 242 | - positionState.longitude = '104.04666605565338'; | |
| 243 | - positionState.latitude = '30.543516387560476'; | |
| 243 | + positionState.longitude = '104.05326410962411'; | |
| 244 | + positionState.latitude = '30.54855093076791'; | |
| 245 | + | |
| 246 | + // 根据经纬度获取详细位置 | |
| 247 | + if (positionState.longitude && positionState.latitude) { | |
| 248 | + var pt = new BMap.Point(positionState.longitude, positionState.latitude); | |
| 249 | + getAddrByPoint(pt); | |
| 250 | + } | |
| 244 | 251 | initMap(positionState.longitude, positionState.latitude); |
| 245 | 252 | } else { |
| 246 | 253 | initMap(positionState.longitude, positionState.latitude); |
| ... | ... | @@ -261,6 +268,15 @@ |
| 261 | 268 | map: null, |
| 262 | 269 | marker: null, |
| 263 | 270 | }); |
| 271 | + | |
| 272 | + const devicePositionState = ref({ | |
| 273 | + longitude: '', | |
| 274 | + latitude: '', | |
| 275 | + address: '', | |
| 276 | + map: null, | |
| 277 | + marker: null, | |
| 278 | + }); | |
| 279 | + | |
| 264 | 280 | /** |
| 265 | 281 | * 逆地址解析函数(根据坐标点获取详细地址) |
| 266 | 282 | * @param {Object} point 百度地图坐标点,必传 |
| ... | ... | @@ -371,6 +387,7 @@ |
| 371 | 387 | // 确定选择的位置 |
| 372 | 388 | const handleOk = () => { |
| 373 | 389 | visible.value = false; |
| 390 | + devicePositionState.value = { ...toRaw(positionState) }; | |
| 374 | 391 | }; |
| 375 | 392 | // 取消选择位置 |
| 376 | 393 | const handleCancel = () => { |
| ... | ... | @@ -385,6 +402,7 @@ |
| 385 | 402 | positionState.longitude = deviceInfo.longitude; |
| 386 | 403 | positionState.latitude = deviceInfo.latitude; |
| 387 | 404 | positionState.address = deviceInfo.address; |
| 405 | + devicePositionState.value = { ...toRaw(positionState) }; | |
| 388 | 406 | devicePic.value = deviceInfo.avatar; |
| 389 | 407 | setFieldsValue({ |
| 390 | 408 | ...data, |
| ... | ... | @@ -418,11 +436,13 @@ |
| 418 | 436 | function parentResetDevicePic(deviceInfo) { |
| 419 | 437 | devicePic.value = deviceInfo.avatar; |
| 420 | 438 | } |
| 439 | + | |
| 421 | 440 | // 父组件重置位置 |
| 422 | 441 | function parentResetPositionState() { |
| 423 | 442 | for (let key in positionState) { |
| 424 | 443 | positionState[key] = ''; |
| 425 | 444 | } |
| 445 | + devicePositionState.value = { ...toRaw(positionState) }; | |
| 426 | 446 | } |
| 427 | 447 | // 禁用设备类型 |
| 428 | 448 | function disabledDeviceType(disabled: boolean) { |
| ... | ... | @@ -474,6 +494,7 @@ |
| 474 | 494 | handleOpenOrgDrawer, |
| 475 | 495 | handleSuccess, |
| 476 | 496 | handleTreeOrg, |
| 497 | + devicePositionState, | |
| 477 | 498 | }; |
| 478 | 499 | }, |
| 479 | 500 | }); | ... | ... |