diff --git a/public/baseConfig.js b/public/baseConfig.js index ab5fc0dfc..9ab8ddd58 100644 --- a/public/baseConfig.js +++ b/public/baseConfig.js @@ -29,16 +29,19 @@ window['settings'] = { icon: './images/icons/飞机.png', color: '#d00', model: './models/IDF.glb', + payload: 'conic', }, 乙: { icon: './images/icons/舰船.png', color: '#dd0', model: './models/驱逐舰2.glb', + payload: 'radar', }, 丙: { icon: './images/icons/舰船.png', color: '#dd0', model: './models/驱逐舰2.glb', + payload: 'radar', }, }, @@ -68,4 +71,15 @@ window['settings'] = { name: '卫星影像', }, }, + + gantt: { + task: { label: '任务', color: 'error' }, + + dd: { label: '主体' }, + + mainEvent: { label: '主事件', color: 'success' }, + eventType: { label: '事件分类', color: 'info' }, + + subEvent: { label: '子事件', color: 'warning' }, + }, } diff --git a/public/models/IDF.glb b/public/models/IDF1.glb similarity index 100% rename from public/models/IDF.glb rename to public/models/IDF1.glb diff --git a/src/api/Gantt/index.js b/src/api/Gantt/index.js index 6ef4b5807..3a1a1a16d 100644 --- a/src/api/Gantt/index.js +++ b/src/api/Gantt/index.js @@ -13,8 +13,7 @@ const sub = [ end: '2024-11-17', type: 'subEvent', trajData: {}, - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/wolf.jpg', + avatar: '/images/影像.jpg', }, ], }, @@ -29,8 +28,7 @@ const sub = [ start: '2024-11-18', end: '2024-11-21', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/rabbit.jpg', + avatar: '/images/影像.jpg', }, ], }, @@ -44,8 +42,7 @@ const sub = [ start: '2024-11-20', end: '2024-11-22', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/cat.jpg', + avatar: '/images/影像.jpg', }, { id: 7, @@ -53,8 +50,7 @@ const sub = [ start: '2024-11-18', end: '2024-11-19', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/flower.jpg', + avatar: '/images/影像.jpg', }, ], }, @@ -69,8 +65,7 @@ const sub = [ start: '2024-11-20', end: '2024-11-21', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/bear.jpg', + avatar: '/images/影像.jpg', }, { id: 9, @@ -78,8 +73,7 @@ const sub = [ start: '2024-11-22', end: '2024-11-26', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/wolf.jpg', + avatar: '/images/影像.jpg', }, ], }, @@ -93,9 +87,7 @@ const sub = [ start: '2024-11-22', end: '2024-11-25', type: 'subEvent', - - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/rabbit.jpg', + avatar: '/images/影像.jpg', }, { id: 14, @@ -103,8 +95,7 @@ const sub = [ start: '2024-11-27', end: '2024-11-30', type: 'subEvent', - avatar: - 'https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/cat.jpg', + avatar: '/images/影像.jpg', }, ], }, @@ -114,8 +105,6 @@ const main = [ { id: 0, name: 'DD-1', - start: '2024-11-15', - end: '2024-11-21', type: 'dd', children: [ { diff --git a/src/api/Mubiao/index.js b/src/api/Mubiao/index.js index 02534f6ba..2f2644047 100644 --- a/src/api/Mubiao/index.js +++ b/src/api/Mubiao/index.js @@ -31,3 +31,11 @@ export function getMubiaoHisTraj(params) { params, }) } + +export function updateMbPayload(data = {}) { + return request({ + url: `${baseUrl}/traj/extendInfo`, + method: 'put', + data, + }) +} diff --git a/src/api/Satellite/index.js b/src/api/Satellite/index.js index 75205ad46..a42a6cc2b 100644 --- a/src/api/Satellite/index.js +++ b/src/api/Satellite/index.js @@ -23,4 +23,12 @@ export function getSatellite() { }) } +export function updateSatellitePayload(data = {}) { + return request({ + url: `${baseUrl}/satellite/extendInfo`, + method: 'put', + data, + }) +} + export { getTleDataFromExternal } diff --git a/src/components/Tree/index.vue b/src/components/Tree/index.vue index 7227085db..09d948f19 100644 --- a/src/components/Tree/index.vue +++ b/src/components/Tree/index.vue @@ -26,6 +26,10 @@ const props = defineProps({ type: Function as TreeNodeProps, default: undefined, }, + renderLabel: { + type: Function as RenderTreePart, + default: undefined, + }, renderSuffix: { type: Function as RenderTreePart, default: undefined, @@ -81,6 +85,7 @@ const updateChecked = (keys: Array) => { @update:checked-keys="updateChecked" :node-props="nodeProps" :render-suffix="renderSuffix" + :render-label="renderLabel" /> diff --git a/src/hooks/entity.ts b/src/hooks/entity.ts index b41eccf9c..3e0665981 100644 --- a/src/hooks/entity.ts +++ b/src/hooks/entity.ts @@ -1,16 +1,30 @@ +import { reactive } from 'vue' import { getMubiaoHisTraj } from '@/api/Mubiao' const baseMap = new Map() const mubiaoMap = new Map() +const mubiaoConicMap = new Map() const satelliteMap = new Map() + +const mbPayloadShowMap = reactive(new Map()) +// const satDetectingPayloadMap = reactive(new Map()) +// const satCommunicationPayloadMap = reactive(new Map()) +const satellitePayloadShowMap = reactive(new Map()) + export const useEntity = () => { return { baseMap, mubiaoMap, + mubiaoConicMap, satelliteMap, + mbPayloadShowMap, + // satDetectingPayloadMap, + // satCommunicationPayloadMap, + satellitePayloadShowMap, showEntity, getHisTraj, getMBEntityOpt, + createMBConicSensor, iconOrModel, changeIconOrModel, showOrHideLoad, @@ -66,14 +80,48 @@ async function getHisTraj({ function getMBEntityOpt({ id, targetType, - name, + extendInfo, }: { id: string targetType: string - name?: string + extendInfo?: { detectingPayload: Record } }) { const mubiaoDict = window.settings.mbDict[targetType] + let ellipsoid + if (extendInfo) { + const { + angle, + maximumCone, + minimumCone, + minimumClock, + maximumClock, + radius, + } = extendInfo.detectingPayload + if (radius) { + ellipsoid = { + ellipsoid: { + show: mbPayloadShowMap.get(id)?.detectingPayload?.show || false, + radii: new Cesium.Cartesian3(radius, radius, radius), + innerRadii: new Cesium.Cartesian3(1.0, 1.0, 1.0), + maximumCone: Cesium.Math.toRadians(90), + minimumCone: Cesium.Math.toRadians(minimumCone), + minimumClock: Cesium.Math.toRadians(minimumClock), + maximumClock: Cesium.Math.toRadians(maximumClock), + material: Cesium.Color.fromCssColorString('#00dcff44'), + outline: true, + outlineColor: Cesium.Color.fromCssColorString('#00dcff'), + outlineWidth: 1, + distanceDisplayCondition: new Cesium.DistanceDisplayCondition( + 0.0, + 10.5e8 + ), + slicePartitions: 24, + stackPartitions: 36, + }, + } + } + } return { label: { text: `${id}`, @@ -105,28 +153,49 @@ function getMBEntityOpt({ scale: 1000, minimumPixelSize: 50, }, - ellipsoid: { - show: showOrHideLoad.value, - radii: new Cesium.Cartesian3(100000, 100000, 100000), - innerRadii: new Cesium.Cartesian3(1.0, 1.0, 1.0), - maximumCone: Cesium.Math.toRadians(90), - minimumCone: Cesium.Math.toRadians(40), - minimumClock: Cesium.Math.toRadians(20), - maximumClock: Cesium.Math.toRadians(90), - material: Cesium.Color.fromCssColorString('#00dcff44'), - outline: true, - outlineColor: Cesium.Color.fromCssColorString('#00dcff'), - outlineWidth: 1, - distanceDisplayCondition: new Cesium.DistanceDisplayCondition( - 0.0, - 10.5e8 - ), - slicePartitions: 24, - stackPartitions: 36, - }, + ...ellipsoid, } } +function createMBConicSensor({ + entity, + angle, + show, +}: { + entity: Cesium.Entity + angle: number + show: boolean +}) { + console.log('entity', angle) + const conicSensor = new CesiumSensorVolumes.ConicSensorGraphics({ + show, + radius: 2e7, + innerHalfAngle: 0, + outerHalfAngle: Cesium.Math.toRadians(angle / 2), + minimumClockAngle: 0, + maximumClockAngle: 2 * Math.PI, + showIntersection: true, + intersectionColor: new Cesium.Color(1, 1, 1, 1), + intersectionWidth: 3, + lateralSurfaceMaterial: new Cesium.Color(0.0, 1.0, 1.0, 0.3), + }) + const mbConic = viewer.entities.add({ + position: entity.position, + orientation: + entity.position && + Cesium.Transforms.headingPitchRollQuaternion( + entity.position._value, + new Cesium.HeadingPitchRoll( + Cesium.Math.toRadians(90), + 0, + Cesium.Math.toRadians(180) + ) // 初始朝向 + ), + conicSensor: conicSensor, + }) + return mbConic +} + const iconOrModel = ref(false) function changeIconOrModel() { iconOrModel.value = !iconOrModel.value @@ -136,15 +205,51 @@ function changeIconOrModel() { }) } -const showOrHideLoad = ref(true) +const showOrHideLoad = ref(false) +watch([mbPayloadShowMap, satellitePayloadShowMap], ([newMb, newSatellite]) => { + ;[...newMb.keys()].forEach(key => { + let show = false + if (newMb.get(key).detectingPayload) { + show = newMb.get(key).detectingPayload.show + } + if (mubiaoMap.has(key)) { + // if(console.log(mubiaoMap.get(key).ellipsoid) + mubiaoMap.get(key).ellipsoid && (mubiaoMap.get(key).ellipsoid.show = show) + + mubiaoConicMap.get(key)?.conicSensor && + (mubiaoConicMap.get(key).conicSensor.show = show) + } + }) + ;[...newSatellite.keys()].forEach(key => { + let show = false + if (newSatellite.get(key).detectingPayload) { + show = newSatellite.get(key).detectingPayload.show + // console.log(newSatellite.get(key).detectingPayload.show) + } + if (satelliteMap.has(key)) { + satelliteMap.get(key).sensor = show + } + }) +}) function changeShowOrHideLoad() { showOrHideLoad.value = !showOrHideLoad.value - ;[...mubiaoMap.values()].forEach(entity => { - entity.ellipsoid.show = !entity.ellipsoid.show._value - }) - ;[...satelliteMap.values()].forEach(satellite => { - satellite.sensor = showOrHideLoad.value - console.log(satellite) - }) + // ;[...mubiaoMap.values()].forEach(entity => { + // entity.ellipsoid.show = !entity.ellipsoid.show._value + // }) + for (const [key] of mbPayloadShowMap.entries()) { + mbPayloadShowMap.get(key).detectingPayload.show = showOrHideLoad.value + } + + for (const [key] of satellitePayloadShowMap.entries()) { + satellitePayloadShowMap.get(key).detectingPayload && + (satellitePayloadShowMap.get(key).detectingPayload.show = + showOrHideLoad.value) + satellitePayloadShowMap.get(key).communicationPayload && + (satellitePayloadShowMap.get(key).communicationPayload.show = + showOrHideLoad.value) + } + // ;[...satelliteMap.values()].forEach(satellite => { + // satellite.sensor = showOrHideLoad.value + // }) } diff --git a/src/js/satelliteEntity.js b/src/js/satelliteEntity.js index 1d1b9a298..8823938dd 100644 --- a/src/js/satelliteEntity.js +++ b/src/js/satelliteEntity.js @@ -22,6 +22,7 @@ class SatelliteEntity { this.entity = null this._underPoint = false this.underPointEntity = null + this._sensorAngle = 30 this._sensorType = 'conic' this._listener = null } @@ -50,6 +51,16 @@ class SatelliteEntity { } } + get sensorAngle() { + return this._sensorAngle + } + set sensorAngle(angle) { + this._sensorAngle = angle + if (this._sensorEntity) { + this._sensorEntity.angle = angle + } + } + get underPoint() { return this._underPoint } @@ -344,7 +355,7 @@ class SatelliteEntity { show: true, radius: 2e7, innerHalfAngle: 0, - outerHalfAngle: Cesium.Math.toRadians(20), + outerHalfAngle: Cesium.Math.toRadians(this._sensorAngle / 2), minimumClockAngle: 0, maximumClockAngle: 2 * Math.PI, showIntersection: true, diff --git a/src/utils/tree.js b/src/utils/tree.js index 54a08bf86..6e38a3c53 100644 --- a/src/utils/tree.js +++ b/src/utils/tree.js @@ -2,6 +2,8 @@ export const useTree = () => { return { filterTreeNodeByField, getAllKeys, + getLeafNodeIds, + getLeafNode, } } @@ -36,3 +38,37 @@ function getAllKeys(treeData, key) { return acc }, []) } + +function getLeafNodeIds(tree, idKey) { + let leafIds = [] + function traverse(node) { + if (!node.children && node.data) { + leafIds.push(node[idKey]) + } else { + for (let child of node.children) { + traverse(child) + } + } + } + + traverse(tree) + + return leafIds +} + +function getLeafNode(tree) { + let leafNodes = [] + function traverse(node) { + if (!node.children && node.data) { + leafNodes.push(node) + } else { + for (let child of node.children) { + traverse(child) + } + } + } + + traverse(tree) + + return leafNodes +} diff --git a/src/views/BaseMB/components/HisImages/index.vue b/src/views/BaseMB/components/HisImages/index.vue index ae15bb791..50f952117 100644 --- a/src/views/BaseMB/components/HisImages/index.vue +++ b/src/views/BaseMB/components/HisImages/index.vue @@ -86,10 +86,14 @@ const isCompare = ref(false) const compareImages = () => { if (!isCompare.value) { if (checkedImage.value && checkedImage.value.length === 2) { + showPreview.value = true + previewIndex.value = 0 + // showPreview.value = true isCompare.value = true } } else { isCompare.value = false + showPreview.value = false checkedImage.value = null } } @@ -130,9 +134,14 @@ const largeImageList = computed(() => { format="yyyy-MM-dd HH:mm:ss" /> 搜索 - {{ - isCompare ? '取消对比' : '对比' - }} + {{ isCompare ? '取消对比' : '对比' }}
diff --git a/src/views/Content/index.vue b/src/views/Content/index.vue index 2f9e1fcb6..f1ccb216b 100644 --- a/src/views/Content/index.vue +++ b/src/views/Content/index.vue @@ -12,7 +12,7 @@ import Hangjing from '../Hangjing/index.vue' import Mubiao from '../Mubiao/index.vue' import MubiaoHisTrajectory from '../Mubiao/components/HisTrajectory/index.vue' import MultiHisTrajectory from '../Mubiao/components/MultiHisTrajectory/index.vue' -import YsHangjing from '../YsHangjing/index.vue' +// import YsHangjing from '../YsHangjing/index.vue' import Daodan from '../Daodan' @@ -60,7 +60,7 @@ const types = [ { name: 'XW', value: 'wzbXw' }, ] -const showPanelName = ref('dd') +const showPanelName = ref('wx') const panelList = [ // { @@ -149,13 +149,13 @@ const showOrHideTextReport = () => { }}
- +
diff --git a/src/views/Daodan/ddHooks.jsx b/src/views/Daodan/ddHooks.jsx index 9282fafbe..04019a850 100644 --- a/src/views/Daodan/ddHooks.jsx +++ b/src/views/Daodan/ddHooks.jsx @@ -7,11 +7,9 @@ const treeData = ref([]) const daodanData = ref({}) export function useDaodan() { - onMounted(() => { - getDaodanTreeData() - }) return { showDdConfigCom, + getDaodanTreeData, showOrHideDdConfig, isLoading, daodanData, diff --git a/src/views/Daodan/index.jsx b/src/views/Daodan/index.jsx index d71435e1e..ca1f6e26f 100644 --- a/src/views/Daodan/index.jsx +++ b/src/views/Daodan/index.jsx @@ -2,11 +2,15 @@ import Tree from '@/components/Tree/index.vue' import { useDaodan } from './ddHooks' import { NButton } from 'naive-ui' import { useTestConfig } from './components/hooks/testHooks' +import { onMounted } from 'vue' export default defineComponent({ setup() { - const { treeData, isLoading, showOrHideDdConfig } = useDaodan() - + const { treeData, isLoading, showOrHideDdConfig, getDaodanTreeData } = + useDaodan() + onMounted(() => { + getDaodanTreeData() + }) const renderSuffix = ({ option }) => { if (!option.data) { return undefined diff --git a/src/views/Earth/index.vue b/src/views/Earth/index.vue index e23448bf6..5ef88e966 100644 --- a/src/views/Earth/index.vue +++ b/src/views/Earth/index.vue @@ -33,7 +33,7 @@ onMounted(async () => { // tilingScheme: new Cesium.WebMercatorTilingScheme(), // }) // ) - viewer.scene.debugShowFramesPerSecond = true + // viewer.scene.debugShowFramesPerSecond = true viewer.camera.setView({ destination: Cesium.Cartesian3.fromDegrees(117.48, 30.67, 18000000.0), }) @@ -109,6 +109,23 @@ onMounted(async () => { // } // }) // }, 2000) + + let handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas) + // var tooltip = document.getElementById("toolTip"); + + handler.setInputAction(function (movement) { + // tooltip.style.display = "none"; + // cartesian = viewer.scene.camera.pickEllipsoid(movement.position, viewer.scene.globe.ellipsoid); + + const ray = viewer.camera.getPickRay(movement.position) + const promise = viewer.imageryLayers.pickImageryLayerFeatures( + ray, + viewer.scene + ) + Promise.resolve(promise).then(function (features) { + console.log(features) + }) + }, Cesium.ScreenSpaceEventType.LEFT_CLICK) }) diff --git a/src/views/Gantt/components/EventList/components/MainEventEdit.jsx b/src/views/Gantt/components/EventList/components/MainEventEdit.jsx index 4e9f92647..78df05bcc 100644 --- a/src/views/Gantt/components/EventList/components/MainEventEdit.jsx +++ b/src/views/Gantt/components/EventList/components/MainEventEdit.jsx @@ -19,7 +19,7 @@ export default defineComponent({ const { showMainEvent, mainEventData } = useEvent() const close = () => { - showNewEvent.value = false + showMainEvent.value = false } watch( @@ -52,7 +52,9 @@ export default defineComponent({
取消 - 确认 + + 确认 +
) diff --git a/src/views/Gantt/components/EventList/components/SubEventEdit.jsx b/src/views/Gantt/components/EventList/components/SubEventEdit.jsx index 3b2759a55..6011850f0 100644 --- a/src/views/Gantt/components/EventList/components/SubEventEdit.jsx +++ b/src/views/Gantt/components/EventList/components/SubEventEdit.jsx @@ -73,7 +73,9 @@ export default defineComponent({
取消 - 确认 + + 确认 +
) diff --git a/src/views/Gantt/components/EventList/index.jsx b/src/views/Gantt/components/EventList/index.jsx index 5b6765516..9bc058dd3 100644 --- a/src/views/Gantt/components/EventList/index.jsx +++ b/src/views/Gantt/components/EventList/index.jsx @@ -25,12 +25,7 @@ export default defineComponent({ }, setup(props) { const { showMainEvent, mainEventData, showNewEvent, eventData } = useEvent() - const dict = { - mainEvent: { label: '主事件', color: 'success' }, - eventType: { label: '事件分类', color: 'info' }, - - subEvent: { label: '子事件', color: 'warning' }, - } + const dict = window.settings.gantt const columns = [ { title: '事件名称', diff --git a/src/views/Gantt/components/Gantt/hooks/gantt.ts b/src/views/Gantt/components/Gantt/hooks/gantt.ts index 9014de38f..f90fd89b8 100644 --- a/src/views/Gantt/components/Gantt/hooks/gantt.ts +++ b/src/views/Gantt/components/Gantt/hooks/gantt.ts @@ -36,7 +36,7 @@ const useGantt = ({ router, route }: GanttParams) => { const option = getOption() ganttInstance = new Gantt(dom, option) window['ganttInstance'] = ganttInstance - console.log(ganttInstance) + // console.log(ganttInstance) } function getOption(): TYPES.GanttConstructorOptions { const option = { @@ -224,6 +224,28 @@ const useGantt = ({ router, route }: GanttParams) => { // checkbox.addEventListener('click', event => { // console.log(event, 'event') // }) + // console.log(taskRecord, 'taskRecord') + const nameContainer = new Group({ + fill: 'transparent', + display: 'flex', + // flexDirection: 'column', + // justifyContent: 'center', + alignItems: 'center', + }) + + container.add(nameContainer) + if ('trajData' in taskRecord && taskRecord.trajData) { + const taskRecordSymbol = new Image({ + width: 20, + height: 20, + fill: '#ff0', + image: + '', + boundsPadding: [-3, 10, 0, 0], + cursor: 'pointer', + }) + nameContainer.add(taskRecordSymbol) + } const name = new Text({ text: taskRecord.name, fontSize: 16, @@ -234,7 +256,7 @@ const useGantt = ({ router, route }: GanttParams) => { textAlign: 'center', // boundsPadding: [10, 0, 0, 0], }) - container.add(name) + nameContainer.add(name) const days = new Text({ text: `${startDate.toLocaleDateString()} ~ ${endDate.toLocaleDateString()}`, diff --git a/src/views/Gantt/components/MainGantt/index.jsx b/src/views/Gantt/components/MainGantt/index.jsx index 0a9b0f824..b863d5052 100644 --- a/src/views/Gantt/components/MainGantt/index.jsx +++ b/src/views/Gantt/components/MainGantt/index.jsx @@ -15,7 +15,12 @@ export default defineComponent({ return () => ( <>
- + diff --git a/src/views/Gantt/components/TaskList/components/NewTask/hooks.ts b/src/views/Gantt/components/TaskList/components/NewTask/hooks.ts index a5b788289..2c854f7bf 100644 --- a/src/views/Gantt/components/TaskList/components/NewTask/hooks.ts +++ b/src/views/Gantt/components/TaskList/components/NewTask/hooks.ts @@ -1,7 +1,14 @@ const showNewTask = ref(false) + +const curTaskData = ref({ + name: '', + description: '', + checkedEvent: [], +}) const useTask = () => { return { showNewTask, + curTaskData, } } diff --git a/src/views/Gantt/components/TaskList/components/NewTask/index.jsx b/src/views/Gantt/components/TaskList/components/NewTask/index.jsx index ac920029f..2276dd340 100644 --- a/src/views/Gantt/components/TaskList/components/NewTask/index.jsx +++ b/src/views/Gantt/components/TaskList/components/NewTask/index.jsx @@ -10,14 +10,11 @@ export default defineComponent({ // }, // }, setup() { - const checkedRowKeys = ref([]) - watch(checkedRowKeys, newval => { - console.log(newval, '-----') - }) - const task = ref({ - name: '', - description: '', - }) + // const checkedRowKeys = ref([]) + // watch(checkedRowKeys, newval => { + // console.log(newval, '-----') + // }) + const columns = [ { type: 'selection' }, { @@ -43,10 +40,10 @@ export default defineComponent({ title: '结束时间', key: 'end', }, - { - title: '类型', - key: 'type', - }, + // { + // title: '类型', + // key: 'type', + // }, { title: '图片', key: 'avatar', @@ -59,34 +56,50 @@ export default defineComponent({ }, }, ] + const tableData = ref([]) onMounted(async () => { const res = await getMainGantt() tableData.value = res }) - const { showNewTask } = useTask() + const { showNewTask, curTaskData } = useTask() const close = () => { showNewTask.value = false + console.log(curTaskData, '---') } + // watch( + // showNewTask, + // show => { + // if (show) { + // taskData.value = { + // name: '', + // description: '', + // checkedEvent: [], + // } + // } + // }, + // { immediate: true } + // ) + return () => ( - + - + handleEdit(row)} + onClick={() => editTask(row)} > + 进入任务 handleEdit(row)} + onClick={() => editTask(row)} > + 编辑 ) : null} @@ -126,7 +120,7 @@ export default defineComponent({ <> )} */} - - + */}
) }, @@ -154,6 +148,15 @@ export default defineComponent({ expandedRowKeys.value = getAllKeys(tableData.value, 'name') } + const { showNewTask, curTaskData } = useTask() + function editTask(row) { + showNewTask.value = true + curTaskData.value = { + ...row, + checkedEvent: getAllKeys(row.children, 'name'), + } + } + return () => ( = new Map() const { addHangjingPolygon, removeHangjingPolygon } = useHjPolygon(hangjingMap) export const useHangjing = () => { - onMounted(() => { - initWebSocket() - }) + // onMounted(() => { + // initWebSocket() + // }) const addHangjing = ids => { addHangjingPolygon(ids, hjTreeData) } @@ -28,6 +28,7 @@ export const useHangjing = () => { } return { + initWebSocket, addHangjing, removeHangjing, hjTreeData, diff --git a/src/views/Hangjing/hooks/hangjingPolygon.ts b/src/views/Hangjing/hooks/hangjingPolygon.ts index 1c84b3971..910a82be2 100644 --- a/src/views/Hangjing/hooks/hangjingPolygon.ts +++ b/src/views/Hangjing/hooks/hangjingPolygon.ts @@ -16,7 +16,7 @@ export const useHjPolygon = (polygonMap: Map) => { let subscriber: Subscriber | null = null const colors = new Map() - + const centerPointMap = new Map() function addHangjingPolygon(ids, data) { subscriber = new Subscriber(viewer, { pickResult: { @@ -38,10 +38,13 @@ export const useHjPolygon = (polygonMap: Map) => { nodes.forEach(({ data: hjData, dataId: id }) => { // const item = data.find(item => item.id === id) if (hjData) { + // console.log(hjData, 'hjData') + if (hjData.zoneList.length > 0) { hjData.zoneList.forEach(zone => { // console.log(zone, 'zone') - addPolygon({ ...zone, styleJsonData: hjData.styleJsonData }, id) + // addPolygon({ ...zone, styleJsonData: hjData.styleJsonData }, id) + addPolygon({ ...zone, styleJsonData: hjData.styleJsonData }) }) } else { addPolygon(hjData) @@ -60,6 +63,7 @@ export const useHjPolygon = (polygonMap: Map) => { } function addPolygon(item, parentId: number | null = null) { + // console.log(parentId, '----') const { id, geom, title, styleJsonData } = item const feature = parseWKT(geom) const position = feature.coordinates[0].map(pos => { @@ -115,9 +119,10 @@ export const useHjPolygon = (polygonMap: Map) => { polygonMap.get(parentId).push(centerEntity) } else { polygonMap.set(id, polygon) + centerPointMap.set(id, centerEntity) } - // console.log(polygonMap, 'polygonMap') + // console.log(parentId, polygonMap, 'polygonMap') } function addPolygonCenter(centerPoint: number[]) { @@ -235,6 +240,11 @@ export const useHjPolygon = (polygonMap: Map) => { // viewer.entities.remove(hangjingMap.get(id)) polygonMap.delete(id) } + + if (centerPointMap.has(id)) { + viewer.entities.remove(centerPointMap.get(id)) + centerPointMap.delete(id) + } } function addEventSub({ diff --git a/src/views/Hangjing/hooks/hangjingStyle.jsx b/src/views/Hangjing/hooks/hangjingStyle.jsx index 57cfbb66e..bf759e3e8 100644 --- a/src/views/Hangjing/hooks/hangjingStyle.jsx +++ b/src/views/Hangjing/hooks/hangjingStyle.jsx @@ -26,7 +26,7 @@ function initStyle(data) { styleForm.value = { fontFamily: '微软雅黑', fontSize: 14, - textColor: 'rgba(255,255,0,1)', + textColor: 'rgba(255,255,255,1)', polygonColor: 'rgba(255,255,255,0.5)', lineColor: 'rgba(255,255,255,1)', lineWidth: 1, diff --git a/src/views/Hangjing/index.vue b/src/views/Hangjing/index.vue index 6aec53c1e..9579ea458 100644 --- a/src/views/Hangjing/index.vue +++ b/src/views/Hangjing/index.vue @@ -96,37 +96,51 @@ const drawArea = () => { const { showDetailsModal } = useHangjingDetail() -const renderSuffix = ({ option }: { option: TreeOption }) => { - return option.data - ? h('div', { class: 'flex items-center gap-2 pr-2' }, [ - h( - NButton, - { - text: true, - size: 'tiny', - type: 'info', - onClick: () => - showDetailsModal(`${option.data.title}详情`, option.data), - }, - { default: () => '详情' } - ), - // h( - // NButton, - // { - // text: true, - // size: 'tiny', - // type: 'info', - // onClick: () => showStyleModal(`${option.data.title}样式配置`, option.data), - // }, - // { default: () => '样式配置' } - // ), - ]) - : null +const renderLabel = ({ option }) => { + // if() + if (option.data) { + const textColor = option.data.styleJsonData + ? JSON.parse(option.data.styleJsonData).textColor + : 'rgba(255,255,255,1)' + + return h('span', { style: `color:${textColor}` }, option.data.title) + } else { + return option.nodeName + } +} +const renderSuffix = ({ option }) => { + return ( + option.data && + h('div', { class: 'flex items-center gap-2 pr-2' }, [ + h( + NButton, + { + text: true, + size: 'tiny', + type: 'info', + onClick: () => + showDetailsModal(`${option.data.title}详情`, option.data), + }, + { default: () => '详情' } + ), + // h( + // NButton, + // { + // text: true, + // size: 'tiny', + // type: 'info', + // onClick: () => showStyleModal(`${option.data.title}样式配置`, option.data), + // }, + // { default: () => '样式配置' } + // ), + ]) + ) } // const checkedKeys = ref>([]) const { + initWebSocket, addHangjing, hjTreeData, isLoading, @@ -144,6 +158,7 @@ watch(checkedKeys, val => { }) onMounted(() => { + initWebSocket() getHangjingData() }) @@ -196,6 +211,7 @@ onMounted(() => { v-model:checked="checkedKeys" showSearch :renderSuffix="renderSuffix" + :renderLabel="renderLabel" />
diff --git a/src/views/Mubiao/hooks/mubiao.ts b/src/views/Mubiao/hooks/mubiao.ts index 8b9a6d972..6fbdd6206 100644 --- a/src/views/Mubiao/hooks/mubiao.ts +++ b/src/views/Mubiao/hooks/mubiao.ts @@ -1,9 +1,9 @@ -import { ref } from 'vue' +import { ref, nextTick } from 'vue' import { Subscriber } from 'cesium-extends' import { parseWKT } from '@/utils/parseWKT' import { cesiumTime2Format } from '@/utils/date' import { difference } from 'lodash' -import { getMubiaoPos, sendCheckedTargetIds } from '@/api/Mubiao' +import { getMubiao, getMubiaoPos, sendCheckedTargetIds } from '@/api/Mubiao' import { useTree } from '@/utils/tree' import { useMubiaoPopup } from './mubiaoPopup' import { useEntity } from '@/hooks/entity' @@ -23,15 +23,23 @@ interface IMubiao { children?: IMubiao[] } +const checkedKeys = ref>([]) + const data = ref[]>([]) -const { mubiaoMap, getMBEntityOpt } = useEntity() +const { + mubiaoMap, + getMBEntityOpt, + createMBConicSensor, + mubiaoConicMap, + mbPayloadShowMap, +} = useEntity() // const { mubiaoMap } = storeToRefs(entity) // const mubiaoMap = ref>(new Map()) let subscriber: Subscriber | null = null -const { filterTreeNodeByField } = useTree() +const { filterTreeNodeByField, getLeafNode } = useTree() const { popupMap, createPopup } = useMubiaoPopup() export const useMubiao = () => { @@ -72,6 +80,7 @@ export const useMubiao = () => { position: pos, target_time, targetType: data.targetType, + extendInfo: data.extendInfo, }) // console.log(mbEntity, 'mbEntity') @@ -98,19 +107,29 @@ export const useMubiao = () => { position, target_time, targetType, + extendInfo, }: Record) => { // 添加目标实体 // console.log(window.settings, targetType, '-----') - const mbEntityOpt = getMBEntityOpt({ - id, - targetType, - }) + const mbEntityOpt = getMBEntityOpt({ id, targetType, extendInfo }) const mubiaoEntity = viewer.entities.add({ name: id, - position: Cesium.Cartesian3.fromDegrees(...(position as number[])), + position: Cesium.Cartesian3.fromDegrees( + ...(position as number[]), + targetType === '甲' ? 20000 : 0 + ), ...mbEntityOpt, }) + + if (extendInfo?.detectingPayload?.angle) { + const conic = createMBConicSensor({ + entity: mubiaoEntity, + angle: extendInfo?.detectingPayload?.angle, + show: mbPayloadShowMap.get(id).detectingPayload.show, + }) + mubiaoConicMap.set(id, conic) + } return mubiaoEntity } @@ -144,6 +163,10 @@ export const useMubiao = () => { popupMap.get(id).windowClose() popupMap.delete(id) } + if (mubiaoConicMap.has(id)) { + viewer.entities.remove(mubiaoConicMap.get(id)) + mubiaoConicMap.delete(id) + } } const updateMubiaoPos = async ( @@ -197,6 +220,8 @@ export const useMubiao = () => { return { data, + checkedKeys, + getMubiaoData, addMubiao, updateMubiaoPos, } @@ -212,3 +237,34 @@ async function getMubiaoCurPos(ids: Array) { return [] } } + +async function getMubiaoData() { + const checked = JSON.parse(JSON.stringify(checkedKeys.value)) + // console.log(checked) + const { code, data: resData } = await getMubiao() + if (code === '200') { + data.value = [resData] + checkedKeys.value = [] + getAllNodesToPayload() + nextTick(() => { + checkedKeys.value = checked + }) + } +} + +function getAllNodesToPayload() { + const mbList = getLeafNode(data.value[0]) + mbList.forEach(node => { + const { dataId, data: nodeData } = node + const { extendInfo } = nodeData + const detectingShow = + mbPayloadShowMap.get(dataId)?.detectingPayload?.show || false + if (extendInfo) { + mbPayloadShowMap.set(dataId, { + data: toRaw(nodeData), + detectingPayload: { ...extendInfo, show: detectingShow }, + }) + } + }) + console.log('mbPayloadShowMap', mbPayloadShowMap) +} diff --git a/src/views/Mubiao/hooks/mubiaoDetail.jsx b/src/views/Mubiao/hooks/mubiaoDetail.jsx index 407d12221..dd17965b5 100644 --- a/src/views/Mubiao/hooks/mubiaoDetail.jsx +++ b/src/views/Mubiao/hooks/mubiaoDetail.jsx @@ -1,51 +1,132 @@ // import { h } from 'vue' -import { NDataTable, NInputNumber, NSwitch } from 'naive-ui' +import { NButton, NInputNumber, NSwitch } from 'naive-ui' import { useModal } from '@/views/Content/hooks/modal' import Detection from '@/views/Payload/Detection.jsx' import Communication from '@/views/Payload/Communication.jsx' +import { updateMbPayload } from '@/api/Mubiao' +import { useEntity } from '@/hooks/entity' +import { useMubiao } from './mubiao' const { openDetailsModal } = useModal() export const useMubiaoDetail = () => { + const payloadData = ref([]) + + function addCommunicationPayload(mbData) { + const { id, targetType, extendInfo } = mbData + + const payLoadType = window.settings.mbDict[targetType].payload + if (payLoadType === 'radar') { + payloadData.value = [ + { + id, + radius: null, + minimumClock: null, + maximumClock: 90, + minimumCone: null, + maximumCone: null, + show: false, + }, + ] + } else if (payLoadType === 'conic') { + payloadData.value = [ + { + id, + angle: null, + show: false, + }, + ] + } + } + const { mbPayloadShowMap } = useEntity() + + function renderMubiaoDetailsContent(mbData) { + payloadData.value = [] + const { id, targetType, extendInfo } = mbData + const payLoadType = window.settings.mbDict[targetType].payload + + if (extendInfo) { + payloadData.value = [ + { + id, + ...extendInfo.detectingPayload, + show: mbPayloadShowMap.get(id).detectingPayload.show, + }, + ] + } + // return h( + // 'div', + // {}, + // Object.keys(mbData).map(key => h('div', {}, `${key}：${mbData[key]}`)) + // ) + return () => ( +
+
基本信息
+
+ {Object.keys(mbData).map(key => ( +
+ {key}：{mbData[key]} +
+ ))} +
+ {/*
探测载荷
+ */} +
+
探测载荷
+ {payloadData.value.length === 0 && ( + addCommunicationPayload(mbData)} + > + 添加 + + )} +
+ {payloadData.value.length > 0 && ( + + )} + +
+ + updateMbLoad({ + mbData, + detection: payloadData.value, + }) + } + > + 确定 + + {/* 取消 */} +
+
+ ) + } + function showDetailsMubiao(mbData) { + openDetailsModal({ + titleString: 'zb详情', + contentSlot: renderMubiaoDetailsContent(mbData), + }) + } + + function updateMbLoad({ mbData, detection }) { + const { getMubiaoData } = useMubiao() + const { id, show, ...detectionData } = detection[0] + const payloadData = { + id: mbData.id, + extendInfo: { + detectingPayload: { ...detectionData }, + }, + } + // console.log(payloadData) + updateMbPayload(payloadData).then(res => { + if (res.code === '200') { + window.$message.success('保存成功') + getMubiaoData() + } + }) + } + return { showDetailsMubiao } } - -const data = ref([ - { - id: 3, - radius: 5000, - minimumClock: 20.0, - maximumClock: 110.0, - minimumCone: 20.0, - maximumCone: 90.0, - height: 100, - status: true, - }, -]) - -function renderMubiaoDetailsContent(mbData) { - // return h( - // 'div', - // {}, - // Object.keys(mbData).map(key => h('div', {}, `${key}：${mbData[key]}`)) - // ) - return () => ( -
-
基本信息
-
- {Object.keys(mbData).map(key => ( -
- {key}：{mbData[key]} -
- ))} -
-
探测载荷
- -
- ) -} -function showDetailsMubiao(mbData) { - openDetailsModal({ - titleString: 'zb详情', - contentSlot: renderMubiaoDetailsContent(mbData), - }) -} diff --git a/src/views/Mubiao/index.vue b/src/views/Mubiao/index.vue index 7998b048c..2c564f9b9 100644 --- a/src/views/Mubiao/index.vue +++ b/src/views/Mubiao/index.vue @@ -2,7 +2,6 @@ import { h } from 'vue' import { NButton } from 'naive-ui' import type { TreeOption } from 'naive-ui' -import { getMubiao, getMubiaoPos } from '@/api/Mubiao' // import type { DataTableColumns, DataTableRowKey } from 'naive-ui' import Tree from '@/components/Tree/index.vue' import HeatMap from './components/HeatMap/index.vue' @@ -13,26 +12,19 @@ import { useMubiaoDetail } from './hooks/mubiaoDetail' import { useMBTrajectory } from './components/HisTrajectory/hooks/mbTraj' import { useDaodan } from '../Daodan/ddHooks' -const { addMubiao, data } = useMubiao() +const { getMubiaoData, data, addMubiao, checkedKeys } = useMubiao() const useMbPosWS = useMuBiaoPositionWS() const useMbDisappearWS = useMuBiaoDisappearWS() -const getMubiaoData = async () => { - const { code, data: resData } = await getMubiao() - if (code === '200') { - data.value = [resData] - } -} - onMounted(() => { getMubiaoData() - // useMuBiaoPositionWS() }) -const checkedKeys = ref>([]) +// const checkedKeys = ref>([]) watch(checkedKeys, val => { + console.log('watch', val) addMubiao(val) }) diff --git a/src/views/Payload/Communication.jsx b/src/views/Payload/Communication.jsx index b31c69f5a..207ce2f84 100644 --- a/src/views/Payload/Communication.jsx +++ b/src/views/Payload/Communication.jsx @@ -1,19 +1,50 @@ -import { NDataTable, NButton, NSelect, NInputNumber, NSwitch } from 'naive-ui' +import { defineExpose } from 'vue' +import { + NDataTable, + NButton, + NSelect, + NInputNumber, + NSwitch, + NTreeSelect, +} from 'naive-ui' +import { getMubiao } from '@/api/Mubiao' export default defineComponent({ - name: 'DetectionPayload', - props: {}, - setup(props) { + name: 'CommunicationPayload', + props: { + data: { + type: Array, + default: () => [], + }, + }, + setup(props, { expose }) { + const targetList = ref([]) + onMounted(async () => { + const { code, data: resData } = await getMubiao() + if (code === '200') { + targetList.value = [resData] + } + }) const communicationPayloadColumns = [ { title: '通信对象', key: 'target', render(row) { return ( - + + options={targetList.value} + key-field="dataId" + label-field="nodeName" + > ) }, }, @@ -26,18 +57,12 @@ export default defineComponent({ }, }, ] - const communicationPayload = ref([ - { - id: 3, - target: '3', - status: true, - }, - ]) + return () => ( row.id} columns={communicationPayloadColumns} - data={communicationPayload.value} + data={props.data} /> ) }, diff --git a/src/views/Payload/Detection.jsx b/src/views/Payload/Detection.jsx index 3241846ee..aa9a4f8a5 100644 --- a/src/views/Payload/Detection.jsx +++ b/src/views/Payload/Detection.jsx @@ -1,8 +1,13 @@ import { NDataTable, NButton, NSelect, NInputNumber, NSwitch } from 'naive-ui' +import { useEntity } from '@/hooks/entity' export default defineComponent({ name: 'DetectionPayload', props: { + target: { + type: String, + require: true, + }, type: { type: String, default: 'radar', @@ -13,12 +18,14 @@ export default defineComponent({ }, }, setup(props) { + const { mbPayloadShowMap, satellitePayloadShowMap } = useEntity() + const detectingPayloadColumns = { radar: [ { title: '垂直起始角', key: 'minimumClock', - width: 180, + // width: 140, render(row) { return ( + return ( + changePayloadStatus(row)} + > + ) }, }, ], - corner: [ + conic: [ // { // title: '载荷类型', // key: 'type', @@ -152,15 +164,30 @@ export default defineComponent({ // }, { title: '是否开启', - key: 'status', + key: 'show', width: 120, render(row) { - return + return ( + changePayloadStatus(row)} + > + ) }, }, ], } + function changePayloadStatus(row) { + const { id, show } = row + const mapDict = { + mb: mbPayloadShowMap, + satellite: satellitePayloadShowMap, + } + const map = mapDict[props.target] + map.has(id) && (map.get(id).detectingPayload.show = show) + } + return () => ( row.id} diff --git a/src/views/PlaceName/hooks/mapboxHooks.jsx b/src/views/PlaceName/hooks/mapboxHooks.jsx index 4c1e55273..2884bf4b7 100644 --- a/src/views/PlaceName/hooks/mapboxHooks.jsx +++ b/src/views/PlaceName/hooks/mapboxHooks.jsx @@ -1,10 +1,13 @@ +import { ref } from 'vue' import maplibregl from 'maplibre-gl' import 'maplibre-gl/dist/maplibre-gl.css' import { style } from '../style' +const zoom = ref(0) export function useMapbox() { return { initMapbox, + zoom, } } @@ -16,7 +19,7 @@ function initMapbox() { style, // style URL center: [121, 19], // starting position [lng, lat] - zoom: 5, + zoom: zoom.value, }) map.on('load', function () { @@ -40,6 +43,10 @@ function initMapbox() { // }) }) + map.on('zoom', () => { + zoom.value = map.getZoom() + }) + map.on('click', e => { const features = map.queryRenderedFeatures(e.point) console.log(features) diff --git a/src/views/PlaceName/index.jsx b/src/views/PlaceName/index.jsx index e56112bee..b2f0b98e0 100644 --- a/src/views/PlaceName/index.jsx +++ b/src/views/PlaceName/index.jsx @@ -21,7 +21,7 @@ export default defineComponent({ const { model, showPlace, addPlaceName, initViewer, clickPoint } = usePlaceName() - const { initMapbox } = useMapbox() + const { initMapbox, zoom } = useMapbox() const { initOpenLayer } = useOpenLayer() onMounted(async () => { initMapbox() @@ -32,6 +32,7 @@ export default defineComponent({ return () => (
+
zoom:{zoom.value}
addPlaceName()}> 添加地名 diff --git a/src/views/PlaceName/style.js b/src/views/PlaceName/style.js index f4df764bf..d9ea047fd 100644 --- a/src/views/PlaceName/style.js +++ b/src/views/PlaceName/style.js @@ -101,7 +101,7 @@ export const style = { openmaptiles: { type: 'vector', scheme: 'tms', - tiles: ['http://192.168.10.187:8080/tmp/pbfMulti/{z}/{x}/{y}.pbf'], + tiles: ['http://192.168.10.143:2024/api/tmp/pbfMulti/{z}/{x}/{y}.pbf'], }, }, // tiles: [ @@ -464,14 +464,14 @@ export const style = { metadata: {}, source: 'openmaptiles', 'source-layer': 'admin', - minzoom: 5, + // minzoom: 1, filter: ['all', ['==', 'admin_level', 2]], layout: { visibility: 'visible', }, paint: { 'line-color': '#aaaaaa', - 'line-width': ['interpolate', ['linear'], ['zoom'], 4, 0.5, 7, 2], + 'line-width': ['interpolate', ['linear'], ['zoom'], 4, 1, 7, 2], }, }, { @@ -480,7 +480,7 @@ export const style = { metadata: {}, source: 'openmaptiles', 'source-layer': 'admin', - minzoom: 6, + minzoom: 3, filter: ['all', ['==', 'admin_level', 4]], layout: { visibility: 'visible', @@ -497,7 +497,7 @@ export const style = { metadata: {}, source: 'openmaptiles', 'source-layer': 'admin', - minzoom: 9, + minzoom: 6, filter: ['all', ['==', 'admin_level', 5]], layout: { visibility: 'visible', @@ -551,13 +551,55 @@ export const style = { }, interactive: true, }, - { id: 'province_point', type: 'symbol', metadata: {}, source: 'openmaptiles', 'source-layer': 'place', + minzoom: 4, + filter: ['all', ['==', 'type', 'state']], + layout: { + 'text-field': '{name}', + 'text-font': ['Open Sans Regular'], + 'text-padding': 5, + 'text-rotation-alignment': 'map', + // 'symbol-placement': 'line-center', + // 'text-pitch-alignment': 'viewport', + // 'text-size': 18, + // 'text-max-width': 6.25, + 'text-size': [ + 'interpolate', + ['linear', 1], + ['zoom'], + 4.99, + 13, + 5, + 14, + 7, + 15, + ], + }, + paint: { + 'text-halo-color': 'rgb(200, 200, 200)', + 'text-halo-width': 1, + 'text-color': { + stops: [ + [2, 'hsl(302, 16%, 36%)'], + [10, 'hsl(273, 33%, 22%)'], + ], + }, + 'text-halo-blur': 0.5, + }, + interactive: true, + }, + + { + id: 'county_point', + type: 'symbol', + metadata: {}, + source: 'openmaptiles', + 'source-layer': 'place', minzoom: 7, filter: ['all', ['==', 'type', 'county']], layout: { diff --git a/src/views/Satellite/components/SatDetail.jsx b/src/views/Satellite/components/SatDetail.jsx index 673415255..d725a13aa 100644 --- a/src/views/Satellite/components/SatDetail.jsx +++ b/src/views/Satellite/components/SatDetail.jsx @@ -1,24 +1,53 @@ +import { toRaw } from 'vue' import { useModal } from '@/views/Content/hooks/modal' -import { NDataTable, NButton, NSelect, NInputNumber, NSwitch } from 'naive-ui' +import { NButton } from 'naive-ui' import Detection from '@/views/Payload/Detection.jsx' import Communication from '@/views/Payload/Communication.jsx' +import { useEntity } from '@/hooks/entity' +import { updateSatellitePayload } from '@/api/Satellite' +import { useSatellite } from '../hooks/satellite' const { openDetailsModal } = useModal() export function showDetailsSatellite(option) { - const detectingPayload = ref([ - { - id: 3, - angle: 30, - // xHalfAngle: 20, - // yHalfAngle: 25, - // type: '电子', - status: true, - }, - ]) + const { extendInfo, id } = option + + const detectingPayload = ref([]) + function addDetectingPayload() { + detectingPayload.value.push({ + id, + angle: null, + show: false, + }) + } + const communicationPayload = ref([]) + function addCommunicationPayload() { + communicationPayload.value.push({ + id, + target: [], + show: false, + }) + } + + const { satellitePayloadShowMap } = useEntity() + if (extendInfo?.detectingPayload) { + detectingPayload.value.push({ + id, + angle: extendInfo.detectingPayload.angle, + show: satellitePayloadShowMap.get(id).detectingPayload.show, + }) + } + if (extendInfo?.communicationPayload) { + communicationPayload.value.push({ + id, + target: extendInfo.communicationPayload, + show: satellitePayloadShowMap.get(id).communicationPayload.show, + }) + } + openDetailsModal({ titleString: '' + option.name + ' 详情', contentSlot: () => ( -
+
基本信息
卫星编号：{option.name}
@@ -31,19 +60,79 @@ export function showDetailsSatellite(option) {
-
探测载荷
- + {/*
探测载荷
*/} +
+
探测载荷
+ {detectingPayload.value.length === 0 && ( + + 添加 + + )} +
+ {detectingPayload.value.length > 0 && ( + + )}
通信载荷
- - 添加 - + {communicationPayload.value.length === 0 && ( + + 添加 + + )} +
+ {communicationPayload.value.length > 0 && ( + + )} +
+ + updateSatelliteLoad({ + sat: option, + detection: detectingPayload.value, + communication: communicationPayload.value, + }) + } + > + 确定 + + {/* 取消 */}
-
), }) } +function updateSatelliteLoad({ sat: sateData, detection, communication }) { + // console.log(sateData, payload, communicationRef.value.communicationPayload) + if (!detection[0] && !communication[0]) { + return + } + const { getSatelliteList } = useSatellite() + const payloadData = { + id: sateData.id, + extendInfo: { + detectingPayload: detection[0] ? { angle: detection[0].angle } : null, + communicationPayload: communication[0] + ? toRaw(communication[0].target) + : null, + }, + } + // console.log(payloadData) + updateSatellitePayload(payloadData).then(res => { + if (res.code === '200') { + window.$message.success('保存成功') + getSatelliteList() + } + }) +} // export default defineComponent({ // name: 'SatDetail', diff --git a/src/views/Satellite/hooks/satellite.ts b/src/views/Satellite/hooks/satellite.ts index d8ec4d8c9..975708619 100644 --- a/src/views/Satellite/hooks/satellite.ts +++ b/src/views/Satellite/hooks/satellite.ts @@ -1,6 +1,9 @@ import SatelliteEntity from '@/js/SatelliteEntity' import { difference } from 'lodash' import { useEntity } from '@/hooks/entity' +import { useTree } from '@/utils/tree' +import { getSatellite } from '@/api/Satellite' + // import CreateFrustum from '@/js/Sensor' interface ISatellite { @@ -14,9 +17,11 @@ interface IBaseFilterParam { params: Array paramName: string } +const { filterTreeNodeByField } = useTree() const satelliteList = ref([]) +const checkedKeys = ref>([]) -const { satelliteMap, showOrHideLoad } = useEntity() +const { satelliteMap, showOrHideLoad, satellitePayloadShowMap } = useEntity() const showPoint = ref(true) function showPointUnderSat(id?: string) { @@ -54,14 +59,19 @@ export function useSatellite() { }) } // 创建satellite entity 实例 - function addSatellite({ tle }: ISatellite) { + function addSatellite({ id, tle }: ISatellite) { const satellite = new SatelliteEntity(tle) const cesiumSateEntity = satellite.createSatelliteEntity() // const result = viewer.entities.add(cesiumSateEntity) setTimeout(() => { // satellite.sensorType = Math.random() > 0.5 ? 'conic' : 'rectangle' - satellite.sensor = showOrHideLoad.value + const satPayload = satellitePayloadShowMap.get(id) + if (satPayload && satPayload.detectingPayload) { + satPayload.detectingPayload.angle && + (satellite.sensorAngle = satPayload.detectingPayload.angle) + satPayload.detectingPayload.show && (satellite.sensor = true) + } }, 1000) // viewer.clock.multiplier = 100 @@ -99,27 +109,76 @@ export function useSatellite() { } } - return { satelliteList, addSatellites, showPoint, showPointUnderSat } + return { + satelliteList, + checkedKeys, + getSatelliteList, + addSatellites, + showPoint, + showPointUnderSat, + } } -function filterTreeNodeByField({ - treeData, - params, - paramName, -}: IBaseFilterParam): Array { - return treeData.reduce((acc, node) => { - if (params.includes(node[paramName]) && !node.children) { - acc.push(node) - } - if (node.children) { - acc = acc.concat( - filterTreeNodeByField({ - treeData: node.children, - params, - paramName, - }) - ) - } - return acc - }, []) +// function filterTreeNodeByField({ +// treeData, +// params, +// paramName, +// }: IBaseFilterParam): Array { +// return treeData.reduce((acc, node) => { +// if (params.includes(node[paramName]) && !node.children) { +// acc.push(node) +// } +// if (node.children) { +// acc = acc.concat( +// filterTreeNodeByField({ +// treeData: node.children, +// params, +// paramName, +// }) +// ) +// } +// return acc +// }, []) +// } + +async function getSatelliteList() { + const checked = JSON.parse(JSON.stringify(checkedKeys.value)) + + const sateRes = await getSatellite() + const { data, code } = sateRes + if (code === '200') { + checkedKeys.value = [] + satelliteList.value = data + getAllNodesToPayload() + nextTick(() => { + checkedKeys.value = checked + }) + } + // console.log('data,code', data, code) +} + +function getAllNodesToPayload() { + // const mbList = getLeafNodeIds(satelliteList.value, 'dataId') + satelliteList.value.forEach(satellite => { + if (satellite.extendInfo) { + const { detectingPayload, communicationPayload } = satellite.extendInfo + const detectingShow = + satellitePayloadShowMap.get(satellite.id)?.detectingPayload?.show || + false + const communicationShow = + satellitePayloadShowMap.get(satellite.id)?.communicationPayload?.show || + false + satellitePayloadShowMap.set + + satellitePayloadShowMap.set(satellite.id, { + detectingPayload: detectingPayload + ? { ...detectingPayload, show: detectingShow } + : null, + communicationPayload: communicationPayload + ? { ...communicationPayload, show: communicationShow } + : null, + }) + } + }) + console.log('satellitePayloadShowMap', satellitePayloadShowMap) } diff --git a/src/views/Satellite/index.vue b/src/views/Satellite/index.vue index b8d0edbca..d9b99c90e 100644 --- a/src/views/Satellite/index.vue +++ b/src/views/Satellite/index.vue @@ -2,27 +2,16 @@ import type { TreeOption } from 'naive-ui' import { NButton } from 'naive-ui' import Tree from '@/components/Tree/index.vue' -import { getSatellite } from '@/api/Satellite' import { useSatellite } from './hooks/satellite' import { showDetailsSatellite } from './components/SatDetail' -const { satelliteList, addSatellites } = useSatellite() +const { satelliteList, checkedKeys, getSatelliteList, addSatellites } = + useSatellite() onMounted(async () => { getSatelliteList() }) -async function getSatelliteList() { - const sateRes = await getSatellite() - const { data, code } = sateRes - if (code === '200') { - satelliteList.value = data - } - // console.log('data,code', data, code) -} - -const checkedKeys = ref>([]) - watch(checkedKeys, val => { addSatellites(val) })