From 837255691ee1fcd2cafbdab84bcf1c62a02acd1e Mon Sep 17 00:00:00 2001 From: zengmingjie Date: Tue, 8 Jul 2025 22:31:25 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=94=B9=E9=98=B2=E5=8C=BA=E7=82=B9?= =?UTF-8?q?=E5=87=BB=E5=AE=9A=E4=BD=8D=E4=B9=8B=E5=90=8E=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=A4=B1=E8=B4=A5=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/css/index.scss | 1 + src/components/myForm.vue | 99 +++++++++++++++++++-------- src/components/myMarsmap.vue | 14 ++-- src/views/menuData/PositionDialog.vue | 59 +++++++++------- 4 files changed, 111 insertions(+), 62 deletions(-) diff --git a/src/assets/css/index.scss b/src/assets/css/index.scss index a93d374..f09b345 100644 --- a/src/assets/css/index.scss +++ b/src/assets/css/index.scss @@ -121,6 +121,7 @@ body { align-items: center; margin-right: 40px; margin-top: 10px; + z-index: 10; .menuItem { width: 305px; display: flex; diff --git a/src/components/myForm.vue b/src/components/myForm.vue index ca7454a..55da610 100644 --- a/src/components/myForm.vue +++ b/src/components/myForm.vue @@ -423,7 +423,8 @@ export default { } if (newVal.geojson === undefined) { if (this.$refs.myMarsmap !== undefined) { - this.$refs.myMarsmap[0].clearDraw(); + console.log(111122223333); + // this.$refs.myMarsmap[0].clearDraw(); } } } @@ -536,37 +537,77 @@ export default { }; if (this.$refs.myMarsmap) { let toJson = this.$refs.myMarsmap[0].toGeoJSON(); - // 多边形 首尾相同 - geojson.coordinates = toJson.features.map((item) => { - if (item.properties.type === "polygon") { - item.geometry.coordinates[0][ - item.geometry.coordinates[0].length - ] = item.geometry.coordinates[0][0]; - } else if (item.properties.type === "pointP") { - console.log(item.geometry.coordinates); - } else if (item.properties.type === "circle") { - // eslint-disable-next-line no-undef - const positions = mars3d.PolyUtil.getEllipseOuterPositions({ - position: item.geometry.coordinates, - radius: item.properties.style.radius - }); - item.geometry.coordinates = [[]]; - positions.forEach((el) => { - // eslint-disable-next-line no-undef - mars3d.LngLatPoint.fromCartesian(el).toArray(), + if (toJson.features.length !== 0) { + console.log(toJson, "toJson"); + // 多边形 首尾相同 + geojson.coordinates = toJson.features.map((item) => { + if (item.properties.type === "polygon") { + // 确保 coordinates 是有效的多边形坐标（三维数组） + if ( + Array.isArray(item.geometry.coordinates) && + Array.isArray(item.geometry.coordinates[0]) && + Array.isArray(item.geometry.coordinates[0][0]) + ) { + let coords = item.geometry.coordinates[0]; + if (coords.length > 1) { + let firstCoord = coords[0]; + let lastCoord = coords[coords.length - 1]; + + // 清理重复的尾坐标 + while ( + coords.length > 1 && + lastCoord[0] === firstCoord[0] && + lastCoord[1] === firstCoord[1] + ) { + coords.pop(); + // 更新 lastCoord + if (coords.length > 1) { + lastCoord = coords[coords.length - 1]; + } + } + + // 检查首尾坐标是否相同 + if ( + coords.length > 1 && + (firstCoord[0] !== lastCoord[0] || + firstCoord[1] !== lastCoord[1]) + ) { + // 如果不同，将首坐标添加到尾部 + item.geometry.coordinates[0].push(firstCoord); + } + } + } + } else if (item.properties.type === "pointP") { + console.log(item.geometry.coordinates, "112233"); + } else if (item.properties.type === "circle") { + const positions = mars3d.PolyUtil.getEllipseOuterPositions({ + position: item.geometry.coordinates, + radius: item.properties.style.radius + }); + item.geometry.coordinates = [[]]; + positions.forEach((el) => { item.geometry.coordinates[0].push( - // eslint-disable-next-line no-undef mars3d.LngLatPoint.fromCartesian(el).toArray() ); - }); - console.log(item.geometry.coordinates); - item.geometry.coordinates[0].push( - item.geometry.coordinates[0][0] - ); - // console.log(item.geometry.coordinates); - } - return item.geometry.coordinates; - }); + }); + console.log(item.geometry.coordinates); + // 为圆添加首坐标到尾部以闭合 + if (item.geometry.coordinates[0].length > 0) { + item.geometry.coordinates[0].push( + item.geometry.coordinates[0][0] + ); + } + } + return item.geometry.coordinates; + }); + + geojson.coordinates = geojson.coordinates.filter( + (item) => + Array.isArray(item) && + Array.isArray(item[0]) && + Array.isArray(item[0][0]) + ); + } this.ruleForm.geoJson = geojson; this.ruleForm.center = [ this.$refs.myMarsmap[0].lonData, diff --git a/src/components/myMarsmap.vue b/src/components/myMarsmap.vue index 11e0889..aa85b4a 100644 --- a/src/components/myMarsmap.vue +++ b/src/components/myMarsmap.vue @@ -99,12 +99,11 @@ export default { deep: true, immediate: true, handler(newVal) { + console.log("newVal1111", newVal); if (newVal) { this.jsonData = JSON.parse(newVal); if (this.jsonData) { - if (newVal) { - this.showRegion(this.jsonData, "geojson"); - } + this.showRegion(this.jsonData, "geojson"); } } } @@ -121,9 +120,9 @@ export default { this.lonData = ""; this.latData = ""; } - console.log("mapData发生变化", newVal); if (this.lonData && this.latData) { if (this.lonData && this.latData) { + this.isinputDisabled = true; this.deviceDrid(this.lonData, this.latData); } } @@ -217,6 +216,7 @@ export default { } if (this.lonData && this.latData) { this.deviceDrid(this.lonData, this.latData); + this.isinputDisabled = true; } }, lineClicks(val) { @@ -328,15 +328,15 @@ export default { } }, clearDraw() { + console.log(111); this.isinputDisabled = false; if (this.graphicLayer) { this.graphicLayer.clear(); } }, toGeoJSON() { - console.log(this.graphicLayer, this.typeOf, "this.graphicLayer"); if (this.typeOf === "pointP") { - return this.graphicLayer.toGeoJSON({ noAlt: true }); + // return this.graphicLayer.toGeoJSON({ noAlt: true }); } else { this.graphicLayer._graphicList._array.forEach((item) => { if (item.type === "billboard") { @@ -347,6 +347,7 @@ export default { } }, showRegion(value, type) { + this.clearDraw(); let geojson = {}; if (type === "uploadGeojson") { if (this.graphicLayer._graphicList.length === 0) { @@ -387,7 +388,6 @@ export default { } }, deviceDrid(lon, lat) { - // this.clearDraw(); console.log(this.graphicLayer, "this.graphicLayer"); if (this.graphicLayer) { this.graphicLayer.eachGraphic((item) => { diff --git a/src/views/menuData/PositionDialog.vue b/src/views/menuData/PositionDialog.vue index 50bf8ae..08784cf 100644 --- a/src/views/menuData/PositionDialog.vue +++ b/src/views/menuData/PositionDialog.vue @@ -216,40 +216,47 @@ export default { }, // 确定按钮 determine(value) { - let params = {}; - params = value; + let params = { ...value }; console.log(params, "params"); - params.regionJson = JSON.stringify(params.geoJson); + if (params.geoJson.coordinates.length !== 0) { + params.regionJson = JSON.stringify(params.geoJson); - params.lon = params.center[0]; - params.lat = params.center[1]; - this.$delete(params, "geoJson"); - this.$delete(params, "center"); - // this.$delete(params, "imageBriefUrl"); - if (params.lon !== "" && params.lat !== "") { - if (this.isType === "add") { - // console.log("新增"); - devPositionAdd(params) - .then((res) => { + params.lon = params.center[0]; + params.lat = params.center[1]; + this.$delete(params, "geoJson"); + this.$delete(params, "center"); + // this.$delete(params, "imageBriefUrl"); + if (params.lon !== "" && params.lat !== "") { + if (this.isType === "add") { + // console.log("新增"); + devPositionAdd(params) + .then((res) => { + if (res.code === 0) { + this.$message.success("新增成功"); + this.headdenForm({}, "search"); + } else { + this.$message.error(res.msg); + } + }) + .catch((err) => { + console.log(err); + }); + } else if (this.isType === "edit") { + devPositionUpdate(params).then((res) => { if (res.code === 0) { - this.$message.success("新增成功"); + this.$message.success("编辑成功"); this.headdenForm({}, "search"); + } else { + this.$message.error(res.msg); } - }) - .catch((err) => { - console.log(err); }); - } else if (this.isType === "edit") { - devPositionUpdate(params).then((res) => { - if (res.code === 0) { - this.$message.success("编辑成功"); - this.headdenForm({}, "search"); - } - }); + } + this.drawer = false; + } else { + this.$message.error("请选择地图上的经纬度"); } - this.drawer = false; } else { - this.$message.error("请选择地图上的经纬度"); + this.$message.error("请绘制地图上的防区"); } }, // 新增 搜索