118 lines
2.2 KiB
Vue
118 lines
2.2 KiB
Vue
<template>
|
|
<view class="page">
|
|
<u-navbar :title="getTitle" :border-bottom="false" :background="bgc" title-color='#000' title-size='36' height='45'>
|
|
</u-navbar>
|
|
|
|
<edit-map
|
|
:boundary-str="boundaryStr"
|
|
:longitude="longitude"
|
|
:latitude="latitude"
|
|
@on-complete="handlePolygonComplete"
|
|
></edit-map>
|
|
|
|
<view class="bottom-btn">
|
|
<u-button type="primary" @click="confirmEdit">确认修改</u-button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import EditMap from './components/EditMap.vue'
|
|
|
|
export default {
|
|
components: {
|
|
EditMap
|
|
},
|
|
data() {
|
|
return {
|
|
bgc: {
|
|
backgroundColor: "#fff",
|
|
},
|
|
type: '',
|
|
boundaryStr: '',
|
|
newBoundaryStr: null,
|
|
longitude: '',
|
|
latitude: ''
|
|
}
|
|
},
|
|
computed: {
|
|
getTitle() {
|
|
const typeMap = {
|
|
'1': '停车区',
|
|
'2': '禁停区',
|
|
'3': '禁行区'
|
|
}
|
|
return `编辑${typeMap[this.type] || '区域'}坐标`
|
|
}
|
|
},
|
|
onLoad(e) {
|
|
this.type = e.type
|
|
|
|
// 解析传入的边界数据
|
|
if (e.boundaryStr) {
|
|
try {
|
|
this.boundaryStr = decodeURIComponent(e.boundaryStr)
|
|
} catch (error) {
|
|
console.error('解析边界数据失败:', error)
|
|
}
|
|
}
|
|
this.longitude = parseFloat(e.longitude)
|
|
this.latitude = parseFloat(e.latitude)
|
|
},
|
|
methods: {
|
|
// 处理多边形绘制完成
|
|
handlePolygonComplete(boundaryStr) {
|
|
this.newBoundaryStr = boundaryStr
|
|
// 自动点击确认按钮
|
|
this.confirmEdit()
|
|
},
|
|
|
|
// 确认修改
|
|
confirmEdit() {
|
|
if (!this.newBoundaryStr) {
|
|
return uni.showToast({
|
|
title: '请完成区域绘制',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
|
|
// 返回数据给上一页
|
|
const pages = getCurrentPages()
|
|
const prevPage = pages[pages.length - 2]
|
|
if (prevPage && prevPage.$vm) {
|
|
prevPage.$vm.handleMapDataReturn(this.newBoundaryStr)
|
|
|
|
// 添加延时确保数据传递完成
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
}, 100)
|
|
} else {
|
|
uni.navigateBack()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.page {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.bottom-btn {
|
|
padding: 20rpx;
|
|
background-color: #fff;
|
|
|
|
.u-button {
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style> |