| | |
| | | <template> |
| | | <SatelliteMixTool :group-id="3"></SatelliteMixTool> |
| | | |
| | | <el-row class="wrap"> |
| | | <el-col span="2"> |
| | | <!-- <div class="p-events-auto"> |
| | | <el-button |
| | | type="primary" |
| | | class="el-button-custom" |
| | | size="small" |
| | | @click="previousGrid" |
| | | > |
| | | 上一个 |
| | | </el-button> |
| | | <el-button |
| | | type="primary" |
| | | class="el-button-custom" |
| | | size="small" |
| | | @click="nextGrid" |
| | | > |
| | | 下一个 |
| | | </el-button> |
| | | </div> --> |
| | | <el-row> |
| | | <SatelliteManage |
| | | v-show="show" |
| | | class="satellite-manage" |
| | | :gridDataList="satelliteGridStore.gridDataList" |
| | | :loading="loading" |
| | | @search="onSearch" |
| | | @row-click="handleRowClick" |
| | | @show-rank="handleRankClick" |
| | | @show-data="handleDataClick" |
| | | @change-color="handleColorClick" |
| | | @change-opacity="handleOpacityClick" |
| | | ></SatelliteManage> |
| | | </el-row> |
| | | </el-col> |
| | | <el-col span="2"> |
| | | <el-row> |
| | | <CardButton |
| | | name="卫星遥测数据" |
| | | direction="right" |
| | | @click="() => (show = !show)" |
| | | ></CardButton> |
| | | </el-row> |
| | | </el-col> |
| | | <el-row justify="space-between"> |
| | | <el-row class="wrap"> |
| | | <el-col span="2"> |
| | | <el-row> |
| | | <SatelliteManage |
| | | v-show="show" |
| | | class="satellite-manage" |
| | | :gridDataList="satelliteGridStore.gridDataList" |
| | | :loading="loading" |
| | | @search="onSearch" |
| | | @row-click="handleRowClick" |
| | | ></SatelliteManage> |
| | | </el-row> |
| | | </el-col> |
| | | <el-col span="2"> |
| | | <el-row> |
| | | <CardButton |
| | | name="卫星遥测数据" |
| | | direction="right" |
| | | @click="() => (show = !show)" |
| | | ></CardButton> |
| | | </el-row> |
| | | <el-row class="flex-col"> |
| | | <GridStyleTool |
| | | @show-rank="handleRankClick" |
| | | @show-data="handleDataClick" |
| | | @change-color="handleColorClick" |
| | | @change-opacity="handleOpacityClick" |
| | | ></GridStyleTool> |
| | | </el-row> |
| | | </el-col> |
| | | </el-row> |
| | | <GridTool></GridTool> |
| | | </el-row> |
| | | <SatelliteDataMix class="data-mix" @mix-data="handleMixDataClick"> |
| | | </SatelliteDataMix> |
| | | <!-- <SatelliteDataMix class="data-mix" @mix-data="handleMixDataClick"> |
| | | </SatelliteDataMix> --> |
| | | |
| | | <!-- <el-row class="historical" justify="center"> |
| | | <SatelliteAnimation |
| | |
| | | import SatelliteManage from './component/SatelliteManage.vue'; |
| | | import SatelliteDataMix from './component/SatelliteDataMix.vue'; |
| | | import SatelliteMixTool from './component/SatelliteMixTool.vue'; |
| | | import GridStyleTool from './component/GridStyleTool.vue'; |
| | | import { SatelliteProxy } from './SatelliteProxy'; |
| | | import { useFetchData } from '@/composables/fetchData'; |
| | | import { useSatelliteGridStore } from '@/stores/satellite-grid'; |
| | | import { useSceneStore } from '@/stores/scene'; |
| | | import { useGridStore } from '@/stores/grid-info'; |
| | | |
| | | const satelliteProxy = new SatelliteProxy(); |
| | | |
| | | const satelliteGridStore = useSatelliteGridStore(); |
| | | const { loading, fetchData } = useFetchData(10000); |
| | | const gridStore = useGridStore(); |
| | | gridStore.selectedSatelliteProxy = satelliteProxy; |
| | | const sceneStore = useSceneStore(); |
| | | const satelliteGridStore = useSatelliteGridStore(); |
| | | |
| | | const { loading, fetchData } = useFetchData(10000); |
| | | const animaLoading = ref(true); |
| | | const show = ref(true); |
| | | |
| | |
| | | }); |
| | | }); |
| | | //鼠标点击事件 |
| | | polygon.on('click', () => { |
| | | const [lng, lat] = polygon.getExtData(); |
| | | sceneStore.radius = 0.5; |
| | | sceneStore.searchScene(lng, lat); |
| | | }); |
| | | // polygon.on('click', () => { |
| | | // const [lng, lat] = polygon.getExtData(); |
| | | // sceneStore.radius = 0.5; |
| | | // sceneStore.searchScene(lng, lat); |
| | | // }); |
| | | }); |
| | | satelliteProxy.setGridEvent('click', (e) => { |
| | | const polygon = e.target; |
| | | const { gridCell } = polygon.getExtData(); |
| | | const cellIndex = gridCell.cellIndex; |
| | | const gridDataDetail = |
| | | satelliteGridStore.selectedGridDataDetail[cellIndex - 1]; |
| | | gridStore.selectedGridCellAndDataDetail = { |
| | | gridCell, |
| | | gridDataDetail |
| | | }; |
| | | }); |
| | | } |
| | | |
| | | function drawGrid(gridData) { |
| | | satelliteProxy.drawGrid({ gridData }); |
| | | function drawGrid(gridDataDetail) { |
| | | satelliteProxy.drawGrid({ |
| | | gridDataDetail: gridDataDetail, |
| | | useDataTxtColor: true |
| | | }); |
| | | } |
| | | |
| | | function handleRowClick(row) { |
| | |
| | | |
| | | function handleColorClick(isStandardColor) { |
| | | satelliteProxy.drawGrid({ |
| | | gridData: satelliteGridStore.selectedGridData, |
| | | useCustomColor: !isStandardColor |
| | | gridDataDetail: satelliteGridStore.selectedGridDataDetail, |
| | | useCustomColor: !isStandardColor, |
| | | useDataTxtColor: true |
| | | }); |
| | | } |
| | | |
| | | function handleOpacityClick(isOpacity) { |
| | | satelliteProxy.changeGridOpacity({ isOpacity }); |
| | | function handleOpacityClick(value) { |
| | | satelliteProxy.changeGridOpacity({ opacityValue: value }); |
| | | } |
| | | |
| | | function handleMixDataClick(gridData) { |