From d17824cbcb9b76f5c5c4d6b90f7059a03cae9c08 Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Fri, 05 Sep 2025 16:45:06 +0800
Subject: [PATCH] Merge branch 'feature/v5.0/5.0.5' into test
---
src/views/resource/components/spotDetails.vue | 316 ++++++++++++++++++++++++++++------------------------
src/utils/cesium/publicCesium.js | 6
src/views/device/addDevice.vue | 20 ++
src/views/resource/patchManagement.vue | 3
4 files changed, 193 insertions(+), 152 deletions(-)
diff --git a/src/utils/cesium/publicCesium.js b/src/utils/cesium/publicCesium.js
index 59b1acf..e5ea8f9 100644
--- a/src/utils/cesium/publicCesium.js
+++ b/src/utils/cesium/publicCesium.js
@@ -99,8 +99,8 @@
dockOptions = {},
-
-
+ boundaryColor = '#7FFFD4',
+ boundaryChange,
dockRangeType = 1,
useDockHeight = false
} = options
@@ -135,7 +135,7 @@
this.viewer.clockViewModel.currentTime = Cesium.JulianDate.addHours(utc, 0, new Cesium.JulianDate())
// 边界，机巢
-
+ this.boundary = useBoundary(this.viewer, { multiple, dockOptions, boundaryChange, boundaryColor, dockRangeType, useDockHeight })
this.viewer?.imageryLayers.removeAll()
this.viewer._cesiumWidget._creditContainer.style.display = 'none'
handler = new Cesium.ScreenSpaceEventHandler(this.viewer?.scene.canvas)
diff --git a/src/views/device/addDevice.vue b/src/views/device/addDevice.vue
index 5ee7377..8b12544 100644
--- a/src/views/device/addDevice.vue
+++ b/src/views/device/addDevice.vue
@@ -277,18 +277,32 @@
},
},
{
- label: '设备描述',// '工作空间描述',
+ label: '设备描述', // '工作空间描述',
prop: 'workspace_desc',
labelWidth: 130,
- // search: true,
searchSpan: 4,
- // editDisabled: true,
rules: [
{
required: true,
message: '请输入设备描述',
trigger: 'blur',
},
+ {
+ max: 30,
+ message: '设备描述不能超过30个字',
+ trigger: 'blur',
+ },
+ // 如果需要更严格的校验（如中文字符计算），可以使用 validator
+ {
+ validator: (rule, value, callback) => {
+ if (value && value.length > 30) {
+ callback(new Error('设备描述不能超过30个字'));
+ } else {
+ callback();
+ }
+ },
+ trigger: 'blur',
+ },
],
},
diff --git a/src/views/resource/components/spotDetails.vue b/src/views/resource/components/spotDetails.vue
index aec18a0..06c273d 100644
--- a/src/views/resource/components/spotDetails.vue
+++ b/src/views/resource/components/spotDetails.vue
@@ -3,7 +3,7 @@
class="spotDialog"
:title="props.title"
v-model="uploadPatchDialog"
- width="75%"
+ width="78%"
align-center
>
<div class="container">
@@ -39,11 +39,13 @@
</el-select>
</template>
<template v-else-if="item.name === '文件名称'">
- <el-input style="width: 102%" v-model="item.value" />
+ <el-input style="width: 102%" v-model="item.value" />
</template>
</template>
- <template v-else >
- <div class="itemValue" :class="{ 'error-text': item.name === '异常图斑数量' }">{{ item.value }}</div>
+ <template v-else>
+ <div class="itemValue" :class="{ 'error-text': item.name === '异常图斑数量' }">
+ {{ item.value }}
+ </div>
</template>
</div>
</div>
@@ -59,9 +61,9 @@
<div class="tabname">图斑列表</div>
<el-table
ref="polygonTableEle"
- highlight-current-row
+ highlight-current-row
:row-class-name="tableRowClassName"
- :data="tableData"
+ :data="tableData"
@row-click="handleLocationPolygon"
>
<el-table-column type="index" align="center" width="30" label="序号">
@@ -144,8 +146,8 @@
let tbJwdList = [];
let total = ref(0);
const refreshonload = inject('searchReset');
-const initialFileName = ref('');
-const initialSpotTypeId = ref('');
+const initialFileName = ref('');
+const initialSpotTypeId = ref('');
const initialSpotTypeLabel = ref('');
// 当前选中的图斑面数据
let nowSelectObj = ref({});
@@ -160,7 +162,7 @@
const selectionList = ref([]);
// 当前在编辑状态的异常图斑
let curCustomPolygon = null;
-
+let lastEntity = null;
// 表格隔行变色
const tableRowClassName = ({ rowIndex }) => {
return rowIndex % 2 === 1 ? 'oddNumberRow' : 'even-row';
@@ -203,13 +205,12 @@
return option ? option.label : '';
};
const updateInfoList = detailData => {
-
if (detailData && (initialFileName.value === '' || initialSpotTypeId.value === '')) {
- initialFileName.value = detailData.file_name || '';
+ initialFileName.value = detailData.file_name || '';
initialSpotTypeId.value = detailData.lot_type_id || '';
- initialSpotTypeLabel.value = detailData.patches_type_desc
- ? detailData.patches_type_desc
- : getPatchTypeLabel(detailData.lot_type_id);
+ initialSpotTypeLabel.value = detailData.patches_type_desc
+ ? detailData.patches_type_desc
+ : getPatchTypeLabel(detailData.lot_type_id);
}
infoList.value = infoList.value.map(item => {
@@ -217,9 +218,17 @@
if (item.name === '图斑类型') {
if (detailData.patches_type_desc !== undefined) {
- return { ...item, value: detailData.patches_type_desc, originalValue: detailData.lot_type_id };
+ return {
+ ...item,
+ value: detailData.patches_type_desc,
+ originalValue: detailData.lot_type_id,
+ };
} else if (detailData.lot_type_id !== undefined) {
- return { ...item, value: getPatchTypeLabel(detailData.lot_type_id), originalValue: detailData.lot_type_id };
+ return {
+ ...item,
+ value: getPatchTypeLabel(detailData.lot_type_id),
+ originalValue: detailData.lot_type_id,
+ };
}
}
@@ -278,7 +287,7 @@
};
// 初始化所有图斑
const entitiesAddSpot = () => {
- viewer?.entities.removeAll(); //清除旧实体
+ viewer?.entities.removeAll();
tableData.value.forEach(item => {
// 取出当中经纬度
const numbersWithCommas = item.dkfw.match(/\d+(\.\d+)?/g);
@@ -290,11 +299,12 @@
...item,
grouped: grouped,
});
+ viewInstance.value.removeById('polygon_dk' + item.id);
// 根据 is_exception 设置颜色
const color =
item.is_exception == 2 ? Cesium.Color.RED.withAlpha(0.5) : Cesium.Color.YELLOW.withAlpha(0.5);
const outlineColor = item.is_exception == 2 ? Cesium.Color.RED : Cesium.Color.YELLOW;
- viewInstance.value?.removeById('polygon_dk' + item.id);
+
homeViewer.value?.entities?.add({
id: 'polygon_dk' + item.id,
customType: 'pattern_spot_polygon',
@@ -324,11 +334,10 @@
const boundingSphere = Cesium.BoundingSphere.fromPoints(positions);
homeViewer.value?.camera.flyToBoundingSphere(boundingSphere, {
duration: 0,
- offset: new Cesium.HeadingPitchRange(
- Cesium.Math.toRadians(-45),
- Cesium.Math.toRadians(-90),
-
- ),
+ offset: new Cesium.HeadingPitchRange(
+ Cesium.Math.toRadians(-45),
+ Cesium.Math.toRadians(-90)
+ ),
});
}
viewInstance.value?.removeLeftClickEvent('spotHighlighting');
@@ -337,88 +346,108 @@
};
// 高亮当前选中图斑，并定位
-const handleLocationPolygon = (data, Deselect) => {
- heightlightSpot(data);
+// const handleLocationPolygon = data => {
+// updateMapSpotInfo(data);
+// };
+const getEntityByDataId = dataId => {
+ if (!homeViewer.value) return null;
+ const entityId = `polygon_dk${dataId}`;
+ return homeViewer.value.entities.getById(entityId);
+};
+const handleLocationPolygon = data => {
+ if (!data) return;
+ const targetEntity = getEntityByDataId(data.id);
+ if (targetEntity) {
+ updateMapSpotInfo(targetEntity);
+ // 同步表格选中状态
+ const clickTableID = tableData.value.findIndex(i => i.id === data.id);
+ const rows = polygonTableEle?.value.$el.querySelectorAll('.el-table__body tr');
+ const targetRow = rows[clickTableID];
+
+ nextTick(() => {
+ const table = polygonTableEle?.value;
+ if (table && targetRow) {
+ table.setCurrentRow(tableData.value[clickTableID]);
+ targetRow.scrollIntoView({ behavior: 'smooth', block: 'center' });
+ }
+ });
+ }
};
// 鼠标触发点击图斑高亮 pick：可以获取当前图斑数据
-const spotHighlighting = (click, pick, viewer) => {
- if (!pick || !(pick.id?.customType == 'pattern_spot_polygon')) return;
- let clickTableID = tableData.value.findIndex(i => i.id == pick.id?.customInfo.id);
- // 计算表格滚动至中间位置
+function spotHighlighting(click, pick, viewer) {
+ let entities = viewer?.scene
+ .drillPick(click.position)
+ .filter(item => item.id)
+ .map(i => i.id)
+ .filter(i => i._customType === 'pattern_spot_polygon');
+ if (!pick || !(pick.id?.customType == 'pattern_spot_polygon')) return;
+ const nowEntity = entities?.[0];
+ const nowData = nowEntity.customInfo;
+ const clickTableID = tableData.value.findIndex(i => i.id === nowData.id);
const rows = polygonTableEle?.value.$el.querySelectorAll('.el-table__body tr');
- let targetRow = rows[clickTableID];
+ const targetRow = rows[clickTableID];
+
nextTick(() => {
const table = polygonTableEle?.value;
- if (!table) return;
- if (targetRow) {
- targetRow.scrollIntoView({
- behavior: 'smooth',
- block: 'center',
- });
- polygonTableEle?.value.setCurrentRow(tableData.value[clickTableID]);
- }
+ if (!table || !targetRow) return;
+ // 表格滚动到中间位置
+ targetRow.scrollIntoView({ behavior: 'smooth', block: 'center' });
+ // 同步表格选中状态
+ table.setCurrentRow(tableData.value[clickTableID]);
});
- // 表格也对应选中数据 TODO
- const data = pick.id?.customInfo;
- // 高亮图斑
- heightlightSpot(data);
-};
-// 选中列表或者点击地图内的图斑 高亮图斑
-const heightlightSpot = data => {
- nowSelectObj.value = data;
- if (!data) {
- clearSelect();
- return;
- }
- const numbersWithCommas = data.dkfw.match(/\d+(\.\d+)?/g);
- const groupedArr = numbersWithCommas.reduce((acc, val, index, src) => {
- if (index % 2 === 0) acc.push(src.slice(index, index + 2));
- return acc;
- }, []);
+ updateMapSpotInfo(nowEntity);
+}
- const polygonCenter = getCenterPoint(groupedArr);
- if (viewInstance.value.getEntityById('polygon_center')) {
- viewInstance.value.removeById('polygon_center');
- }
-
- // 恢复上一个高亮图斑的原始颜色
- if (lastHighlightRow) {
- let lastentity = homeViewer.value.entities?.getById('polygon_dk' + lastHighlightRow.id);
- if (lastentity && lastentity.polygon) {
- // 根据is_exception恢复原始颜色
- const originalColor =
- lastHighlightRow.is_exception == 2
+// 更新上一个和这一个信息
+function updateMapSpotInfo(nowEntity) {
+ const nowData = nowEntity.customInfo;
+ if (!nowEntity) return;
+ if (nowEntity.customInfo.id === lastEntity?.customInfo.id) return;
+ // 设置新的
+ nowEntity.polygon.material = Cesium.Color.RED.withAlpha(0);
+ nowEntity.polyline.material = Cesium.Color.RED;
+ // 重置上一个
+ if (lastEntity) {
+ const lastData = lastEntity.customInfo;
+ const originalFillColor =
+ lastData.is_exception === 2
? Cesium.Color.RED.withAlpha(0.5)
: Cesium.Color.YELLOW.withAlpha(0.5);
- const originalOutline =
- lastHighlightRow.is_exception == 2 ? Cesium.Color.RED : Cesium.Color.YELLOW;
+ const originalOutlineColor = lastData.is_exception == 2
+ ? Cesium.Color.RED
+ : Cesium.Color.YELLOW;
- lastentity.polygon.material = originalColor;
- lastentity.polygon.outlineColor = originalOutline;
- lastentity.polygon.outlineWidth = 2;
- }
+ lastEntity.polygon.material = originalFillColor;
+ lastEntity.polygon.outlineColor = originalOutlineColor;
+ lastEntity.polyline.material = originalOutlineColor;
}
-
- let Nowentity = homeViewer.value.entities?.getById('polygon_dk' + data.id);
- if (Nowentity && Nowentity.polygon) {
- Nowentity.polygon.material = Cesium.Color.RED.withAlpha(0);
- Nowentity.polygon.outlineColor = Cesium.Color.RED;
+ lastEntity = nowEntity;
+ const numbersWithCommas = nowData.dkfw.match(/\d+(\.\d+)?/g);
+ if (numbersWithCommas) {
+ // 解析经纬度数组
+ const groupedArr = numbersWithCommas.reduce((acc, val, index, src) => {
+ if (index % 2 === 0) acc.push(src.slice(index, index + 2));
+ return acc;
+ }, []);
+ const polygonCenter = getCenterPoint(groupedArr);
+ // 相机定位
+ homeViewer.value.scene.camera.setView({
+ destination: Cesium.Cartesian3.fromDegrees(
+ Number(polygonCenter.lng),
+ Number(polygonCenter.lat),
+ 1500
+ ),
+ zIndex: 100,
+ });
}
- homeViewer.value.scene.camera.setView({
- destination: Cesium.Cartesian3.fromDegrees(
- Number(polygonCenter.lng),
- Number(polygonCenter.lat),
- 1500
- ),
- zIndex: 100,
- });
- lastHighlightRow = data;
-};
+ // flyMapSpot(nowEntity?.customInfo)
+}
// 清空选中的数据
const clearSelect = () => {
lastHighlightRow = null;
selectionList.value = [];
+ viewer?.entities.removeAll();
};
// 编辑
const handleSelectionChange = row => {
@@ -451,49 +480,47 @@
// 保存
const handleSave = () => {
- const fileNameItem = infoList.value.find(item => item.name === '文件名称');
- const patchTypeItem = infoList.value.find(item => item.name === '图斑类型');
- let lotTypeId;
- // 检查value是否为数字类型（包括字符串形式的数字）
- const isValueNumber =
- !isNaN(Number(patchTypeItem.value)) &&
- patchTypeItem.value !== '' &&
- patchTypeItem.value !== null &&
- patchTypeItem.value !== undefined;
- console.log('isValueNumber',isValueNumber);
- if (isValueNumber) {
- // 转换为数字类型
- lotTypeId = Number(patchTypeItem.value);
- } else {
- // 使用原始值
- lotTypeId = patchTypeItem.originalValue;
- }
- // 构建请求参数
- const updateParams = {
- file_name: fileNameItem.value,
- lot_type_id: lotTypeId,
- type: lotTypeId,
- id: props.detailList.id,
- };
- patchEditApi(updateParams).then(res => {
- ElMessage.success(res.data.data);
- refreshonload();
- uploadPatchDialog.value = false;
- });
+ const fileNameItem = infoList.value.find(item => item.name === '文件名称');
+ const patchTypeItem = infoList.value.find(item => item.name === '图斑类型');
+ let lotTypeId;
+ // 检查value是否为数字类型（包括字符串形式的数字）
+ const isValueNumber =
+ !isNaN(Number(patchTypeItem.value)) &&
+ patchTypeItem.value !== '' &&
+ patchTypeItem.value !== null &&
+ patchTypeItem.value !== undefined;
+ if (isValueNumber) {
+ // 转换为数字类型
+ lotTypeId = Number(patchTypeItem.value);
+ } else {
+ // 使用原始值
+ lotTypeId = patchTypeItem.originalValue;
+ }
+ // 构建请求参数
+ const updateParams = {
+ file_name: fileNameItem.value,
+ lot_type_id: lotTypeId,
+ type: lotTypeId,
+ id: props.detailList.id,
+ };
+ patchEditApi(updateParams).then(res => {
+ ElMessage.success(res.data.data);
+ refreshonload();
+ uploadPatchDialog.value = false;
+ });
};
// 取消
const handleCancel = () => {
const fileNameItem = infoList.value.find(item => item.name === '文件名称');
const spotTypeItem = infoList.value.find(item => item.name === '图斑类型');
-
if (fileNameItem) {
- fileNameItem.value = initialFileName.value;
+ fileNameItem.value = initialFileName.value;
}
if (spotTypeItem) {
- spotTypeItem.value = initialSpotTypeLabel.value;
- spotTypeItem.originalValue = initialSpotTypeId.value;
+ spotTypeItem.value = initialSpotTypeLabel.value;
+ spotTypeItem.originalValue = initialSpotTypeId.value;
}
- clearSelect();
+ clearSelect();
isDrawPolygon.value = false; // 关闭地图绘制状态
uploadPatchDialog.value = false;
};
@@ -536,10 +563,9 @@
:global(.spotDialog .el-dialog__header span) {
padding-left: 16px !important;
display: inline-block;
-
}
:global(.spotDialog .el-dialog__header) .el-dialog__title {
- font-family: "Source Han Sans CN" !important;
+ font-family: 'Source Han Sans CN' !important;
font-weight: bold !important;
font-size: 16px !important;
color: #363636 !important;
@@ -611,11 +637,11 @@
flex: 1;
padding-left: 10px;
.itemValue {
- padding-left: 6px;
- color: #7B7B7B;
+ padding-left: 6px;
+ color: #7b7b7b;
}
- .error-text{
- color: #FF0A0A;
+ .error-text {
+ color: #ff0a0a;
}
}
}
@@ -653,7 +679,7 @@
font-size: 14px;
color: #ffffff;
}
-
+
// 表格样式
:deep(.el-table) {
// 清除表格内部横线和竖线
@@ -703,7 +729,7 @@
// 表格主体
.el-table__body {
tr:hover > td {
- background-color: var(--el-table-row-hover-bg-color) !important;
+ background-color: rgba(0, 0, 0, 0.6) !important;
}
td {
@@ -713,30 +739,29 @@
// 选中行
.current-row td {
- background-color: var(--el-table-current-row-bg-color) !important;
+ background-color: rgba(0, 0, 0, 0.6) !important;
}
}
-:deep(.el-table__body) {
- tr {
- height: 46px;
+ :deep(.el-table__body) {
+ tr {
+ height: 46px;
+ }
+ td {
+ padding: 8px 0;
+ }
}
- td {
- padding: 8px 0;
- }
-}
.operationspan {
cursor: pointer;
}
.operationspan:first-child {
margin-right: 10px;
}
-
+
// 分页
:deep(.pagination-container) {
background: transparent !important;
}
:deep(.el-pagination) {
-
.btn-prev,
.btn-next {
padding: 5px 6px;
@@ -762,15 +787,15 @@
border-radius: 8px 8px 8px 8px !important;
}
.pagination-container {
- margin-top: auto;
- padding: 8px 5px !important;
+ margin-top: auto;
+ padding: 8px 5px !important;
background: white;
display: flex;
justify-content: center;
height: auto; // 取消固定高度20px，避免内容被截断
margin: 24px 0 14px 0;
- width: 100%;
- box-sizing: border-box
+ width: 100%;
+ box-sizing: border-box;
}
}
:deep(.el-tooltip__popper) {
@@ -778,13 +803,14 @@
max-width: 300px;
}
.el-table {
- flex: 1;
+ flex: 1;
overflow: auto;
}
.btnGroups {
position: absolute;
bottom: 49px;
left: 50%;
+ transform: translate(-50%);
img {
width: 125px;
height: 45px;
diff --git a/src/views/resource/patchManagement.vue b/src/views/resource/patchManagement.vue
index 6adeb8f..eb5e28c 100644
--- a/src/views/resource/patchManagement.vue
+++ b/src/views/resource/patchManagement.vue
@@ -535,6 +535,7 @@
};
// 图斑上传
const uploadFlightFile = (file, t) => {
+loading.value = true
const fileSuffix = file.name.substring(file.name.lastIndexOf('.') + 1);
if (!['kmz', 'kml', 'zip'].includes(fileSuffix)) {
return ElMessage.error('请上传zip/kmz/kml格式的文件');
@@ -567,7 +568,7 @@
if (ruleFormRef.value) {
ruleFormRef.value.resetFields();
}
-
+loading.value = true
searchReset();
});
};
--
Gitblit v1.9.3