zb,hj点击定位，添加事件子事件参数，添加二级分类数据

public/baseConfig.js

@@ -87,5 +87,6 @@ window['settings'] = {
     eventType: { label: '事件分类', color: 'info' },
 
     subEvent: { label: '子事件', color: 'warning' },
+    twoEvent: { label: '二级分类', color: 'warning' },
   },
 }

src/api/Gantt/index.js

@@ -7,15 +7,45 @@ const sub = [
     type: 'eventType',
     children: [
       {
-        id: 1,
+        id: 122,
-        name: '发射事件',
+        name: '弹道DD',
         start: '2024-11-15',
         end: '2024-11-17',
-        type: 'subEvent',
+        type: "twoEvent",
-        trajData: {},
+        children: [
-        avatar: '/images/影像.jpg',
+          {
+            id: 1,
+            name: '发射事件',
+            start: '2024-11-15',
+            end: '2024-11-17',
+            type: 'subEvent',
+            trajData: {},
+            avatar: '/images/影像.jpg',
+
+          },
+        ],
+      },
+      {
+        id: 188,
+        name: '巡航DD',
+        start: '2024-11-15',
+        end: '2024-11-17',
+        type: "twoEvent",
+        children: [
+          {
+            id: 1,
+            name: '发射事件',
+            start: '2024-11-15',
+            end: '2024-11-17',
+            type: 'subEvent',
+            trajData: {},
+            avatar: '/images/影像.jpg',
+
+          },
+        ],
       },
     ],
+
   },
   {
     id: 300,

src/views/BaseMB/index.vue

@@ -26,17 +26,18 @@ watch(checkedKeys, val => {
 
 const { flyTo } = useEarth()
 const nodeProps = ({ option }: { option: TreeOption }) => {
+  // console.log(option, 'option')
   return {
     onclick: () => {
       if (option.children) {
         return
       }
+
       const {
         dataId,
         data: { geom },
       } = option
       const [lon, lat] = parseWKT(geom).coordinates
-
       if (checkedKeys.value.includes(dataId as string)) {
         flyTo({ lon, lat })
       }
@@ -44,9 +45,7 @@ const nodeProps = ({ option }: { option: TreeOption }) => {
   }
 }
 
-const renderSuffix = ({ option }: { option: TreeOption }) => {
+const renderSuffix = ({ option }: { option: TreeOption }) => {}
-  
-}
 </script>
 
 <template>

src/views/Gantt/components/EventList/components/MainEventEdit.jsx

@@ -23,13 +23,24 @@ export default defineComponent({
     }
 
     watch(
-      [() => mainEventData.value.start, () => mainEventData.value.end],
+      [
-      ([start, end]) => {
+        () => mainEventData.value.start,
+        () => mainEventData.value.end,
+        () => mainEventData.value.avatar,
+      ],
+      ([start, end, avatar]) => {
         timeRange.value = start ? [start, end] : null
+        uploadImg.value = [
+          {
+            url: avatar,
+            status: 'finished',
+          },
+        ]
       }
     )
 
     const timeRange = ref(null)
+    const uploadImg = ref([])
 
     return () => (
       <ModalCom v-model:show={showMainEvent.value} title="编辑事件">
@@ -49,6 +60,13 @@ export default defineComponent({
               clearable
             />
           </NFormItem>
+          <NFormItem label="上传图片" path="avatar">
+            <NUpload
+              default-file-list={uploadImg.value}
+              list-type="image-card"
+              max={1}
+            />
+          </NFormItem>
         </NForm>
         <div class="flex justify-end gap-2">
           <NButton onClick={close}>取消</NButton>

src/views/Gantt/components/EventList/components/SubEventEdit.jsx

@@ -5,6 +5,7 @@ import {
   NButton,
   NDatePicker,
   NUpload,
+  NSelect,
 } from 'naive-ui'
 import ModalCom from '@/components/Modal/index.vue'
 import { useEvent } from '../hooks'
@@ -41,6 +42,9 @@ export default defineComponent({
 
     const timeRange = ref(null)
     const uploadImg = ref([])
+    const value1 = ref(null)
+    const value2 = ref(null)
+    const value3 = ref(null)
 
     return () => (
       <ModalCom
@@ -53,6 +57,15 @@ export default defineComponent({
           label-placement="left"
           label-width="auto"
         >
+          <NFormItem label="二级分类">
+            <NSelect v-model:value={value1.value}></NSelect>
+          </NFormItem>
+          <NFormItem label="步骤">
+            <NSelect v-model:value={value2.value}></NSelect>
+          </NFormItem>
+          <NFormItem label="目标">
+            <NSelect v-model:value={value3.value}></NSelect>
+          </NFormItem>
           <NFormItem label="事件名称" path="name">
             <NInput v-model:value={eventData.value.name} />
           </NFormItem>

src/views/Gantt/components/EventList/hooks.jsx

@@ -7,6 +7,7 @@ const mainEventData = ref({
   start: '',
   end: '',
   type: 'mainEvent',
+  avatar: '',
 })
 
 const showNewEvent = ref(false)

src/views/Gantt/components/EventList/index.jsx

@@ -105,7 +105,7 @@ export default defineComponent({
                   编辑事件
                 </NButton>
               )}
-              {row.type === 'eventType' ? (
+              {row.type === 'twoEvent' ? (
                 <NButton
                   type="success"
                   size="small"

src/views/Gantt/components/Gantt/hooks/gantt.ts

@@ -23,6 +23,7 @@ const useGantt = ({ router, route }: GanttParams) => {
   async function getGanttData() {
     if (subId) {
       const res = await getSubGantt(subId)
+
       records.value = res
       ganttInstance?.setRecords(records.value)
     } else {
@@ -43,7 +44,15 @@ const useGantt = ({ router, route }: GanttParams) => {
       records: records.value,
       taskListTable: renderTaskListTable(),
       tasksShowMode: TYPES.TasksShowMode.Sub_Tasks_Arrange,
-
+      // groupBy: 'name',
+      // groupField: 'name',
+      // widthMode: 'standard',
+      // groupTitleFieldFormat: (record, col, row, table) => {
+      //  console.log(record, col, row, table, '----')
+      // const groupData = table.getGroupData(record); // 获取分组数据
+      // const count = groupData ? groupData.length : 0; // 计算分组下的记录数量
+      // return `${record.name} (${count})`; // 返回格式化的分组标题
+      // },
       frame: {
         outerFrameStyle: {
           borderLineWidth: 2,
@@ -134,6 +143,62 @@ const useGantt = ({ router, route }: GanttParams) => {
         title: subId ? '事件类型' : '事件主体',
         width: '120',
         mergeCell: true,
+        customLayout: args => {
+          console.log(args, 'srgs')
+          const { table, row, col, rect, dataValue } = args
+          // console.log(
+          //   table,
+          //   '1',
+          //   row,
+          //   '2',
+          //   col,
+          //   '3',
+          //   rect,
+          //   '4',
+          //   dataValue,
+          //   '5',
+          //   '-----------'
+          // )
+          const { height, width } = rect ?? table.getCellRect(col, row)
+          const container = new Group({
+            width,
+            height,
+            fill: 'transparent',
+            // fill: textColor,
+            // fillOpacity: 0.1,
+            // stroke: textColor,
+            // strokeOpacity: 0.2,
+            // lineWidth: 4,
+            display: 'flex',
+            flexDirection: 'column',
+            justifyContent: 'center',
+            alignItems: 'center',
+            cursor: 'pointer',
+          })
+          console.log(args)
+          const count = table.records.find(r => dataValue === r.name)?.children
+            ?.length
+          const values = new Text({
+            text: `${dataValue}`,
+            fontSize: 16,
+            fontFamily: 'sans-serif',
+            fill: textColor,
+            textAlign: 'center',
+            // boundsPadding: [10, 0, 0, 0],
+          })
+          const counts = new Text({
+            text: `( ${count} )`,
+            fontSize: 13,
+            fontFamily: 'sans-serif',
+            fill: textColor,
+            boundsPadding: [10, 0, 0, 0],
+          })
+          container.add(values)
+          container.add(counts)
+          return {
+            rootContainer: container,
+          }
+        },
       },
     ]
     if (subId) {
@@ -166,7 +231,6 @@ const useGantt = ({ router, route }: GanttParams) => {
             cellBgColor: 'transparent',
           },
         },
-
         bodyStyle: {
           borderColor: textColorWithOp,
           textAlign: 'center',
@@ -210,6 +274,7 @@ const useGantt = ({ router, route }: GanttParams) => {
         })
         if (!subId) {
           container.addEventListener('click', () => {
+            console.log(taskRecord, 'ooooooo')
             router.push({
               path: `/gantt/sub/${taskRecord.id}`,
             })
@@ -252,6 +317,7 @@ const useGantt = ({ router, route }: GanttParams) => {
         })
 
         container.add(nameContainer)
+
         if ('trajData' in taskRecord && taskRecord.trajData) {
           const taskRecordSymbol = new Image({
             width: 20,
@@ -264,6 +330,7 @@ const useGantt = ({ router, route }: GanttParams) => {
           })
           nameContainer.add(taskRecordSymbol)
         }
+
         const name = new Text({
           text: taskRecord.name,
           fontSize: 16,

src/views/Gantt/components/MainGantt/index.jsx

@@ -1,11 +1,18 @@
 import { useRouter } from 'vue-router'
-import { NDatePicker, NRadioButton, NRadioGroup, NButton } from 'naive-ui'
+import {
+  NDatePicker,
+  NRadioButton,
+  NRadioGroup,
+  NButton,
+  NSelect,
+} from 'naive-ui'
 import GanttCom from '../Gantt'
 
 export default defineComponent({
   setup() {
     const range = ref()
     const value = ref('day')
+    const type = ref()
 
     const router = useRouter()
     const editEvent = () => {
@@ -25,6 +32,11 @@ export default defineComponent({
             <NRadioButton value="hour" label="日" />
             <NRadioButton value="day" label="月" />
           </NRadioGroup>
+          <NSelect
+            v-model:value={type.value}
+            mode="multiple"
+            style="width: 200px"
+          ></NSelect>
           {/* <NButton class="ml-auto" type="primary" onClick={editEvent}>
             编辑事件
           </NButton> */}

src/views/Gantt/index.jsx

@@ -80,9 +80,9 @@ export default defineComponent({
                 type="card"
                 animated
                 placement="left"
-                defaultValue={'任务列表'}
+                defaultValue={'事件列表'}
               >
-                <NTabPane
+                {/* <NTabPane
                   class={paneClass}
                   name="任务列表"
                   tab="任务列表"
@@ -103,7 +103,7 @@ export default defineComponent({
                       <TaskList />
                     </div>
                   </div>
-                </NTabPane>
+                </NTabPane> */}
                 <NTabPane
                   class={paneClass}
                   name="事件列表"

src/views/Hangjing/hooks/hangjingPolygon.ts

@@ -102,6 +102,7 @@ export const useHjPolygon = (polygonMap: Map<string | number, any>) => {
     })
 
     const centerPoint = centerOfMass(feature).geometry.coordinates
+    console.log(centerPoint, 'centerPoint')
 
     const centerEntity = addPolygonCenter(centerPoint)
     addEventSub({

src/views/Hangjing/index.vue

@@ -9,6 +9,9 @@ import { getHangjing } from '@/api/Hangjing'
 import { useHangjing } from './hooks/hangjing'
 import { convertToWKT } from '@/utils/parseWKT'
 import { useHangjingDetail } from './hooks/hangjingDetail'
+import { useEarth } from '../Earth/hooks/earth'
+import { parseWKT } from '@/utils/parseWKT'
+import { centerOfMass } from '@turf/turf'
 // import { useHangjingStyle } from './hooks/hangjingStyle'
 import Tree from '@/components/Tree/index.vue'
 
@@ -83,7 +86,6 @@ const drawArea = () => {
         const cartographic = Cesium.Cartographic.fromCartesian(pos, ellipsoid)
         const latitude = Cesium.Math.toDegrees(cartographic.latitude)
         const longitude = Cesium.Math.toDegrees(cartographic.longitude)
-
         return [longitude, latitude]
       })
       const area = polygon([[...posList, posList[0]]])
@@ -95,7 +97,7 @@ const drawArea = () => {
 }
 
 const { showDetailsModal } = useHangjingDetail()
-
+const { flyTo } = useEarth()
 const renderLabel = ({ option }) => {
   // if()
   if (option.data) {
@@ -108,6 +110,24 @@ const renderLabel = ({ option }) => {
     return option.nodeName
   }
 }
+const nodeProps = ({ option }: { option: TreeOption }) => {
+  return {
+    onclick: () => {
+      if (option.children) {
+        return
+      }
+      const {
+        dataId,
+        data: { geom },
+      } = option
+      const feature = parseWKT(geom)
+      const [lon, lat] = centerOfMass(feature).geometry.coordinates
+      if (checkedKeys.value.includes(dataId as string)) {
+        flyTo({ lon, lat })
+      }
+    },
+  }
+}
 const renderSuffix = ({ option }) => {
   return (
     option.data &&
@@ -212,6 +232,7 @@ onMounted(() => {
       showSearch
       :renderSuffix="renderSuffix"
       :renderLabel="renderLabel"
+      :nodeProps="nodeProps"
     />
   </div>
 </template>

src/views/Mubiao/index.vue

@@ -11,6 +11,11 @@ import { useMuBiaoDisappearWS } from './hooks/mubiaoDisappear'
 import { useMubiaoDetail } from './hooks/mubiaoDetail'
 import { useMBTrajectory } from './components/HisTrajectory/hooks/mbTraj'
 import { useDaodan } from '../Daodan/ddHooks'
+import { useEarth } from '../Earth/hooks/earth'
+import { parseWKT } from '@/utils/parseWKT'
+import { difference } from 'lodash'
+import { useEntity } from '@/hooks/entity'
+import { cartesian32LonLat } from '@/utils/pos'
 
 const { getMubiaoData, data, addMubiao, checkedKeys } = useMubiao()
 const useMbPosWS = useMuBiaoPositionWS()
@@ -30,7 +35,35 @@ watch(checkedKeys, val => {
 
 const { showDetailsMubiao } = useMubiaoDetail()
 const { showOrHideHisTraj } = useMBTrajectory()
+const { mubiaoMap } = useEntity()
+
 // const { showOrHideDdConfig } = useDaodan()
+const { flyTo } = useEarth()
+const latValue = {}
+const nodeProps = ({ option }: { option: TreeOption }) => {
+  return {
+    onclick: () => {
+      if (option.children) {
+        return
+      }
+      setTimeout(() => {
+        if (mubiaoMap.size > 0) {
+          mubiaoMap.forEach((entity, key) => {
+            const positions = entity.position._value
+            const [lon, lat, height] = cartesian32LonLat(positions)
+            const {
+              dataId,
+              // data: { geom },
+            } = option
+            if (checkedKeys.value.includes(dataId as string)) {
+              flyTo({ lon, lat })
+            }
+          })
+        }
+      }, 500)
+    },
+  }
+}
 const renderSuffix = ({ option }: { option: TreeOption }) => {
   // console.log(option.data)
   if (!option.data) {
@@ -103,6 +136,7 @@ const renderSuffix = ({ option }: { option: TreeOption }) => {
         v-model:checked="checkedKeys"
         showSearch
         :renderSuffix="renderSuffix"
+        :nodeProps="nodeProps"
       />
     </div>
 

src/views/Satellite/hooks/satellite.ts

@@ -52,6 +52,7 @@ export function useSatellite() {
       nodes.forEach(node => {
         const entity = addSatellite(node)
         satelliteMap.set(node.id, entity)
+        //console.log(satelliteMap, '卫星')
         if (showPoint.value) {
           showPointUnderSat(node.id)
         }

src/views/Satellite/index.vue

@@ -4,9 +4,15 @@ import { NButton } from 'naive-ui'
 import Tree from '@/components/Tree/index.vue'
 import { useSatellite } from './hooks/satellite'
 import { showDetailsSatellite } from './components/SatDetail'
+import { useEarth } from '../Earth/hooks/earth'
+import { useEntity } from '@/hooks/entity'
 
-const { satelliteList, checkedKeys, getSatelliteList, addSatellites } =
+const {
-  useSatellite()
+  satelliteList,
+  checkedKeys,
+  getSatelliteList,
+  addSatellites,
+} = useSatellite()
 
 onMounted(async () => {
   getSatelliteList()
@@ -15,7 +21,33 @@ onMounted(async () => {
 watch(checkedKeys, val => {
   addSatellites(val)
 })
+const { flyTo } = useEarth()
+const { satelliteMap } = useEntity()
+const nodeProps = ({ option }: { option: TreeOption }) => {
+  // console.log(option, '卫星option')
 
+  return {
+    onclick: () => {
+      // console.log(satelliteMap, 'satelliteMap')
+    },
+  }
+  // return {
+  //   onclick: () => {
+  //     if (option.children) {
+  //       return
+  //     }
+
+  //     const {
+  //       dataId,
+  //       data: { geom },
+  //     } = option
+  //     const [lon, lat] = parseWKT(geom).coordinates
+  //     if (checkedKeys.value.includes(dataId as string)) {
+  //       flyTo({ lon, lat })
+  //     }
+  //   },
+  // },
+}
 const renderSuffix = ({ option }: { option: TreeOption }) => {
   // console.log(option)
   return h('div', { class: 'flex items-center gap-2 pr-2' }, [
@@ -56,6 +88,7 @@ const renderSuffix = ({ option }: { option: TreeOption }) => {
       v-model:checked="checkedKeys"
       showSearch
       :renderSuffix="renderSuffix"
+      :nodeProps="nodeProps"
     />
     <!-- <sat-detail /> -->
   </div>