fix: BUG修改

This commit is contained in:
kun 2023-11-15 18:22:33 +08:00
parent 828db06ac8
commit 66aebd3a86
2 changed files with 349 additions and 159 deletions

View File

@ -79,7 +79,7 @@
<!-- 图层添加 -->
<div class="layer-add" v-if="layersShow">
<div class="layer-add-title">
<span>图层</span>
<span>图层1</span>
<el-icon size="16" color="#fff" @click="layersShow = false"><Close /></el-icon>
</div>
<div class="layer-add-tree">
@ -90,7 +90,7 @@
:props="props"
show-checkbox
node-key="id"
@check-change="handleCheckChange"
@check="handleCheckChange"
/>
</div>
</div>
@ -111,18 +111,18 @@
<!-- 分屏对比弹框 -->
<div class="screen-layer-add" v-if="screenComparisonShow" v-draggable>
<div class="screen-layer-add-title">
<span>图层</span>
<span>图层2</span>
<el-icon size="16" color="#fff" @click="clearScreenComparison"><Close /></el-icon>
</div>
<div class="screen-layer-add-tree">
<el-tree
:default-expanded-keys="expandedKeys"
:default-checked-keys="checkedKeys"
:data="treeData"
:default-expanded-keys="splitScreenExpandedKeys"
:default-checked-keys="splitScreenCheckedKeys"
:data="splitScreenTreeData"
:props="props"
show-checkbox
node-key="id"
@check-change="handleCheckChange"
@check="handleCheckChangeMapSplitScreen"
/>
</div>
</div>
@ -325,8 +325,12 @@ const skyProperty = ref({
});
const checkedKeys = ref<any[]>([]);
const expandedKeys = ref<any>([]);
const splitScreenCheckedKeys = ref<any[]>([]);
const splitScreenExpandedKeys = ref<any>([]);
const layersObj: any = {};
const splitScreenLayersObj: any = {};
const treeData = ref<any>([]);
const splitScreenTreeData = ref<any>([]);
const props = {
label: "title",
children: "children"
@ -1033,88 +1037,122 @@ const addRandomGraphicByCount = (graphicLayer: any, position: any) => {
});
graphicLayer.addGraphic(graphicImg);
};
// const handleCheckChange = (e: any, isCheck: any) => {
// const layer = layersObj[e.key];
// if (layer) {
// if (!layer.isAdded) {
// map.addLayer(layer);
// }
// //
// if (e.children && e.children.length) {
// renderChildNode(isCheck, e.children);
// }
// if (isCheck) {
// layer.show = true;
// layer.flyTo();
// } else {
// layer.show = false;
// }
// }
// };
const handleCheckChange = (e: any, isCheck: any, haveChildCheck: any) => {
const handleCheckChange = (e: any, obj: any) => {
console.log(e);
const layer = layersObj[e.key];
const isChildern = e.children;
console.log("node", e);
console.log(layer);
console.log(isCheck);
console.log(haveChildCheck);
const keys = obj.checkedKeys;
if (layer) {
if (!layer.isAdded) {
map.addLayer(layer);
}
if (layer && !isChildern && isCheck) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
//
if (e.children && e.children.length) {
renderChildNode(keys, e.children);
}
//
if (isChildern && isChildern.length === 0 && !e.checked) {
map.addLayer(layer);
}
//
if (e.children && e.children.length) {
renderChildNode(isCheck, e.children, e.key);
}
//
if (isChildern && isChildern.length === 0 && e.checked) {
layer.show = false;
if (keys.indexOf(e.key) !== -1) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
if (!findItem) return;
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
}
};
const renderChildNode = (isCheck: any, children: any[], key: any) => {
const renderChildNode = (keys: string[], children: any[]) => {
children.forEach(child => {
const layer = layersObj[child.key];
if (layer) {
if (!layer.isAdded) {
map.addLayer(layer);
}
if (child.key == key) {
if (isCheck && key == child.key) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNode(isCheck, child.children, child.key);
}
if (keys.indexOf(child.key) !== -1) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNode(keys, child.children);
}
}
});
};
//
const handleCheckChangeMapSplitScreen = (e: any, obj: any) => {
console.log(e);
const layer = layersObj[e.key];
const keys = obj.checkedKeys;
if (layer) {
if (!layer.isAdded) {
mapScreenSplit.mapEx.addLayer(layer);
}
//
if (e.children && e.children.length) {
renderChildNodeMapSplitScreen(keys, e.children);
}
if (keys.indexOf(e.key) !== -1) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
if (!findItem) return;
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
}
};
//
const renderChildNodeMapSplitScreen = (keys: string[], children: any[]) => {
children.forEach(child => {
const layer = layersObj[child.key];
if (layer) {
if (!layer.isAdded) {
mapScreenSplit.mapEx.addLayer(layer);
}
if (keys.indexOf(child.key) !== -1) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNodeMapSplitScreen(keys, child.children);
}
}
});
@ -1168,7 +1206,57 @@ const findChild = (parent: any, list: any[]) => {
return node;
});
};
//
const initSplitScreenTree = () => {
const layers = map.getLayers({
basemaps: false, // config.jsonbasempas
layers: true // config.jsonlayers
});
console.log(layers);
// config.jsonbasempaslayers
for (let i = layers.length - 1; i >= 0; i--) {
const layer = layers[i];
if (layer && layer.pid === -1) {
const node: any = {
title: layer.name,
key: layer.id,
id: layer.id,
pId: layer.pid,
group: layer.type === "group"
};
node.children = splitScreenFindChild(node, layers);
splitScreenTreeData.value.push(node);
splitScreenLayersObj[layer.id] = layer;
splitScreenExpandedKeys.value.push(node.key);
}
}
};
const splitScreenFindChild = (parent: any, list: any[]) => {
console.log(list, "11122233344455666");
console.log(parent, "23121314488888772226699");
return list
.filter((item: any) => item.pid === parent.id)
.map((item: any) => {
const node: any = {
title: item.name,
key: item.id,
id: item.id,
pId: item.pid,
group: item.type === "group"
};
splitScreenLayersObj[item.id] = item;
splitScreenExpandedKeys.value.push(node.key);
if (item.hasEmptyGroup || item.hasChildLayer) {
node.children = splitScreenFindChild(node, list);
}
if (item.isAdded && item.show) {
splitScreenCheckedKeys.value.push(node.key);
}
return node;
});
};
//
const yuOperate = (e: any, label: any) => {
console.log(e, label);
@ -1883,8 +1971,13 @@ onUnmounted(() => {
.cesium-cesiumInspector {
background-color: rgba(23, 49, 71, 0.8);
}
/**覆çmars3d内部控件的颜色等样式*/
//
.mars3d-compass {
bottom: calc(50% - 35px) !important;
left: 5px !important;
top: auto !important;
right: auto !important;
}
.mars3d-compass .mars3d-compass-outer {
fill: rgba(23, 49, 71, 0.8);
}

View File

@ -79,7 +79,7 @@
<!-- 图层添加 -->
<div class="layer-add" v-if="layersShow">
<div class="layer-add-title">
<span>图层</span>
<span>图层1</span>
<el-icon size="16" color="#fff" @click="layersShow = false"><Close /></el-icon>
</div>
<div class="layer-add-tree">
@ -90,7 +90,7 @@
:props="props"
show-checkbox
node-key="id"
@check-change="handleCheckChange"
@check="handleCheckChange"
/>
</div>
</div>
@ -111,18 +111,18 @@
<!-- 分屏对比弹框 -->
<div class="screen-layer-add" v-if="screenComparisonShow" v-draggable>
<div class="screen-layer-add-title">
<span>图层</span>
<span>图层2</span>
<el-icon size="16" color="#fff" @click="clearScreenComparison"><Close /></el-icon>
</div>
<div class="screen-layer-add-tree">
<el-tree
:default-expanded-keys="expandedKeys"
:default-checked-keys="checkedKeys"
:data="treeData"
:default-expanded-keys="splitScreenExpandedKeys"
:default-checked-keys="splitScreenCheckedKeys"
:data="splitScreenTreeData"
:props="props"
show-checkbox
node-key="id"
@check-change="handleCheckChange"
@check="handleCheckChangeMapSplitScreen"
/>
</div>
</div>
@ -325,8 +325,12 @@ const skyProperty = ref({
});
const checkedKeys = ref<any[]>([]);
const expandedKeys = ref<any>([]);
const splitScreenCheckedKeys = ref<any[]>([]);
const splitScreenExpandedKeys = ref<any>([]);
const layersObj: any = {};
const splitScreenLayersObj: any = {};
const treeData = ref<any>([]);
const splitScreenTreeData = ref<any>([]);
const props = {
label: "title",
children: "children"
@ -633,6 +637,8 @@ const clickMenu = (name: any) => {
screenComparisonShow.value = true;
//
screenComparison();
//
initSplitScreenTree();
}
toolListShow.value = false;
};
@ -1035,88 +1041,122 @@ const addRandomGraphicByCount = (graphicLayer: any, position: any) => {
});
graphicLayer.addGraphic(graphicImg);
};
// const handleCheckChange = (e: any, isCheck: any) => {
// const layer = layersObj[e.key];
// if (layer) {
// if (!layer.isAdded) {
// map.addLayer(layer);
// }
// //
// if (e.children && e.children.length) {
// renderChildNode(isCheck, e.children);
// }
// if (isCheck) {
// layer.show = true;
// layer.flyTo();
// } else {
// layer.show = false;
// }
// }
// };
const handleCheckChange = (e: any, isCheck: any, haveChildCheck: any) => {
//
const handleCheckChangeMapSplitScreen = (e: any, obj: any) => {
console.log(e);
const layer = layersObj[e.key];
const isChildern = e.children;
console.log("node", e);
console.log(layer);
console.log(isCheck);
console.log(haveChildCheck);
const keys = obj.checkedKeys;
if (layer) {
if (!layer.isAdded) {
mapScreenSplit.mapEx.addLayer(layer);
}
if (layer && !isChildern && isCheck) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
//
if (e.children && e.children.length) {
renderChildNodeMapSplitScreen(keys, e.children);
}
//
if (isChildern && isChildern.length === 0 && !e.checked) {
map.addLayer(layer);
}
//
if (e.children && e.children.length) {
renderChildNode(isCheck, e.children, e.key);
}
//
if (isChildern && isChildern.length === 0 && e.checked) {
layer.show = false;
if (keys.indexOf(e.key) !== -1) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
if (!findItem) return;
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
}
};
const renderChildNode = (isCheck: any, children: any[], key: any) => {
//
const renderChildNodeMapSplitScreen = (keys: string[], children: any[]) => {
children.forEach(child => {
const layer = layersObj[child.key];
if (layer) {
if (!layer.isAdded) {
mapScreenSplit.mapEx.addLayer(layer);
}
if (keys.indexOf(child.key) !== -1) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNodeMapSplitScreen(keys, child.children);
}
}
});
};
const handleCheckChange = (e: any, obj: any) => {
console.log(e);
const layer = layersObj[e.key];
const keys = obj.checkedKeys;
if (layer) {
if (!layer.isAdded) {
map.addLayer(layer);
}
//
if (e.children && e.children.length) {
renderChildNode(keys, e.children);
}
if (keys.indexOf(e.key) !== -1) {
setTimeout(function () {
//
let findItem: any = albugineaList.value.find(item => item.id == e.key);
console.log(findItem);
if (!findItem) return;
let initCenter: any;
initCenter = {
lng: layer.orginCenterPoint.lng,
lat: layer.orginCenterPoint.lat,
alt: layer.orginCenterPoint.alt
};
layer.position = {
lng: initCenter.lng + +findItem.lng,
lat: initCenter.lat + +findItem.lat,
alt: initCenter.alt + +findItem.alt
};
console.log(layer.position);
}, 200);
layer.show = true;
layer.flyTo();
} else {
layer.show = false;
}
}
};
const renderChildNode = (keys: string[], children: any[]) => {
children.forEach(child => {
const layer = layersObj[child.key];
if (layer) {
if (!layer.isAdded) {
map.addLayer(layer);
}
if (child.key == key) {
if (isCheck && key == child.key) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNode(isCheck, child.children, child.key);
}
if (keys.indexOf(child.key) !== -1) {
layer.show = true;
} else {
layer.show = false;
}
if (child.children) {
renderChildNode(keys, child.children);
}
}
});
@ -1147,6 +1187,57 @@ const initTree = () => {
}
}
};
//
const initSplitScreenTree = () => {
const layers = map.getLayers({
basemaps: false, // config.jsonbasempas
layers: true // config.jsonlayers
});
console.log(layers);
// config.jsonbasempaslayers
for (let i = layers.length - 1; i >= 0; i--) {
const layer = layers[i];
if (layer && layer.pid === -1) {
const node: any = {
title: layer.name,
key: layer.id,
id: layer.id,
pId: layer.pid,
group: layer.type === "group"
};
node.children = splitScreenFindChild(node, layers);
splitScreenTreeData.value.push(node);
splitScreenLayersObj[layer.id] = layer;
splitScreenExpandedKeys.value.push(node.key);
}
}
};
const splitScreenFindChild = (parent: any, list: any[]) => {
console.log(list, "11122233344455666");
console.log(parent, "23121314488888772226699");
return list
.filter((item: any) => item.pid === parent.id)
.map((item: any) => {
const node: any = {
title: item.name,
key: item.id,
id: item.id,
pId: item.pid,
group: item.type === "group"
};
splitScreenLayersObj[item.id] = item;
splitScreenExpandedKeys.value.push(node.key);
if (item.hasEmptyGroup || item.hasChildLayer) {
node.children = splitScreenFindChild(node, list);
}
if (item.isAdded && item.show) {
splitScreenCheckedKeys.value.push(node.key);
}
return node;
});
};
const findChild = (parent: any, list: any[]) => {
return list
.filter((item: any) => item.pid === parent.id)
@ -1886,7 +1977,13 @@ onUnmounted(() => {
background-color: rgba(23, 49, 71, 0.8);
}
/**覆çmars3d内部控件的颜色等样式*/
//
.mars3d-compass {
bottom: calc(50% - 35px) !important;
left: 5px !important;
top: auto !important;
right: auto !important;
}
.mars3d-compass .mars3d-compass-outer {
fill: rgba(23, 49, 71, 0.8);
}