Merge branch 'zyl' of http://xny.yj-3d.com:3000/zhouyulong/electron-4 into zyl

src/renderer/src/I18n/zh-CN.ts

@@ -378,7 +378,7 @@ export default {
     operationalTime: "作战时间",
     enterTuiyan: "进入推演页面",
     ersanwei: "二三维模式",
-    back: "返回",
+    back: "返回到历史推演",
     exitTs: "退出方案库",
     save: "保存",
     cancel: "取消",

src/renderer/src/I18n/zh-TW.ts

@@ -48,10 +48,10 @@ export default {
   firstMenu: {
     situation: '態勢推演',
     measure: '測量庫',
-    tool: '工具库',
-    effect: '工具庫',
+    tool: '工具庫',
+    effect: '特效庫',
     bigData: '大數據',
-    modelLibrary: '模型库',
+    modelLibrary: '模型庫',
     onlinePictureSource: '在線圖源',
     analysis: '分析庫',
     militaryMark: '軍標庫',
@@ -376,7 +376,7 @@ export default {
     operationalTime: "作戰時間",
     enterTuiyan: "進入推演頁面",
     ersanwei: "二三維模式",
-    back: "返回",
+    back: "返回到曆史推演",
     exitTs: "退出方案庫",
     save: "儲存",
     cancel: "取消",

src/renderer/src/api/ts/index.ts

@@ -46,6 +46,13 @@ export const TsApi = {
       data
     })
   },
+  //修改树层级
+  updateTreeIndex: async (data: any) => {
+    return await request.post({
+      url: `/tsSource/dragSource`,
+      data
+    })
+  },
   //树的隐藏显示
   updateTreeShow: async (data: any) => {
     let datas = []

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

@@ -156,22 +156,25 @@ const initTreeCallBack = () => {
         }
       }
       if (layerTypes.includes(arr[i].sourceType)) {
+        console.log(detail, params)
         if (!detail && !params) {
           detail = {
             id: arr[i].id,
             name: arr[i].sourceName,
-            isShow: arr[i].isShow
+            show: Boolean(arr[i].isShow)
           }
         }
-        layers.push(
-          {
+        let layer = {
           sourceType: arr[i].sourceType,
-            detail: {...detail, ...params}
+          detail: {...detail, ...params, layerIndex: layers.length + 1}
         }
-        )
+        console.log(layer)
+        layers.push(layer)
       } else {
         console.log({...detail, ...params})
-        initMapData(arr[i].sourceType, {...detail, ...params},)
+        let details = {...detail, ...params}
+        details.show = Boolean(arr[i].isShow)
+        initMapData(arr[i].sourceType, details)
 
       }
     }
@@ -199,7 +202,7 @@ const initTreeCallBack = () => {
     if ((window as any).earth_ts) {
       for (let i = 0; i < layers.length; i++) {
         initMapData(layers[i].sourceType, layers[i].detail, (layer) => {
-          layer.show = Boolean(layers[i].isShow)
+          // layer.show = Boolean(layers[i].show)
         })
       }
     }
@@ -210,6 +213,48 @@ const onDblClick = (event: MouseEvent, treeId: string, treeNode: any) => {
   entityObject = (window as any)._entityMap.get(treeNode.id)
   entityObject.flyTo()
 }
+/**
+ * 用于捕获节点拖拽操作结束的事件回调函数
+ * @param event 事件对象
+ * @param treeId 树形结构id
+ * @param treeNodes 被拖拽的节点 JSON 数据集合
+ * @param targetNode 成为 treeNodes 拖拽结束的目标节点 JSON 数据对象
+ * @param moveType
+ */
+const onDrop = async (event: DragEvent,
+                      treeId: any,
+                      treeNodes: any,
+                      targetNode: any,
+                      moveType: any) => {
+  const someNode: any = getSameLevel(window['treeObj'], treeNodes[0])
+  const newNode = someNode.map((item: any) => {
+    let index = item.getIndex()
+    item.treeIndex = index
+    return {
+      ...item,
+      treeIndex: item.getIndex() + 1
+    }
+  })
+  const list = newNode.map((item: any) => {
+    return {
+      id: item.id,
+      treeIndex: item.treeIndex,
+      parentId: item.parentId || ''
+    }
+  })
+  const res = await TsApi.updateTreeIndex(list)
+  if (res.code == 0 || res.code == 200) {
+    ElMessage({
+      message: '操作成功',
+      type: 'success'
+    })
+  } else {
+    ElMessage({
+      message: '操作失败',
+      type: 'error'
+    })
+  }
+}
 const onClick = (event: MouseEvent, treeId: string, treeNode: any) => {
   console.log('selectNode', treeNode)
 
@@ -422,7 +467,8 @@ const setting = {
     onRightClick: rightClick,
     onClick: onClick,
     onCheck: onCheck,
-    onDblClick: onDblClick
+    onDblClick: onDblClick,
+    onDrop: onDrop,
     /*
     onClick: this.onClick,
     onDblClick: this.onDblClick,

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)"><!--{{
-              event.name + event.duration_time
-            }}-->
+          <div class="bar oneLine" :style="progressStyle(event)" @dblclick="clickEventBar(event)"
+               :title="event.name + event.duration_time ">
+            {{ event.name }}
           </div>
         </div>
       </template>

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

@@ -56,6 +56,7 @@ let ticLabel = (val) => {
 <style scoped>
 /* 样式不变 */
 .timeScale {
+  width: 100%;
   height: 30px;
   position: relative;
   flex-shrink: 0;

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

@@ -145,6 +145,9 @@ window['updateProp'] = (key: string, val: any) => {
   console.log("window['updateProp']", key, val)
   if (propsMap[key])
     propsMap[key].value = val
+  if (key == 'currentStamp') {
+    eventBus.emit("changeStamp", val)
+  }
 }
 
 

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

@@ -322,7 +322,12 @@ eventBus.on('add-event', (task) => {
 // 新建态势推演对象
 let newTS = (params, events) => {
 
-  window['tsObj'] = new TS({name: params.name, tasks: events, startTimestamp: params.start_time})
+  window['tsObj'] = new TS({
+    name: params.name,
+    tasks: events,
+    startTimestamp: params.start_time,
+    wheel: params.wheel || 20
+  })
   tsOBJ.value = window['tsObj']
   window['tsAction'] = window['tsObj'].initAction()
 
@@ -331,18 +336,33 @@ let newTS = (params, events) => {
     // dom加载完成后，通过宽度和间隔来计算出刻度线的数量
     window['tsObj']._Store.init()
     window['tsObj'].renderLabel({left: 0})
+    stamp.value = getFormatedDate(window['tsObj']._Store._currentTimestamp)
   })
 }
 getEventList()
 
-
+let getFormatedDate = (stamp = null) => {
+  const date = stamp ? new Date(stamp) : new Date();
+  const formattedDate = date.toLocaleString('zh-CN', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    hour12: false // 禁用12小时制，使用24小时制
+  }).replace(/\//g, '-');
+  return formattedDate
+}
 onMounted(async () => {
   let baseURL = localStorage.getItem('service')
   // getAuthInfo()
   await YJ.on({host: baseURL})
   createEarth()
   window.addEventListener('click', handleClick)
+  window.addEventListener('resize', handleResize)
   // window.addEventListener('contextmenu', handleClick)
+
 })
 const createEarth = async () => {
   (window as any).earth_ts = await new YJ.YJEarth('earthContainer', {navigationHelpButton: false})
@@ -379,27 +399,25 @@ const createEarth = async () => {
   console.log("createEarth++++++++++++++++++++")
   cabin.value.initTreeCallBack()
 }
+/*
 const timer = setInterval(() => {
-  const date = new Date();
-// 配置年-月-日 时:分:秒 格式
-  const formattedDate = date.toLocaleString('zh-CN', {
-    year: 'numeric',
-    month: '2-digit',
-    day: '2-digit',
-    hour: '2-digit',
-    minute: '2-digit',
-    second: '2-digit',
-    hour12: false // 禁用12小时制，使用24小时制
-  }).replace(/\//g, '-');
-  stamp.value = formattedDate
+  stamp.value = getFormatedData()
 }, 1000)
+*/
 
+eventBus.on("changeStamp", val => {
+  stamp.value = getFormatedDate(val)
+})
 onUnmounted(() => {
-  clearInterval(timer)
+  // clearInterval(timer)
   window.removeEventListener('click', handleClick)
+  window.removeEventListener('resize', handleResize)
   // window.removeEventListener('contextmenu', handleClick)
 })
-
+//
+const handleResize = () => {
+  window['tsObj']._Store.init()
+}
 // 定义可复用的回调函数
 const handleClick = (e) => {
   // console.log('点击事件触发', e)

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

@@ -740,6 +740,7 @@ const confirm = () => {
   TsApi.updateTsSource(params2).then(res => {
     if (res.code == 200) {
       ElMessage({type: "success", message: "操作成功"})
+      // @ts-ignore
       cusUpdateNode({id: params.id, sourceName: params.name, detail: JSON.stringify(params)})
     }
   })

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

@@ -490,6 +490,7 @@ const confirm = () => {
   TsApi.updateTsSource(params2).then(res => {
     if (res.code == 200) {
       ElMessage({type: "success", message: "操作成功"})
+      // @ts-ignore
       cusUpdateNode({id: params.id, sourceName: params.name, detail: JSON.stringify(params)})
     }
   })

src/renderer/src/views/TS/entity.ts

@@ -192,7 +192,10 @@ export function addMapSource(type, pId, option, cb: any = null) {
     cb && cb(res)
     //   上树
     let selectedNode = window.treeObj.getNodeByParam('id', pId)
-    cusAddNodes(window.treeObj, selectedNode, [dbOption], true)
+    cusAddNodes(window.treeObj, selectedNode, [dbOption], true).then((addNodes) => {
+      console.log("addNodes", addNodes)
+      addNodes.length && window['treeObj'].selectNode(addNodes[0])
+    })
   })
 }
 

src/renderer/src/views/TS/list.vue

@@ -60,9 +60,10 @@
       <div class="tableBox">
         <el-table
           :data="tableData"
-
+          height="100%"
           style="width: 100%"
         >
+          <el-table-column type="selection" width="55"/>
           <el-table-column align="center" prop="name" :label="t('ts.deduceName')"/>
           <el-table-column align="center" :label="t('ts.deduceDesc')" :class-name="'ellipsis-column'">
             <template #default="scope">
@@ -164,6 +165,7 @@ import zhTw from 'element-plus/es/locale/lang/zh-tw'
 import en from 'element-plus/es/locale/lang/en'
 
 const language = ref('zh-CN')
+// @ts-ignore
 language.value = JSON.parse(localStorage.getItem("systemSetting"))?.language || 'zh-CN'
 const locale = computed(() => (language.value === "zh-CN" ? zhCn : (language.value === "zh-TW" ? zhTw : en)))
 
@@ -228,6 +230,10 @@ const getList = (params: any = null) => {
   TsApi.planList(formData).then(res => {
     console.log(res)
     if (res.code == 200) {
+      /* let arr = []
+       for (let i = 0; i < 50; i++) {
+         arr.push(res.data.records[0])
+       }*/
       tableData.value = res.data.records
       total.value = res.data.total
     }
@@ -438,6 +444,11 @@ onUnmounted(() => {
     height: 26px;
     right: 8px;
     top: 8px;
+    fill: #fff;
+
+    &:hover {
+      fill: #0ff;
+    }
   }
 
   .list-container {
@@ -494,7 +505,8 @@ onUnmounted(() => {
     }
 
     .tableBox {
-      flex: auto;
+      height: calc(72vh - 159px);
+      overflow-y: auto;
     }
 
     .pageBox {

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

@@ -31,7 +31,7 @@ export class Store {
   _currentTimestamp
   _tasks
   _multiplier
-  private _panelWidth //面板宽度
+  _panelWidth //面板宽度
 
   constructor(option) {
     this._multiplier = option.multiplier || 1
@@ -53,9 +53,9 @@ export class Store {
       let panel = dom.getBoundingClientRect();// 安全调用
       // console.log(dom.getBoundingClientRect())
       this._panelWidth = Math.floor(panel.width);
-      dom['style'].width = this._panelWidth + "px"
+      // dom['style'].width = this._panelWidth + "px"
       this.setScale("ticTiny", this.ceil(this._panelWidth / this.getScale("distanceOfTicTiny")))
-      this.setScale("ticMain", this.ceil(this._panelWidth / this.getScale("distanceOfTicMain")) + 1)
+      this.setScale("ticMain", this.ceil(this._panelWidth / this.getScale("distanceOfTicMain")) + 2)
 
 
       // this.getMinTimeOfPanel()
@@ -129,10 +129,10 @@ export class Store {
   // 通过时间戳来设置位置
   setCursorLeft(stamp) {
     let newLeft = ((stamp - this._startTimestamp) / 1000) * this._scales.preSecondPx - this._scales.scrollLeft
-    console.log("stamp", stamp)
-    console.log("this._startTimestamp", this._startTimestamp)
-    console.log("this._scales.preSecondPx", this._scales.preSecondPx)
-    console.log("newLeft", newLeft)
+    // console.log("stamp", stamp)
+    // console.log("this._startTimestamp", this._startTimestamp)
+    // console.log("this._scales.preSecondPx", this._scales.preSecondPx)
+    // console.log("newLeft", newLeft)
 
     this.setScale('cursorLeft', newLeft)
   }
@@ -177,4 +177,9 @@ export class Store {
     window['updateProp']("currentStamp", val)
   }
 
+  set panelWidth(val) {
+    console.log("新的面板宽度", val)
+    this._panelWidth = val
+    this.init()
+  }
 }

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

@@ -14,7 +14,6 @@ export class TS extends Tools {
     this._Clock = new Clock()
     this.name = option.name
     this._Store._scales.fullHeight = this._Store._tasks.length * this._Store._scales.cellHeight
-
   }
 
   tuningLine() {
@@ -38,6 +37,15 @@ export class TS extends Tools {
     this._Store.setScale('timeLabels', allTimeLabels)
   }
 
+  setWheel(value) {
+    let num = Math.ceil(value / 3)
+    // 小格宽度的选值，【3,5,8】
+    let index = value % 3
+    this._Store.setScale('preMainIndex', num - 1)
+    this._Store.setScale('distanceOfTicTiny', this._Store.getScale("distanceOfTicTinyRange")[index])
+    this._Store.setScale('preSecondPx', this._Store.getScale("distanceOfTicMain") / this._Store.getScale("preMains")[this._Store.getScale("preMainIndex")])
+  }
+
   initAction() {
     return (l) => {
       console.log("action的参数", l)
@@ -47,13 +55,7 @@ export class TS extends Tools {
         case "wheel-timeLine":
           const value = l.num
           // 第几个大格，小标-=1
-          let num = Math.ceil(value / 3)
-          // 小格宽度的选值，【3,5,8】
-          let index = value % 3
-          this._Store.setScale('preMainIndex', num - 1)
-          this._Store.setScale('distanceOfTicTiny', this._Store.getScale("distanceOfTicTinyRange")[index])
-          this._Store.setScale('preSecondPx', this._Store.getScale("distanceOfTicMain") / this._Store.getScale("preMains")[this._Store.getScale("preMainIndex")])
-
+          this.setWheel(value)
           break;
         case "scroll-chart":
           this._Store._scales.scrollTop = obj.top

src/renderer/src/views/components/propertyBox/addDevice.vue

@@ -10,7 +10,7 @@
     <template #content>
       <el-form label-width="100px" :model="addForm" :rules="peopleRules" ref="peopleFormRef">
         <el-form-item label="名称" prop="cameraName">
-          <el-input v-model.trim="addForm.cameraName" clearable placeholder="请输入设备名称" />
+          <el-input v-model.trim="addForm.cameraName" clearable placeholder="请输入设备名称"/>
         </el-form-item>
         <el-form-item label="设备IP" prop="ip">
           <el-input v-model.trim="addForm.ip" clearable placeholder="请输入设备IP地址"></el-input>
@@ -26,8 +26,8 @@
         </el-form-item>
         <el-form-item label="设备类型" prop="type">
           <el-select v-model.trim="addForm.type" placeholder="请选择设备类型">
-            <el-option label="海康" value="海康"> </el-option>
-            <el-option label="大华" value="大华"> </el-option>
+            <el-option label="海康" value="海康"></el-option>
+            <el-option label="大华" value="大华"></el-option>
             <!-- <el-option label="手动录入" value="3"> </el-option> -->
           </el-select>
         </el-form-item>
@@ -44,23 +44,23 @@
       </el-form>
     </template>
     <template #footer>
-      <el-button type="primary" @click="submitProtal"> 确定 </el-button>
+      <el-button type="primary" @click="submitProtal"> 确定</el-button>
       <el-button @click="cancel">取消</el-button>
     </template>
   </Dialog>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { inject } from 'vue'
-import { TreeApi } from '@/api/tree'
+import {ref} from 'vue'
+import {inject} from 'vue'
+import {TreeApi} from '@/api/tree'
 import Dialog from '@/components/dialog/baseDialog.vue'
-import { initMapData } from '../../../common/initMapData'
-import { useTreeNode } from '../tree/hooks/treeNode'
-import { deviceApi } from '@/api/deviceManage/index'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import {initMapData} from '../../../common/initMapData'
+import {useTreeNode} from '../tree/hooks/treeNode'
+import {deviceApi} from '@/api/deviceManage/index'
+import {ElMessage, ElMessageBox} from 'element-plus'
 
-const { cusAddNodes } = useTreeNode()
+const {cusAddNodes} = useTreeNode()
 
 const baseDialog: any = ref(null)
 const eventBus: any = inject('bus')
@@ -79,10 +79,10 @@ var addForm: any = ref({
 })
 
 const peopleRules: any = reactive({
-  cameraName: [{ required: true, message: '请输入名称', trigger: 'blur' }],
-  ip: [{ required: true, message: '请输入ip', trigger: 'blur' }],
+  cameraName: [{required: true, message: '请输入名称', trigger: 'blur'}],
+  ip: [{required: true, message: '请输入ip', trigger: 'blur'}],
   port: [
-    { required: true, message: '请输入设备端口号', trigger: 'blur' },
+    {required: true, message: '请输入设备端口号', trigger: 'blur'},
     {
       validator: (rule, value, callback) => {
         if (!value) {
@@ -111,10 +111,10 @@ const peopleRules: any = reactive({
       trigger: 'blur'
     }
   ],
-  username: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
-  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
-  type: [{ required: true, message: '请选择设备类型', trigger: 'blur' }],
-  channel: [{ required: true, message: '请输入通道号', trigger: 'blur' }]
+  username: [{required: true, message: '请输入用户名', trigger: 'blur'}],
+  password: [{required: true, message: '请输入密码', trigger: 'blur'}],
+  type: [{required: true, message: '请选择设备类型', trigger: 'blur'}],
+  channel: [{required: true, message: '请输入通道号', trigger: 'blur'}]
 })
 
 var cancel = () => {
@@ -221,10 +221,12 @@ defineExpose({
 ::v-deep .el-form-item--label-right .el-form-item__label {
   color: #fff !important;
 }
+
 ::v-deep .el-form-item .el-input__wrapper {
   background-color: rgba(0, 0, 0, 0.5) !important;
   box-shadow: 0 0 0 0.5px rgba(var(--color-base1), 1) inset !important; /* 新增此行 */
 }
+
 ::v-deep .el-form-item .el-select__wrapper {
   background-color: rgba(0, 0, 0, 0.5) !important;
   box-shadow: 0 0 0 0.5px rgba(var(--color-base1), 1) inset !important; /* 新增此行 */
@@ -233,15 +235,19 @@ defineExpose({
     border: unset !important;
   }
 }
+
 ::v-deep .el-form-item .el-input__inner {
   color: #fff !important;
 }
+
 ::v-deep .el-form-item .el-select__placeholder {
   color: #fff !important;
 }
+
 ::v-deep .el-input__wrapper {
   padding: 0px !important;
 }
+
 ::v-deep .el-button:hover {
   background-color: rgba(var(--color-base1), 0.2) !important;
   color: rgba(var(--color-base1), 1) !important;

src/renderer/src/views/components/tree/hooks/tree.ts

@@ -322,7 +322,7 @@ export const useTree = () => {
           })
         }
       } else {
-        if(node.sourceType === 'tileset') {
+        if (node.sourceType === 'tileset') {
           if (node.children && node.children.length > 0) {
             node.children.forEach((item) => {
               sourceStatus(item)
@@ -704,6 +704,7 @@ export const useTree = () => {
       layers.sort((obj1, obj2) => {
         return obj1.params.layerIndex - obj2.params.layerIndex;
       });
+      console.log("layers", layers)
       for (let i = 0; i < layers.length; i++) {
         initMapData(layers[i].sourceType, layers[i].params, null)
       }