|
@ -1,9 +1,5 @@ |
|
|
<template> |
|
|
<template> |
|
|
<SyDialog |
|
|
<SyDialog dialog-class="layer-tree-dialog" :dialog-show="showDialog" :style="style"> |
|
|
dialog-class="layer-tree-dialog" |
|
|
|
|
|
:dialog-show="showDialog" |
|
|
|
|
|
:style="style" |
|
|
|
|
|
> |
|
|
|
|
|
<template #body> |
|
|
<template #body> |
|
|
<Tree |
|
|
<Tree |
|
|
ref="layerTreeRef" |
|
|
ref="layerTreeRef" |
|
@ -22,11 +18,7 @@ |
|
|
<template v-slot:default="{ data, onMouseoverTip }"> |
|
|
<template v-slot:default="{ data, onMouseoverTip }"> |
|
|
<div class="item-name"> |
|
|
<div class="item-name"> |
|
|
<div class="icon"> |
|
|
<div class="icon"> |
|
|
<img |
|
|
<img v-if="data && !data.iconCls" src="@/assets/map/icon-layer.png" alt="" /> |
|
|
v-if="data && !data.iconCls" |
|
|
|
|
|
src="@/assets/map/icon-layer.png" |
|
|
|
|
|
alt="" |
|
|
|
|
|
/> |
|
|
|
|
|
<img v-else src="@/assets/map/icon-folder.png" alt="" /> |
|
|
<img v-else src="@/assets/map/icon-folder.png" alt="" /> |
|
|
</div> |
|
|
</div> |
|
|
<span class="name" @mouseover="onMouseoverTip($event)"> |
|
|
<span class="name" @mouseover="onMouseoverTip($event)"> |
|
@ -35,11 +27,7 @@ |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
<template v-slot:right="{ data }"> |
|
|
<template v-slot:right="{ data }"> |
|
|
<span |
|
|
<span class="btn-item" v-if="data && !data.iconCls" @click.stop="flyTo(data)"> |
|
|
class="btn-item" |
|
|
|
|
|
v-if="data && !data.iconCls" |
|
|
|
|
|
@click.stop="flyTo(data)" |
|
|
|
|
|
> |
|
|
|
|
|
<iconpark-icon size="16" name="location"></iconpark-icon> |
|
|
<iconpark-icon size="16" name="location"></iconpark-icon> |
|
|
</span> |
|
|
</span> |
|
|
</template> |
|
|
</template> |
|
@ -49,14 +37,7 @@ |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script setup lang="ts"> |
|
|
<script setup lang="ts"> |
|
|
import { |
|
|
import { ref, watch, computed, nextTick, onMounted, onBeforeUnmount } from "vue"; |
|
|
ref, |
|
|
|
|
|
watch, |
|
|
|
|
|
computed, |
|
|
|
|
|
nextTick, |
|
|
|
|
|
onMounted, |
|
|
|
|
|
onBeforeUnmount, |
|
|
|
|
|
} from "vue"; |
|
|
|
|
|
import SyDialog from "@/components/Dialog/index.vue"; |
|
|
import SyDialog from "@/components/Dialog/index.vue"; |
|
|
import { useProjectStore } from "@/store/modules/project"; |
|
|
import { useProjectStore } from "@/store/modules/project"; |
|
|
import { useLayer } from "@/hooks/web/useProject"; |
|
|
import { useLayer } from "@/hooks/web/useProject"; |
|
@ -118,6 +99,13 @@ const handleCheckChange = (data: any, checkedData: any) => { |
|
|
} |
|
|
} |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const layerChange = (data: any) => { |
|
|
|
|
|
const node = layerTreeRef.value?.getNode(data.id); |
|
|
|
|
|
node.checked = !node.checked; |
|
|
|
|
|
const checkedKeys = layerTreeRef.value?.getCheckedKeys(); |
|
|
|
|
|
handleCheckChange(data, { checkedKeys }); |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
watch( |
|
|
watch( |
|
|
() => sceneConfig.value, |
|
|
() => sceneConfig.value, |
|
|
(val) => { |
|
|
(val) => { |
|
@ -133,10 +121,15 @@ watch( |
|
|
}, 500); |
|
|
}, 500); |
|
|
}); |
|
|
}); |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
); |
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
|
|
window.$bus.$on("change-layer", layerChange); |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
onBeforeUnmount(() => { |
|
|
onBeforeUnmount(() => { |
|
|
|
|
|
window.$bus.$off("change-layer"); |
|
|
removeViewerClick(); |
|
|
removeViewerClick(); |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
</script> |
|
|