diff --git a/src/views/demo/workmanagement/flightannotation/index.vue b/src/views/demo/workmanagement/flightannotation/index.vue index fbf5d2f..31703ca 100644 --- a/src/views/demo/workmanagement/flightannotation/index.vue +++ b/src/views/demo/workmanagement/flightannotation/index.vue @@ -18,6 +18,7 @@ @setNowShowAnnotationData="setNowShowAnnotationData" @setAllAnnotationData="setAllAnnotationData" @deleteAnnotation="deleteAnnotation" + @treeDataShowOrHide="treeDataShowOrHide" /> @@ -29,6 +30,7 @@ :nowShowAnnotationData="nowShowAnnotationData" @setNowShowAnnotationData="setNowShowAnnotationData" @setAllAnnotationData="setAllAnnotationData" + :treeDataShowOrHideList="treeDataShowOrHideList" /> @@ -154,6 +156,12 @@ }); } + // 项目级别的显示或者隐藏 + const treeDataShowOrHideList = ref([]); + function treeDataShowOrHide(value) { + treeDataShowOrHideList.value = value; + } + // 移动位置 function handlerLocation(position) { pathMapRef.value.handlerLocation([position.lng, position.lat]); diff --git a/src/views/demo/workmanagement/flightannotation/pathAnnotationInfo.vue b/src/views/demo/workmanagement/flightannotation/pathAnnotationInfo.vue index d505d34..45fa2a1 100644 --- a/src/views/demo/workmanagement/flightannotation/pathAnnotationInfo.vue +++ b/src/views/demo/workmanagement/flightannotation/pathAnnotationInfo.vue @@ -433,8 +433,8 @@ // 移动到中心位置 function handlerLocation() { emits('handlerLocation', { - lng: parseFloat(props.nowShowAnnotationData.coordinates[0]), - lat: parseFloat(props.nowShowAnnotationData.coordinates[1]), + lng: parseFloat(props.nowShowAnnotationData.properties.centerPoint[0]), + lat: parseFloat(props.nowShowAnnotationData.properties.centerPoint[1]), }); } // 删除此标注 @@ -507,9 +507,6 @@ heightlist.push(item[2]); }); heightDiff.value = (Math.max(...heightlist) - Math.min(...heightlist)).toFixed(2); - console.log(horizontalArea.value); - console.log(horizontalPerimeter.value); - console.log(heightDiff.value); } } defineExpose({ diff --git a/src/views/demo/workmanagement/flightannotation/pathLeftMenu.vue b/src/views/demo/workmanagement/flightannotation/pathLeftMenu.vue index 8a96846..db83ab2 100644 --- a/src/views/demo/workmanagement/flightannotation/pathLeftMenu.vue +++ b/src/views/demo/workmanagement/flightannotation/pathLeftMenu.vue @@ -45,11 +45,19 @@ style="color: #ffffff; font-size: 16px" /> -
{{ dataRef.title }} + +
+
@@ -122,7 +130,9 @@ 'setNowShowAnnotationData', 'setAllAnnotationData', 'deleteAnnotation', + 'treeDataShowOrHide', ]); + const showMenuInfoName = ref('地图标注'); function updateShowMenuInfoList(type) { @@ -135,10 +145,40 @@ function changeLeftMenuShow() { emits('changeLeftMenuShow'); } + // 项目级别的显示或者隐藏 + function changeWorkSpaceShowOrHide() { + treeDataShowOrHideList = []; + treeData.value.forEach((tree) => { + treeDataShowOrHideList.push({ + id: tree.key, + showOrHide: tree.showOrHide, + }); + }); + let showIdList: any = []; + treeDataShowOrHideList.map((item) => { + if (item.showOrHide) { + showIdList.push(item.id); + } + }); + emits('treeDataShowOrHide', showIdList); + } + // 查找项目级别的显示或者隐藏 + function getShowOrHide(id) { + if (treeDataShowOrHideList.length > 0) { + const item = treeDataShowOrHideList.find((item) => item.id === id); + return item ? item.showOrHide : true; + } else { + return true; + } + } // 地图标注-搜索 const treeData: any = ref([]); + // 记录项目级别的显示或者隐藏 + let treeDataShowOrHideList: any = []; + // 展开 const expandedKeys: any = ref([]); + // 搜索 const searchValue = ref(''); function handleChangeAnnotationSearch() { treeData.value = []; @@ -150,6 +190,7 @@ treeData.value.push({ key: item.Id, title: item.WorkspaceName, + showOrHide: getShowOrHide(item.Id), children: [], }); }); @@ -159,7 +200,6 @@ let allAnnotationDataList = props.allAnnotationDataList.sort((a, b) => { return dayjs(a.createTime) - dayjs(b.createTime); }); - allAnnotationDataList.forEach((annotation) => { treeData.value.forEach((tree) => { if (tree.key == annotation.workSpaceId) { @@ -178,6 +218,7 @@ }); } } + // 地图标注-删除标注 function deleteAnnotation(show) { show.deleteClickNum = 0; @@ -219,21 +260,28 @@ // 移动到中心位置 function handlerLocation(position) { - if (showMenuInfoName.value == '地图标注') { - if (position.geomtype == 'Circle') { - emits('handlerLocation', { - lng: parseFloat(position.coordinates[0]), - lat: parseFloat(position.coordinates[1]), - }); - } else { - emits('handlerLocation', { - lng: parseFloat(position.coordinates[0]), - lat: parseFloat(position.coordinates[1]), - }); - } - } + emits('handlerLocation', { + lng: parseFloat(position.properties.centerPoint[0]), + lat: parseFloat(position.properties.centerPoint[1]), + }); } + watch( + () => props.nowShowAnnotationData, + () => { + treeData.value.forEach((tree) => { + tree.children?.forEach((t) => { + if (t.id == props.nowShowAnnotationData.id) { + t.title = props.nowShowAnnotationData.name; + } + }); + }); + }, + { + deep: true, + }, + ); + defineExpose({ updateShowMenuInfoList, }); @@ -288,6 +336,7 @@ .leftMenuContent_tree { overflow-y: auto; max-height: 750px; + width: 100%; } } } @@ -305,6 +354,7 @@ gap: 5px; .eye { + position: relative; display: flex; align-items: center; justify-content: center; @@ -312,20 +362,31 @@ height: 20px; } .title_mouse { + position: relative; width: 135px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .title_nomouse { + position: relative; width: 170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } + .buttonSwitch { + position: absolute; + right: 15px; + display: flex; + align-items: center; + justify-content: center; + width: 60px; + height: 20px; + } .buttonRight2 { position: absolute; - right: -15px; + right: 30px; width: 20px; height: 20px; display: flex; @@ -334,7 +395,7 @@ } .buttonRight1 { position: absolute; - right: -35px; + right: 5px; width: 20px; height: 20px; display: flex; @@ -363,13 +424,16 @@ ::v-deep .ant-tree { color: #ffffff !important; } - + ::v-deep .ant-tree-treenode { + width: 100% !important; + } + ::v-deep .ant-tree-node-content-wrapper { + width: 100% !important; + } ::v-deep .ant-tree-switcher { color: #ffffff !important; } ::v-deep .ant-tree-node-selected { background: #25384c !important; } - - // diff --git a/src/views/demo/workmanagement/flightannotation/pathMap.vue b/src/views/demo/workmanagement/flightannotation/pathMap.vue index c7222f2..cbf866c 100644 --- a/src/views/demo/workmanagement/flightannotation/pathMap.vue +++ b/src/views/demo/workmanagement/flightannotation/pathMap.vue @@ -174,6 +174,7 @@ 'allAnnotationDataList', 'allWorkspaceDataList', 'nowShowAnnotationData', + 'treeDataShowOrHideList', ]); const emits = defineEmits(['setNowShowAnnotationData', 'setAllAnnotationData']); @@ -591,6 +592,41 @@ deep: true, }, ); + watch( + () => props.treeDataShowOrHideList, + () => { + let tempGraphicLayerList = [ + // 点 + ...annotation_PointGraphicData, + // 线 + ...annotation_LineStringGraphicData, + // 多边形 + ...annotation_PolygonGraphicData, + // 圆 + ...annotation_CircleGraphicData, + ]; + tempGraphicLayerList?.forEach((graphicLayer) => { + if (props.treeDataShowOrHideList.includes(graphicLayer.options.workSpaceId)) { + graphicLayer.setStyle({ + show: graphicLayer.options.state == 0 ? true : false, + outline: graphicLayer.options.state == 0 ? true : false, + label: { + show: graphicLayer.options.state == 0 ? true : false, + }, + }); + } else { + graphicLayer.setStyle({ + show: false, + outline: false, + label: { + show: false, + }, + }); + } + }); + }, + ); + // 地图标注-初始化-遍历展示 const showAllAnnotationDataList = async () => { // 删除旧数据 @@ -693,6 +729,8 @@ }, show: item.state == 0 ? true : false, hasEdit: true, + state: item.state, + workSpaceId: item.workSpaceId, }); // 监听mouseover事件 pointGraphic.on(mars3d.EventType.mouseOver, function () { @@ -773,6 +811,8 @@ show: item.state == 0 ? true : false, hasEdit: true, drawShowMeasure: true, + state: item.state, + workSpaceId: item.workSpaceId, }); // 监听mouseover事件 lineGraphic.on(mars3d.EventType.mouseOver, function () { @@ -897,6 +937,8 @@ show: item.state == 0 ? true : false, hasEdit: true, drawShowMeasure: true, + state: item.state, + workSpaceId: item.workSpaceId, }); // 监听mouseover事件 polygonGraphic.on(mars3d.EventType.mouseOver, function () { @@ -1025,6 +1067,8 @@ show: item.state == 0 ? true : false, hasEdit: true, drawShowMeasure: true, + state: item.state, + workSpaceId: item.workSpaceId, }); // 监听mouseover事件 circleGraphic.on(mars3d.EventType.mouseOver, function () {