HC_YFZX
/
CaiYuanYiTiHua
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

输入框问题

main
徐景良 2025-04-03 15:38:27 +08:00
parent 0777feee4b
commit 2679fd7316
9 changed files with 130 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/MapboxMaps/MapComponent.vue
View File

@ -109,9 +109,8 @@
<!-- <p class="split-panel-item" >地类图斑分割</p> -->
<!-- <a-dropdown>
<p @click.prevent>地类图斑分割 <DownOutlined /></p>
<a-dropdown>
<p @click.prevent>地类图斑分割 <DownOutlined /></p>
<template #overlay>
<a-menu>
<a-menu-item @click="handlerSelectLandType('gengdi')">
@ -122,8 +121,7 @@
</a-menu-item>
</a-menu>
</template>
</a-dropdown> -->
</a-dropdown>
</div>
</template>
<div class="split-line" ></div>

5
src/views/demo/degraining/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -610,6 +610,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
@keydown="areKeyDownChange"
@ -621,6 +622,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -633,6 +635,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -643,6 +646,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -656,6 +660,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/illegalmining/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -388,6 +388,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
addon-after="亩"
@ -398,6 +399,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -410,6 +412,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -420,6 +423,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -433,6 +437,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/inspectionaudit/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -539,6 +539,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
@keydown="areKeyDownChange"
@ -550,6 +551,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -562,6 +564,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -572,6 +575,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -585,6 +589,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/keyproblem/keyissuesI/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -426,6 +426,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
addon-after="亩"
@ -436,6 +437,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -448,6 +450,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -458,6 +461,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -471,6 +475,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/keyproblem/keyissuesII/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -426,6 +426,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
addon-after="亩"
@ -436,6 +437,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -448,6 +450,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -458,6 +461,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -471,6 +475,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/redlinesupervision/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -458,6 +458,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
addon-after="亩"
@ -468,6 +469,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -480,6 +482,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -490,6 +493,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -503,6 +507,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

5
src/views/demo/shengtaixiufu/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -567,6 +567,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
@keydown="areKeyDownChange"
@ -578,6 +579,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -590,6 +592,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -600,6 +603,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -613,6 +617,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"

201
src/views/demo/tiankongdi/curbspotcity/MapList/SplitPolygonModal/index.vue
View File

@ -2,7 +2,7 @@
<div class="detail-container">
<!-- 加载框 -->
<div class="load-mask" v-if="isLandTypeSpliting">
<a-spin class="loader-block" size="large" tip="正在分割中......" />
<a-spin class="loader-block" size="large" tip="正在处理中，请稍后......" />
</div>
<div class="left-container">
@ -68,6 +68,7 @@
width="100px"
height="100px"
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
:keyboard="false"
></a-image>
</template>
</a-image-preview-group>
@ -535,6 +536,7 @@
<a-form-item label="图斑面积" name="area">
<a-input
v-model:value="splitPolygonAreaForm.area"
@keydown.stop
@blur="checkArea('area')"
:status="areaAbnormal['area'] ? 'error' : ''"
@keydown="areKeyDownChange"
@ -546,6 +548,7 @@
<a-form-item label="农用地面积" name="nongyongdi_area">
<a-input
v-model:value="splitPolygonAreaForm.nongyongdi_area"
@keydown.stop
:status="areaAbnormal['nongyongdi_area'] ? 'error' : ''"
@blur="checkArea('nongyongdi_area')"
addon-after="亩"
@ -558,6 +561,7 @@
<a-form-item label="耕地面积" name="gengdi_area">
<a-input
v-model:value="splitPolygonAreaForm.gengdi_area"
@keydown.stop
:status="areaAbnormal['gengdi_area'] ? 'error' : ''"
@blur="checkArea('gengdi_area')"
addon-after="亩"
@ -568,6 +572,7 @@
<a-form-item label="永农面积" name="yongjiujibennongtian_area">
<a-input
v-model:value="splitPolygonAreaForm.yongjiujibennongtian_area"
@keydown.stop
:status="areaAbnormal['yongjiujibennongtian_area'] ? 'error' : ''"
@blur="checkArea('yongjiujibennongtian_area')"
addon-after="亩"
@ -581,6 +586,7 @@
<a-form-item label="占生态红线面积" name="shengtaibaohuhongxian_area">
<a-input
v-model:value="splitPolygonAreaForm.shengtaibaohuhongxian_area"
@keydown.stop
:status="areaAbnormal['shengtaibaohuhongxian_area'] ? 'error' : ''"
@blur="checkArea('shengtaibaohuhongxian_area')"
addon-after="亩"
@ -917,89 +923,95 @@ import { itemProps } from '@/components/Menu/src/props';
const splitPolygonForm = ref([]);
const splitAfterPolygon = ref([]);
const handlerSplitPolygon = (e) => {
let splitPolygonPromiseArray = [];
const handlerSplitPolygon = (e) => {
isLandTypeSpliting.value = true;
// 删除被分割的图斑
if(currentPolygon.value){
splitPolygonForm.value?.splice(currentPolygon.value,1);
splitAfterPolygon.value?.splice(currentPolygon.value,1);
}
// 清空全部Promise
splitPolygonPromiseArray = [];
isLandTypeSpliting.value = false;
try{
e?.forEach((item, index) => {
// 面积计算
let sumArea = 0.0;
e?.forEach((item, index) => {
// 去除GeoJSON Z坐标
let afterItem = removeZM(item['geometry'])
let calAreaParams:CalTubanAreaModel = {
"wktgeom": GeojsonToWkt(item['geometry']),
}
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,
};
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);
let afterItem = removeZM(item['geometry'])
let calAreaParams:CalTubanAreaModel = {
"wktgeom": GeojsonToWkt(item['geometry']),
}
let splitPromise = 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,
};
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);
}
})
// 添加到排队
splitPolygonPromiseArray.push(splitPromise);
});
// 等待全部查询执行完毕后执行
Promise.all(splitPolygonPromiseArray).then(res=>{
// 处理面积
handlerFeatureArea();
// 清空选中图斑
let geoms = {
type: 'FeatureCollection',
features: [],
};
// 绘制新图斑
MapboxComponent.value.handlerDetails(geoms, 'splitPolygonSource', 'splitPolygonLayer', {
lineStyle: { 'line-color': '#408eff', 'line-width': 3 },
fillStyle: { 'fill-color': '#408eff', 'fill-opacity': 0.1 },
});
// 清空当前图斑
currentPolygon.value = null;
// 停止加载
isLandTypeSpliting.value = false;
})
// setTimeout(function(){
// handlerFeatureArea();
// },10000)
});
// 清空选中图斑
let geoms = {
type: 'FeatureCollection',
features: [],
};
MapboxComponent.value.handlerDetails(geoms, 'splitPolygonSource', 'splitPolygonLayer', {
lineStyle: { 'line-color': '#408eff', 'line-width': 3 },
fillStyle: { 'fill-color': '#408eff', 'fill-opacity': 0.1 },
});
currentPolygon.value = null;
}catch(e){
isLandTypeSpliting.value = false;
}
};
// 处理面积
@ -1036,14 +1048,15 @@ import { itemProps } from '@/components/Menu/src/props';
// splitPolygonForm.value[index].gengdi_area = 0;
// }
splitPolygonForm.value[index].area = area - addArea.area;
splitPolygonForm.value[index].gengdi_area = gengdi_area - addArea.gengdi_area;
splitPolygonForm.value[index].nongyongdi_area = nongyongdi_area - addArea.nongyongdi_area;
splitPolygonForm.value[index].yongjiujibennongtian_area = yongjiujibennongtian_area - addArea.yongjiujibennongtian_area;
splitPolygonForm.value[index].shengtaibaohuhongxian_area = shengtaibaohuhongxian_area - addArea.shengtaibaohuhongxian_area;
splitPolygonForm.value[index].area = (area - addArea.area).toFixed(2);
splitPolygonForm.value[index].gengdi_area = (gengdi_area - addArea.gengdi_area).toFixed(2);
splitPolygonForm.value[index].nongyongdi_area = (nongyongdi_area - addArea.nongyongdi_area).toFixed(2);
splitPolygonForm.value[index].yongjiujibennongtian_area = (yongjiujibennongtian_area - addArea.yongjiujibennongtian_area).toFixed(2);
splitPolygonForm.value[index].shengtaibaohuhongxian_area = (shengtaibaohuhongxian_area - addArea.shengtaibaohuhongxian_area).toFixed(2);
}
// 累计面积
addArea.area = addArea.area + item.area;
addArea.gengdi_area = addArea.gengdi_area + item.gengdi_area;
addArea.nongyongdi_area = addArea.nongyongdi_area + item.nongyongdi_area;
@ -1194,6 +1207,9 @@ import { itemProps } from '@/components/Menu/src/props';
// 合并图斑
const mergeSplitResult = ()=>{
isLandTypeSpliting.value = true;
try{
let mergeArr = []
let deleteIndexs = [];
@ -1229,10 +1245,6 @@ import { itemProps } from '@/components/Menu/src/props';
let union = turf.union(turf.featureCollection([mergeArr[0], mergeArr[1]]))
// 计算合并后的图斑面积
let calAreaParams:CalTubanAreaModel = {
"wktgeom": GeojsonToWkt(union['geometry']),
}
@ -1281,30 +1293,13 @@ import { itemProps } from '@/components/Menu/src/props';
});
handlerFeatureArea();
isLandTypeSpliting.value = false;
}
})
// let polygon = {
// 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: null,
// geom: union,
// checked:false,
// }
}catch(e){
isLandTypeSpliting.value = false;
createMessage.error("合并失败！");
}