图斑信息
@@ -7,6 +12,7 @@
:geomsList="geomsList"
:mapConfig="mapConfig"
@handlerSplitPolygon="handlerSplitPolygon"
+ @handlerStartSpliting="handlerStartSpliting"
@mapOnLoad="onMapboxLoad"
:caseid="id"
:caseno="case_no"
@@ -616,14 +622,14 @@
import axios from 'axios';
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
import { getConfig } from '@/api/sys/layerManagement';
- import { getGeom } from '@/api/sys/layerManagement';
+ import { getGeom,calTubanArea } from '@/api/sys/layerManagement';
import { splitCase } from '@/api/tiankongdi';
import { useMessage } from '@/hooks/web/useMessage';
const { createMessage } = useMessage();
import Icon from '@/components/Icon/Icon.vue';
import { getAppEnvConfig } from '@/utils/env';
const { VITE_GLOB_API_URL, VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
- import { GeojsonToWkt } from '@/components/MapboxMaps/src/WktGeojsonTransform';
+ import { GeojsonToWkt, removeZM} from '@/components/MapboxMaps/src/WktGeojsonTransform';
import {
mapTypeOptions,
@@ -859,6 +865,7 @@ import { itemProps } from '@/components/Menu/src/props';
geomsList.value = geoms;
});
}
+
// MapboxComponent.value.handlerDraw(status,mapgemoList.value, false);
MapboxComponent.value.handlerDraw('Details', geoms, false);
} else {
@@ -876,6 +883,7 @@ import { itemProps } from '@/components/Menu/src/props';
///////// File Preview && Download ////////
import FilePreview from '@/components/Upload/src/components/FilePreview.vue';
+ import { CalTubanAreaModel } from '@/api/sys/model/layerModel';
const previewFileModalVisible = ref(false);
const previewFileUrl = ref("");
@@ -898,75 +906,95 @@ import { itemProps } from '@/components/Menu/src/props';
const getContainer = () => {
return document.getElementById('info-container');
};
+
+
+ const isLandTypeSpliting = ref(false);
+ // 开始分割
+ const handlerStartSpliting = (e)=> {
+ isLandTypeSpliting.value = e;
+ }
const splitPolygonForm = ref([]);
const splitAfterPolygon = ref([]);
const handlerSplitPolygon = (e) => {
+
// 删除被分割的图斑
if(currentPolygon.value){
splitPolygonForm.value?.splice(currentPolygon.value,1);
splitAfterPolygon.value?.splice(currentPolygon.value,1);
}
+
+ isLandTypeSpliting.value = false;
+
+ // 面积计算
let sumArea = 0.0;
+
e?.forEach((item, index) => {
- var polygon = null;
- if(item.geometry.type == 'Polygon'){
- polygon = turf.polygon(item.geometry.coordinates)
- }else if(item.geometry.type == 'MultiPolygon'){
- polygon = turf.multiPolygon(item.geometry.coordinates)
+ // 去除GeoJSON Z坐标
+ let afterItem = removeZM(item['geometry'])
+
+ let calAreaParams:CalTubanAreaModel = {
+ "wktgeom": GeojsonToWkt(item['geometry']),
}
- let are = (turf.area(polygon) / 666.666666666667).toFixed(2);
+
+ calTubanArea(calAreaParams).then(resultItem=>{
+ if(resultItem){
+
+ let form = {
+ fid: null,
+ unitname: '',
+ createdate: createtime,
+ caseno: case_no + ' 分割图斑',
+ countyname: countyname,
+ streetname: streetname,
+ isbuildname: '',
+ nongyongdi_area: resultItem.nongyongdi > 0 ? resultItem.nongyongdi : 0.00,
+ gengdi_area: resultItem.gengdi > 0 ? resultItem.gengdi : 0.00,
+ yongjiujibennongtian_area: resultItem.jibennongtian > 0 ? resultItem.jibennongtian : 0.00,
+ shengtaibaohuhongxian_area: resultItem.shengtaihongxian > 0 ? resultItem.shengtaihongxian : 0.00,
+ guotukongjianguihua_area: null,
+ area: resultItem.totalmianji > 0 ? resultItem.totalmianji : 0.00,
+ geom: item,
+ checked:false,
+ };
- if(index == e.length-1){
- are = (parseFloat(area) - sumArea).toFixed(2);
- }
- sumArea = sumArea + are;
+ splitPolygonForm.value?.push(form);
+ splitAfterPolygon.value?.push(form.geom)
- let form = {
- fid: null,
- unitname: '',
- createdate: createtime,
- caseno: case_no + ' 分割图斑',
- countyname: countyname,
- streetname: streetname,
- isbuildname: '',
- nongyongdi_area: null,
- gengdi_area: null,
- yongjiujibennongtian_area: null,
- shengtaibaohuhongxian_area: null,
- guotukongjianguihua_area: null,
- area: are > 0 ? are : 0.00,
- geom: item,
- checked:false,
- };
- splitPolygonForm.value?.push(form);
- splitAfterPolygon.value?.push(form.geom)
+ // 分割完成后重新渲染面数据
+ let splitAfterFeatures = {
+ type: 'FeatureCollection',
+ features: [],
+ };
+ splitPolygonForm.value?.forEach((item,idnex)=>{
+ splitAfterFeatures.features.push(item.geom);
+ })
+
+ const areKeyDownChange = MapboxComponent.value.handlerDetails(splitAfterFeatures);
+
+ }
+ })
+
+ // var polygon = null;
+ // if(item.geometry.type == 'Polygon'){
+ // polygon = turf.polygon(item.geometry.coordinates)
+ // }else if(item.geometry.type == 'MultiPolygon'){
+ // polygon = turf.multiPolygon(item.geometry.coordinates)
+ // }
+ // let are = (turf.area(polygon) / 666.666666666667).toFixed(2);
+
+ // if(index == e.length-1){
+ // are = (parseFloat(area) - sumArea).toFixed(2);
+ // }
+ // sumArea = sumArea + are;
+
+
});
-
- // 分割完成后重新渲染面数据
- let splitAfterFeatures = {
- type: 'FeatureCollection',
- features: [],
- };
-
- splitPolygonForm.value?.forEach((item,idnex)=>{
- console.log("item.geom",item.geom);
-
- splitAfterFeatures.features.push(item.geom);
- })
-
- // splitAfterFeatures.features = e;
-
-
-const areKeyDownChange =
- MapboxComponent.value.handlerDetails(splitAfterFeatures);
-
-
// 清空选中图斑
let geoms = {
type: 'FeatureCollection',
@@ -1238,6 +1266,9 @@ const areKeyDownChange =
};
params.parts.push(polygon);
});
+
+
+
try{
splitCase(params).then((res) => {
if (res) {
@@ -1318,6 +1349,21 @@ const areKeyDownChange =
width: calc(100vw - 15px);
height: calc(100vh - 120px);
display: flex;
+ .load-mask{
+ width:100%;
+ height:100%;
+ position:absolute;
+ top:0px;
+ left:0px;
+ background:rgba(0,0,0,0.5);
+ z-index:9999;
+ .loader-block{
+ position: absolute;
+ left:50%;
+ top:50%;
+ transform:translate(-50%,-50%);
+ }
+ }
.left-container {
flex: 1;
height: 100%;