| | |
| | | <template #overlay> |
| | | <a-menu theme="dark" class="more" style="background: #3c3c3c;"> |
| | | <a-menu-item @click="downloadWayline(wayline.id, wayline.name)"> |
| | | <span>Download</span> |
| | | <span>下载</span> |
| | | </a-menu-item> |
| | | <a-menu-item @click="showWaylineTip(wayline.id)"> |
| | | <span>Delete</span> |
| | | <span>删除</span> |
| | | </a-menu-item> |
| | | </a-menu> |
| | | </template> |
| | |
| | | </span> |
| | | </div> |
| | | <div class="mt5 ml10" style="color: hsla(0,0%,100%,0.35);"> |
| | | <span class="mr10">Update at {{ new Date(wayline.update_time).toLocaleString() }}</span> |
| | | <span class="mr10">更新时间: {{ new Date(wayline.update_time).toLocaleString() }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div v-else> |
| | | <a-empty :image-style="{ height: '60px', marginTop: '60px' }" /> |
| | | </div> |
| | | <a-modal v-model:visible="deleteTip" width="450px" :closable="false" :maskClosable="false" centered :okButtonProps="{ danger: true }" @ok="deleteWayline"> |
| | | <p class="pt10 pl20" style="height: 50px;">Wayline file is unrecoverable once deleted. Continue?</p> |
| | | <a-modal v-model:visible="deleteTip" okText="确定" cancelText="取消" width="450px" :closable="false" :maskClosable="false" centered :okButtonProps="{ danger: true }" @ok="deleteWayline"> |
| | | <p class="pt10 pl20" style="height: 50px;">确定要删除该文件吗?</p> |
| | | <template #title> |
| | | <div class="flex-row flex-justify-center"> |
| | | <span>Delete</span> |
| | | <span>删除</span> |
| | | </div> |
| | | </template> |
| | | </a-modal> |
| | |
| | | import { load } from '@amap/amap-jsapi-loader' |
| | | import { getRoot } from '/@/root' |
| | | |
| | | import * as Cesium from 'cesium' |
| | | let kmlDataSource = null |
| | | |
| | | const { appContext } = getCurrentInstance() |
| | | const global = appContext.config.globalProperties |
| | | |
| | | const loading = ref(false) |
| | | const store = useMyStore() |
| | | const projectId = store.state.common.projectId |
| | | const pagination :IPage = { |
| | | page: 1, |
| | | total: -1, |
| | |
| | | return |
| | | } |
| | | canRefresh.value = false |
| | | getWaylineFiles({ |
| | | workspaceId: projectId, |
| | | getWaylineFiles(workspaceId, { |
| | | page: pagination.page, |
| | | page_size: pagination.page_size, |
| | | order_by: 'update_time desc' |
| | | }).then(res => { |
| | | if (res.code !== 5000) { |
| | | if (res.code !== 0) { |
| | | return |
| | | } |
| | | |
| | | const data = res.data |
| | | |
| | | waylinesData.data = [...waylinesData.data, ...data] |
| | | waylinesData.data = [...waylinesData.data, ...res.data.list] |
| | | pagination.total = res.data.pagination.total |
| | | pagination.page = res.data.pagination.page |
| | | }).finally(() => { |
| | | canRefresh.value = true |
| | | }) |
| | |
| | | } |
| | | |
| | | function selectRoute (wayline: WaylineFile) { |
| | | initKmlFile('/src/assets/kmz/test.kmz') |
| | | store.commit('SET_SELECT_WAYLINE_INFO', wayline) |
| | | } |
| | | |
| | | /** |
| | | * 加载kml文件 |
| | | * @param file |
| | | */ |
| | | function initKmlFile (file:string) { |
| | | const options = { |
| | | camera: global.$viewer.scene.camera, |
| | | canvas: global.$viewer.scene.canvas, |
| | | screenOverlayContainer: global.$viewer.container, |
| | | } |
| | | global.$viewer.dataSources.add( |
| | | Cesium.KmlDataSource.load( |
| | | file, |
| | | options |
| | | )).then(res => { |
| | | kmlDataSource = res |
| | | kmlDataSource.show = true |
| | | |
| | | console.log('Entits数组', kmlDataSource.entities.values) |
| | | |
| | | const kmlEntityArr = kmlDataSource.entities.values[0]._children |
| | | const cartesianArr = [] |
| | | for (let i = 0; i < kmlEntityArr.length; i++) { |
| | | const entity = kmlEntityArr[i] |
| | | entity.point = new Cesium.PointGraphics({ |
| | | pixelSize: 12, |
| | | color: Cesium.Color.RED, |
| | | outlineColor: Cesium.Color.WHITE, |
| | | }) |
| | | entity.billboard = null |
| | | |
| | | cartesianArr.push(entity.position._value) |
| | | } |
| | | |
| | | const lineEntity = global.$viewer.entities.add({ |
| | | name: 'entityLine', |
| | | polyline: { |
| | | positions: cartesianArr, |
| | | width: 10, |
| | | material: new Cesium.PolylineArrowMaterialProperty(Cesium.Color.CYAN), |
| | | }, |
| | | }) |
| | | |
| | | global.$viewer.flyTo(lineEntity, { |
| | | offset: new Cesium.HeadingPitchRange(0, -90, 1000) |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | function onScroll (e: any) { |
| | |
| | | fileList.value.forEach(async (file: FileItem) => { |
| | | const fileData = new FormData() |
| | | fileData.append('file', file, file.name) |
| | | await importKmzFile(projectId, fileData).then((res) => { |
| | | await importKmzFile(workspaceId, fileData).then((res) => { |
| | | if (res.code === 0) { |
| | | message.success(`${file.name} file uploaded successfully`) |
| | | canRefresh.value = true |