<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 '@/gongzuotai/components/EditMap.vue'
  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>