事件状态，倍速

src/renderer/components.d.ts

@@ -26,6 +26,7 @@ declare module 'vue' {
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSlider: typeof import('element-plus/es')['ElSlider']

src/renderer/src/views/TS/cabin.vue

@@ -103,7 +103,7 @@ const initTreeCallBack = () => {
     //gis实例渲染后，查找是否有相关的轨迹运动对象，有则渲染
     let guijiEvents = window['tsObj']._Store.getTaskByProperty("move", "callback")
     guijiEvents.forEach(event => {
-
+      const multiplier = window['tsObj']?._Store?._multiplier ?? 1; // 可选链 + 默认值
       let detail = typeof event.detail == 'string' ? JSON.parse(event.detail) : JSON.parse(JSON.stringify(event.detail))
       let duration_S = (event.endTime - event.startTime) / 1000
       let distance = new YJ.Tools().computeDistance2(detail.line.positions);
@@ -111,8 +111,8 @@ const initTreeCallBack = () => {
       detail.speed = speed
       console.log("event的detail", detail)
       initMapData("guiji", detail, (TrajectoryMotionObject) => {
-        TrajectoryMotionObject.state = false
+        TrajectoryMotionObject.state = false;
-        TrajectoryMotionObject.oldSpeed = (distance / duration_S) * window['tsObj']._Store._multiplier
+        TrajectoryMotionObject.oldSpeed = distance / duration_S * multiplier;
         (window as any)._entityMap.set(event.id + event.callback + event.sourceId, TrajectoryMotionObject)
         let tsEntitys = (window as any)._entityMap.get(event.sourceId);
         TrajectoryMotionObject.moveCallBack(tsEntitys)

src/renderer/src/views/TS/components/chart.vue

@@ -7,9 +7,9 @@
       </template>
       <template v-for="(event,index) in eventList" :key="index">
         <div class="row" :style="getStyle">
-          <div class="bar" :style="progressStyle(event)" @dblclick="clickEventBar(event)">{{
+          <div class="bar" :style="progressStyle(event)" @dblclick="clickEventBar(event)"><!--{{
               event.name + event.duration_time
-            }}
+            }}-->
           </div>
         </div>
       </template>
@@ -89,7 +89,7 @@ let getWidth = (durationTime) => {
 // 6. 让 progressStyle 间接依赖 refreshKey（通过 getWidth）
 let progressStyle = (task) => {
   let taskLeft = task.startTime - window['tsObj']._Store._startTimestamp;
-  let style:any = {
+  let style: any = {
     width: getWidth(task.duration_time) * 1000 + "px",
     left: getWidth(taskLeft) + "px",
   };

src/renderer/src/views/TS/deduction.vue

@@ -4,12 +4,33 @@
     <div class="layoutBox">
       <div class="control">
         <span>{{ formatTime(currentStamp) }}</span>
-        <el-icon :size="20" @click="play">
+        <!--<template v-if="status">-->
-          <ZoomOut/>
+        <template v-if="TSOBJ._Clock._status=='play'">
-        </el-icon>
+          <el-icon :size="20" @click="stopCallBack('pause')">
-        <el-icon :size="20" @click="stop">
+            <VideoPause/>
-          <ZoomIn/>
+          </el-icon>
+        </template>
+        <template v-else>
+          <el-icon :size="20" @click="play">
+            <VideoPlay/>
+          </el-icon>
+        </template>
+        <el-icon :size="20" @click="stopCallBack('stop')">
+          <RefreshLeft/>
         </el-icon>
+        <el-popover
+          placement="bottom"
+          title="Title"
+          :width="200"
+          trigger="click"
+          content="this is content, this is content, this is content"
+        >
+          <template #reference>
+            <span class="el-icon">{{ TSOBJ._Store._multiplier }}×</span>
+          </template>
+        </el-popover>
+
+
         <span class="title">{{ TSOBJ.name }}</span>
         <span class="zoom">
           <el-icon :size="20" @click="add(-1)">
@@ -52,7 +73,7 @@
 </template>
 
 <script setup lang="ts">
-import {ZoomIn, ZoomOut} from '@element-plus/icons-vue'
+import {ZoomIn, ZoomOut, VideoPlay, VideoPause, RefreshLeft} from '@element-plus/icons-vue'
 
 import EventParams from "./components/eventParams.vue"
 import Grid from "./components/grid.vue"
@@ -73,6 +94,7 @@ let distanceOfTicTiny = ref(5)
 let distanceOfTicMain = ref(5)
 let originOffset = ref(0)
 let originMainOffset = ref(0)
+let status = ref(false)
 distanceOfTicMain.value = window['tsObj']._Store.getScale('numOfMain') * distanceOfTicTiny.value
 const propsMap = {
   ticTiny,
@@ -85,7 +107,8 @@ const propsMap = {
   scrollLeft,
   cursorLeft,
   originHrOffset,
-  currentStamp
+  currentStamp,
+
 }
 // 更新数值触发视图更新
 window['updateProp'] = (key: string, val: any) => {
@@ -101,10 +124,72 @@ let formatTime = (timeStamp) => {
   return props.TSOBJ.parseTime(timeStamp)
 }
 let play = () => {
+  console.log("播放播放")
+  props.TSOBJ._Clock._status = "play"
   props.TSOBJ._Clock.animation(props.TSOBJ._Store, eventCallback)
+
+  pauseTrajectoryMotion()
 }
-let stop = () => {
+let stopCallBack = (status) => {
+  props.TSOBJ._Clock._status = status
   props.TSOBJ._Clock.stopAnimation()
+  // 暂停机动事件
+  pauseTrajectoryMotion()
+  if (status == 'stop') {
+    //   将当前时间设置为仿真开始时间
+    props.TSOBJ._Store.currentTimestamp = props.TSOBJ._Store._startTimestamp
+    // 将时间指示器和面板归位
+    props.TSOBJ._Store.setScale('scrollLeft', 0)
+    props.TSOBJ._Store.setScale('cursorLeft', 0)
+    Revert()
+  }
+
+}
+let Revert = () => {
+  props.TSOBJ._Store._tasks.forEach(task => {
+    let idKey = window['treeObj'].setting.data.simpleData.idKey
+    let node = window['treeObj'].getNodeByParam(idKey, task.sourceId, null);
+    if (typeof node.detail == 'string') {
+      node.detail = JSON.parse(node.detail)
+    }
+    console.log(node)
+    let entity = window['_entityMap'].get(task.sourceId)
+    switch (task.callback) {
+      case 'flicker':
+        entity && entity.flicker(1, 1);
+        break
+      case "move":
+        let position = node.detail.position || node.detail.positions
+        if (node.type == "ground_image") {
+          entity.position = position
+        } else {
+          entity.lng = position.lng
+          entity.lat = position.lat
+          entity.alt = position.alt
+        }
+        console.log("position", position)
+        break
+    }
+  })
+}
+let pauseTrajectoryMotion = () => {
+  let currentTasks = props.TSOBJ._Store.getTaskInStamp()
+  console.log("currentTasks", currentTasks)
+  currentTasks.forEach(task => {
+    if (task.callback == 'move') {
+      let TrajectoryMotionMapKey = task.id + task.callback + task.sourceId
+      let TrajectoryMotionObject = window['_entityMap'].get(TrajectoryMotionMapKey);
+      if (props.TSOBJ._Clock._status == 'play') {
+        TrajectoryMotionObject.resume()
+      } else {
+        TrajectoryMotionObject.pause()
+        if (props.TSOBJ._Clock._status == 'stop') {
+          TrajectoryMotionObject.setMovePositionByTime(0)
+        }
+      }
+
+    }
+  })
 }
 
 function todoEvent(timeId: number, res: any, isEnd: boolean) {
@@ -118,10 +203,14 @@ function todoEvent(timeId: number, res: any, isEnd: boolean) {
     window['did_ts_Arr'].push(res.id)
     switch (res.callback) {
       case 'flicker':
-        let tsEntity = window['earth_ts'].entityMap.get(res.sourceId);
+        let tsEntity = (window as any)._entityMap.get(res.sourceId);
         tsEntity.flicker(Number(res.detail.times) * 1000, Number(res.detail.numbers))
         break;
       case 'move':
+        let TrajectoryMotionObject = (window as any)._entityMap.get(res.id + res.callback + res.sourceId);
+
+        TrajectoryMotionObject.speed = TrajectoryMotionObject.oldSpeed * props.TSOBJ._Store._multiplier
+        TrajectoryMotionObject.state = true
         break
     }
   }
@@ -153,7 +242,8 @@ let eventCallback = () => {
       todoEvent(timeId, res, isEnd);
     });
   }
-  fun(dataMap)
+  if (props.TSOBJ._Clock._status == 'play')
+    fun(dataMap)
 }
 let add = (num) => {
   // 大格12个取值，小格间距3个取值，level，8-1
@@ -194,7 +284,14 @@ onBeforeUnmount(() => {
     .control {
       position: relative;
       height: 30px;
-      line-height: 30px;
+      //line-height: 30px;
+      display: flex;
+      align-items: center;
+
+      .el-icon {
+        cursor: pointer;
+        margin: 0 2px;
+      }
 
       .title {
         left: 62.5%;

src/renderer/src/views/TS/edit.vue

@@ -70,6 +70,9 @@ eventBus.on('delete-event', (ids) => {
   console.log(ids)
   tsOBJ.value._Store._tasks = tsOBJ.value._Store._tasks.filter(item => !ids.includes(item.id))
 })
+eventBus.on('add-event', (task) => {
+  tsOBJ.value._Store._tasks = [...tsOBJ.value._Store._tasks, task]
+})
 // 新建态势推演对象
 let newTS = (params, events) => {
 

src/renderer/src/views/TS/element.vue

@@ -81,14 +81,14 @@ const tabs = [
     name: "基础标绘", dataType: 'list', children:
       [
         {name: "点", source_name: "点标注", funName: 'DrawPoint', type: "point"},
-        {name: "线", source_name: "线标注", funName: 'DrawPolyline', type: "line"},
+        {name: "线", source_name: "线标注", funName: 'DrawPolyline', type: "line", positionLength: 2},
-        {name: "面", source_name: "面标注", funName: 'DrawPolygon', type: "panel"},
+        {name: "面", source_name: "面标注", funName: 'DrawPolygon', type: "panel", positionLength: 3},
         {name: "圆", source_name: "圆标注", funName: 'DrawCircle', type: "circle"},
-        {name: "攻击箭头", source_name: "攻击箭头", funName: 'DrawAttackArrow', type: "attackArrow"},
+        {name: "攻击箭头", source_name: "攻击箭头", funName: 'DrawAttackArrow', type: "attackArrow", positionLength: 3},
-        {name: "钳形箭头", source_name: "钳形箭头", funName: 'DrawPincerArrow', type: "pincerArrow"}
+        {name: "钳形箭头", source_name: "钳形箭头", funName: 'DrawPincerArrow', type: "pincerArrow", positionLength: 5}
       ]
   },
-  {name: "特效", dataType: 'list', children: [{name: "火焰"}]},
+  {name: "特效", dataType: 'list', children: [/*{name: "火焰"}*/]},
 ]
 let treeData = ref<Tree[]>([])
 // 模型类型
@@ -194,12 +194,15 @@ let addMarker = (item) => {
         case 'pincerArrow':
           delete obj.position
           obj.positions = position
+          if (position.length < item.positionLength) return
           break
         case 'circle':
+          delete obj.position
           obj.center = position.center
           obj.radius = position.radius
           break
       }
+      // console.log("添加标注标会")
       addMapSource(item.type, pId, obj)
     }
 

src/renderer/src/views/TS/newEvent.vue

@@ -299,7 +299,7 @@ const addEvent = () => {
         message: "操作成功",
         type: "success"
       })
-
+      eventBus.emit('add-event', {...dbParams, duration_time: duration_S})
     }
     if (currentKey.value == 'move') {
       let params = JSON.parse(JSON.stringify(obj))
@@ -307,8 +307,8 @@ const addEvent = () => {
       let speeds = (distance / duration_S) * window['tsObj']._Store._multiplier
       params.speed = speeds
       initMapData("guiji", params, (entityObject) => {
-        entityObject.state = false
+        entityObject.state = false;
-        entityObject.oldSpeed = (distance / duration_S) * window['tsObj']._Store._multiplier
+        entityObject.oldSpeed = (distance / duration_S) * window['tsObj']._Store._multiplier;
         (window as any)._entityMap.set(dbParams.id + dbParams.callback + dbParams.sourceId, entityObject)
         let tsEntitys = (window as any)._entityMap.get(dbParams.sourceId);
         entityObject.moveCallBack(tsEntitys)

src/renderer/src/views/TS/sdk/Clock.ts

@@ -1,14 +1,18 @@
 export class Clock {
   _timer1
   _timer
+  _status
 
   constructor() {
     this._timer1 = null//
     this._timer = null//
+    this._status = "stop"//play/pause
   }
 
   animation(store, eventCallback) {
-    let multiplier = 1
+    // let multiplier = 1
+    let {_multiplier} = store
+
     console.log("开始播放推演")
     //点击播放按钮时的时间戳
     let nowTime = Date.now()
@@ -20,13 +24,13 @@ export class Clock {
     this._timer1 = setInterval((function run() {
       setTimeout(() => {
         eventCallback()
-      }, 1000 / multiplier)
+      }, 1000 / _multiplier)
       return run
-    })(), 1000 / multiplier)
+    })(), 1000 / _multiplier)
     //每毫米执行,
     this._timer = setInterval(() => {
       let now = Date.now()
-      diff = (now - nowTime) * multiplier
+      diff = (now - nowTime) * _multiplier
       store._currentTimestamp += diff
       // 更新UI层的当前时间戳变量
       window['updateProp']('currentStamp', store._currentTimestamp)

src/renderer/src/views/TS/sdk/Store.ts

@@ -158,10 +158,18 @@ export class Store {
   // 通过特定的字段名和值来获取事件
   getTaskByProperty(value, property = "ID", isReturnPropertyValue = null) {
     // console.log("getTaskById", id)
-    if (isReturnPropertyValue) {
+    let result = []
-      return this._tasks.map(task => task[isReturnPropertyValue])
+    result = this._tasks.filter(task => (task[property] == value))
-    } else {
+    isReturnPropertyValue != null && (result = result.map(task => task[isReturnPropertyValue]))
-      return this._tasks.filter(task => (task[property] == value))
+    return result
-    }
+  }
+
+  getTaskInStamp() {
+    return this._tasks.filter(item => this._currentTimestamp > item.startTime && this._currentTimestamp <= item.endTime)
+  }
+
+  set currentTimestamp(val) {
+    this._currentTimestamp = val
+    window['updateProp']("currentStamp", val)
   }
 }