| | |
| | | ></FYOptionScene> |
| | | <slot name="left-top"></slot> |
| | | </el-row> |
| | | <!-- <el-row class="right-wrap"> |
| | | <el-col :span="4"> |
| | | <el-button>close</el-button> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | |
| | | </el-col> |
| | | </el-row> --> |
| | | <el-scrollbar class="right-wrap"> |
| | | <div v-for="s in selectedSceneList" :key="s.guid"> |
| | | <el-checkbox |
| | | v-model="s._checked" |
| | | :label="s.name" |
| | | @change="handleChange" |
| | | @change="handleChange(s)" |
| | | /> |
| | | <!-- <el-text>{{ s.name }}</el-text> --> |
| | | </div> |
| | |
| | | if (nV != oV) { |
| | | clearSceneMarks(); |
| | | createSceneMarks(); |
| | | filterMarkViews(); |
| | | filterMarkViews(true); |
| | | } |
| | | }, |
| | | { immediate: true } |
| | |
| | | watch(scenetype, (nV, oV) => { |
| | | if (nV != oV) { |
| | | clearSceneMarks(); |
| | | filterMarkViews(); |
| | | filterMarkViews(true); |
| | | } |
| | | }); |
| | | |
| | | function handleChange(value) { |
| | | console.log(value); |
| | | |
| | | filterMarkViews(); |
| | | function handleChange(scene) { |
| | | const mv = markViewList.find((v) => { |
| | | return scene.guid == v.getExtData().guid; |
| | | }); |
| | | if (scene._checked) { |
| | | map.add(mv); |
| | | } else { |
| | | map.remove(mv); |
| | | } |
| | | // filterMarkViews(); |
| | | } |
| | | |
| | | function createSceneMarks() { |
| | |
| | | /** |
| | | * 筛选所选类型的场景 |
| | | */ |
| | | function filterMarkViews() { |
| | | function filterMarkViews(setFitView) { |
| | | onMapMounted(() => { |
| | | if (markViewList.length > 0) { |
| | | map.remove(markViewList); |
| | | } |
| | | if (scenetype.value == undefined) { |
| | | markViewList = allMarkViews; |
| | | } else { |
| | |
| | | } |
| | | markViewList = markViewList.filter((v) => { |
| | | const _index = selectedSceneList.value.findIndex((s) => { |
| | | console.log(s.guid, v.getExtData().guid); |
| | | |
| | | s.guid == v.getExtData().guid; |
| | | return s.guid == v.getExtData().guid && s._checked; |
| | | }); |
| | | return _index != -1; |
| | | }); |
| | | map.add(markViewList); |
| | | setTimeout(() => { |
| | | map.setFitView(markViewList); |
| | | // const list = markViewList.map((v) => { |
| | | // const _extData = v.getExtData(); |
| | | // return [_extData.longitude, _extData.latitude]; |
| | | // }); |
| | | // mapUtil.setBound(list); |
| | | }, 1000); |
| | | if (setFitView) { |
| | | setTimeout(() => { |
| | | map.setFitView(markViewList); |
| | | // const list = markViewList.map((v) => { |
| | | // const _extData = v.getExtData(); |
| | | // return [_extData.longitude, _extData.latitude]; |
| | | // }); |
| | | // mapUtil.setBound(list); |
| | | }, 1000); |
| | | } |
| | | }); |
| | | } |
| | | |
| | |
| | | border-radius: 4px; |
| | | padding: 2px 8px; |
| | | max-width: 300px; |
| | | box-shadow: var(--el-box-shadow); |
| | | } |
| | | </style> |