智能设备 - 围栏添加经纬度配置

src/views/sevenLargeScreen/comprehensiveManage/projectOverview/centerTop.vue

@@ -5,13 +5,13 @@
 			<div class="fullScreen" @click="handleFullScreen">
 				<el-icon :size="20" color="#fff">
 					<FullScreen />
-  			</el-icon>
+				</el-icon>
 			</div>
 			<!-- <div class="map-box" id="mapContainer"></div> -->
 			<iframe
 				style="width: 100%; height: 100%"
 				id="iframeDom"
-				src="http://222.80.185.228:6080/#/login?projectId=2"
+				src="http://jxjzw.zhgdyun.com:6080/review1/#/login?projectId=2"
 				allowfullscreen
 				frameborder="0"
 			></iframe>

src/views/sevenLargeScreen/digitalConstruction/smartSafeHat/index.vue

@@ -328,6 +328,9 @@
 											<el-form-item label="围栏形状" prop="fenceShape" v-if="addForm.rangeType === 2">
 												<div class="fence-shape">多边形</div>
 											</el-form-item>
+											<el-form-item label="经纬度" prop="lngLat">
+												<el-input v-model="addForm.lngLat" placeholder="请输入" @change="latLongChange"></el-input>
+											</el-form-item>
 										</div>
 
 										<!-- <div class="create-footer">
@@ -509,6 +512,7 @@ let addForm = ref({
 	areaRadius: 100, //区域半径
 	fenceName: "", //围栏名称
 	addr: "",
+	lngLat: "",
 	rangeType: 1,
 	locationList: [
 		{
@@ -739,6 +743,24 @@ function areaRadiusChange() {
 		drawCircle();
 	}
 }
+function latLongChange() {
+	console.info('change', addForm.value.lngLat)
+	let lng = addForm.value.lngLat.split(',')[0]
+	let lat = addForm.value.lngLat.split(',')[1]
+	if (lng && lat) {
+		locationList.value = [{
+			longitude: lng,
+			latitude: lat
+		}]
+		drawCircle();
+	} else {
+		ElMessage({
+			showClose: true,
+			message: "经纬度有误",
+			type: "error"
+		});
+	}
+}
 
 function deleteFence() {
 	if (checkedFence.value.length === 0) {
@@ -1170,6 +1192,7 @@ function getFenceList() {
 			circleMapData.value = res.result.filter(item => item.rangeType === 1);
 			shapeMapData.value = res.result.filter(item => item.rangeType === 2);
 			console.log("围栏", circleMapData.value, shapeMapData.value);
+			// fenceAllChange(true);
 		}
 	});
 }
@@ -1657,6 +1680,7 @@ function initMap() {
 				latitude: element.lat
 			});
 		});
+		addForm.value.lngLat = locationList.value[0].longitude + "," + locationList.value[0].latitude;
 	});
 	geocoder.getLocation(addForm.value.addr, function (status, result) {
 		if (status === "complete" && result.geocodes.length) {
@@ -1681,15 +1705,15 @@ function initMap() {
 		}
 		console.log("您在 [ " + e.lnglat.getLng() + "," + e.lnglat.getLat() + " ] 的位置单击了地图！");
 		if (addForm.value.rangeType == 1) {
-			locationList.value = [];
-			locationList.value.push({
+			locationList.value = [{
 				longitude: e.lnglat.getLng(),
 				latitude: e.lnglat.getLat()
-			});
+			}];
+			addForm.value.lngLat = e.lnglat.getLng() + "," + e.lnglat.getLat();
 			var lnglatXY = new AMap.LngLat(e.lnglat.getLng(), e.lnglat.getLat());
 			geocoder.getAddress(lnglatXY, function (status, result) {
 				console.log(status, result);
-				that.addForm.addr = result.regeocode.formattedAddress;
+				addForm.value.addr = result.regeocode.formattedAddress;
 			});
 			drawCircle();
 		} else {
@@ -1701,7 +1725,6 @@ function initMap() {
 		console.log("当前位置列表", locationList.value);
 	});
 }
-
 function select(e) {
 	console.log("select", e);
 	placeSearch.setCity(e.poi.adcode);