zhouyulong/electron-4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

态势模块添加gis模型，事件列表获取

Browse Source
This commit is contained in:
zyl
2025-11-05 16:27:06 +08:00
parent 4a441f3e04
commit 59bad224b8
9 changed files with 196 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/renderer/src/api/ts/index.ts
View File

@ -26,10 +26,24 @@ export const TsApi = {
data
})
},
///tsSource/addModelSource
addTsModelSource: async (data: any) => {
return await request.post({
url: '/tsSource/addTsModelSource',
data
})
},
queryTsSource: async (data: any) => {
return await request.post({
url: '/tsSource/query',
data
})
},
// /tsEvent/query
queryTsEvent: async (data: any) => {
return await request.get({
url: "/tsEvent/query",
params: data
})
}
}

6
src/renderer/src/views/TS/components/grid.vue
View File

@ -20,12 +20,14 @@
<script lang="ts" setup>
import {computed, onMounted, ref} from "vue"
const props = defineProps(['eventList',])
let columns = ref([{name: '事件名称', key: "name", style: "flex:auto"},
{name: '开始时间', key: "start_time", style: "width:120px"},
{name: '持续时间', key: "duration_time", style: "width:70px"}])
let eventList = ref([])
// let eventList = ref([])
let style = ref({})
eventList.value = window['tsObj']._Store._tasks
// eventList.value = window['tsObj']._Store._tasks
// 格式化时间
let format = (key, val) => {
if ('start_time' == key) {

8
src/renderer/src/views/TS/components/rightMenuTs.vue
View File

@ -31,6 +31,7 @@ import {useI18n} from 'vue-i18n'
import {ref} from 'vue'
import {useRightOperate} from "./rightOperate";
import {useRightMenu} from "../../components/tree/components/hooks/rightMenu";
import {$changeComponentShow} from "../../../utils/communication";
const {t} = useI18n()
const {rightMenus} = useRightOperate()
@ -40,6 +41,8 @@ const {itemClick} = useRightMenu()
const eventBus: any = inject('bus')
const itemClicks = (item) => {
itemClick(item, eventBus)
$changeComponentShow('.rightMenuTs', false)
}
const initMenus = (arr: any, treeNode: any) => {
let rightMenu: any = []
@ -70,8 +73,11 @@ defineExpose({
user-select: none;
width: 8.5vw;
height: 23vh;
border: 1px solid red;
//border: 1px solid red;
visibility: hidden;
background-color: rgba(0, 0, 0, 0.5);
border: 1.5px solid;
border-image: linear-gradient(137.95deg, rgba(var(--color-base1), 1) 6.25%, var(--color-border1) 100%) 1.5;
.menuItem {
//padding: 1vh .5vw;

130
src/renderer/src/views/TS/components/rightOperate.ts
View File

@ -1,5 +1,31 @@
import {$changeComponentPop} from "../../../utils/communication";
import {ipcRenderer} from "electron";
import {addMapSource, initMapData} from "../entity";
import {TsApi} from "../../../api/ts";
import {ElMessage} from "element-plus";
import {useTreeNode} from "../../components/tree/hooks/treeNode";
const {cusAddNodes} = useTreeNode()
function getLastPathComponent(path, extensionsToRemove = []) {
// 处理路径分隔符
const normalizedPath = path.replace(/\\/g, '/');
const lastComponent = normalizedPath.split('/').pop();
// 如果没有提供需要移除的后缀列表，直接返回原始名称
if (extensionsToRemove.length === 0) return lastComponent;
// 检查是否匹配任何需要移除的后缀
for (const ext of extensionsToRemove) {
//@ts-ignore
const extWithDot = ext.startsWith('.') ? ext : `.${ext}`;
if (lastComponent.endsWith(extWithDot)) {
return lastComponent.slice(0, -extWithDot.length);
}
}
return lastComponent;
}
export const useRightOperate = () => {
const addDirectory = () => {
@ -8,6 +34,110 @@ export const useRightOperate = () => {
}
const addResource = () => {
console.log("addResource")
const {ipcRenderer} = require('electron')
const options = {
properties: ['openFile'], // 允许选择多个文件
filters: [
{name: '模型、影像、地形', extensions: ['clt', 'mbtiles', 'pak', /*'json', 'jct'*/]},
// {name: '矢量数据', extensions: ['kmz', 'kml', 'shp', 'tab', 'mif', 'geojson']},
]
};
let selectedNodes = window.treeObj.getSelectedNodes()
let node = selectedNodes && selectedNodes[selectedNodes.length - 1]
let parentId
if (node) {
if (node.sourceType === 'directory') {
parentId = node.id
} else {
parentId = node.parentId
}
}
ipcRenderer.send('open-directory-dialog', options);
// @ts-ignore
ipcRenderer.once('selectedItem', async (event, filePaths) => {
console.log(filePaths)
if (filePaths.length) {
let id = new YJ.Tools().randomString()
// 检查文件名是否有效
if (typeof filePaths[0] !== 'string' || filePaths[0].trim() === '') {
return false;
}
let item = filePaths[0]
// @ts-ignore
let name = getLastPathComponent(item, ['clt', 'json', 'pak', 'kml', 'kmz', 'shp', 'geojson', 'geoJson', 'czml', 'jct', 'mif', 'tab', 'csv']);
let sourceType = "layer";
if (item.endsWith(".clt") || item.endsWith(".json")) {
sourceType = "tileset";
} else if (item.endsWith(".pak")) {
sourceType = "Terrain";
} else if (item.endsWith(".kml") || item.endsWith(".kmz")) {
sourceType = "kml";
} else if (item.endsWith(".shp")) {
sourceType = "shp";
} else if (item.endsWith(".geojson") || item.endsWith(".geoJson")) {
sourceType = "geojson";
} else if (item.endsWith(".czml")) {
sourceType = "czml";
} else if (item.endsWith(".jct")) {
sourceType = "bim";
} else if (item.endsWith(".mif")) {
sourceType = "shp";
} else if (item.endsWith(".tab")) {
sourceType = "shp";
} else if (item.endsWith(".csv")) {
sourceType = "csv";
}
// 获取最后一个点的位置
const lastDotIndex = filePaths[0].lastIndexOf('.');
// 如果没有点或者点是最后一个字符，则不是有效的文件后缀
if (lastDotIndex === -1 || lastDotIndex === filePaths[0].length - 1) {
return false;
}
let params2: any = {
id: id,
show: true,
}
if (item.endsWith(".mbtiles")) {
params2.alpha = 1
params2.brightness = 1
params2.layerIndex = 99999
}
let params: any = {
id: id,
sourcePath: filePaths[0],
parentId: parentId,
params: params2,
planId: window['planId']
}
// addMapSource(sourceType, parentId, params)
// 先调接口再渲染并上树
let res = await TsApi.addTsModelSource(params)
console.log('res', res)
if (res.code === 0 || res.code === 200) {
ElMessage({
message: '添加成功',
type: 'success'
})
res.data.params = JSON.parse(res.data.params)
if (!res.data.params.name) {
res.data.params.name = res.data.sourceName
}
if (!res.data.params.id) {
res.data.params.id = res.data.id
}
let detail = JSON.parse(res.data.detail)
let mapParams = {...detail, ...res.data.params}
initMapData(sourceType, mapParams, entity => {
entity.flyTo()
let selectedNode = window.treeObj.getNodeByParam('id', parentId)
//
cusAddNodes(window.treeObj, selectedNode, [res.data], true)
})
}
}
})
}
const addEvent = (eventBus) => {
eventBus.emit('openAddEvent', true)

2
src/renderer/src/views/TS/deduction.vue
View File

@ -25,7 +25,7 @@
<div class="layoutBoxs">
<div class="layout">
<!-- 左侧事件列表 -->
<grid></grid>
<grid :eventList="TSOBJ._Store._tasks"></grid>
<!--右侧时间轴容器-->
<div class="TLContainer">
<div class="timelineCursorBox" :style="{ left: `${cursorLeft || 0}px` }">

11
src/renderer/src/views/TS/edit.vue
View File

@ -22,9 +22,10 @@ import Deduction from "./deduction.vue";
import AddDirectory from './components/tsdirectory.vue'
import {TS} from "./sdk";
import * as domain from "domain";
import {TsApi} from "../../api/ts";
let cabin = ref()
let tsOBJ = reactive({})
let tsOBJ = ref({})
const router = useRouter()
const route = useRoute()
let params = {}
@ -52,13 +53,19 @@ let getEventList = () => {
duration_time: (i * 5 + 10)
})
}
let formData = {planId: window['planId']}
TsApi.queryTsEvent(formData).then(res => {
if (res.code == 200) {
tsOBJ.value._Store._tasks = res.data
}
})
newTS(params, events)
}
// 新建态势推演对象
let newTS = (params, events) => {
window['tsObj'] = new TS({name: params.name, tasks: events, startTimestamp: params.start_time})
tsOBJ = window['tsObj']
tsOBJ.value = window['tsObj']
window['tsAction'] = window['tsObj'].initAction()
console.log("window['tsObj']", window['tsObj'])

14
src/renderer/src/views/TS/entity.ts
View File

@ -3,7 +3,9 @@ import {useTreeNode} from '@/views/components/tree/hooks/treeNode'
const {cusAddNodes, getSelectedNode} = useTreeNode()
export function initMapData(type, data) {
export function initMapData(type, data, cb: any = null) {
console.log("initMapData", type, data)
let baseURL = localStorage.getItem('ip')
let options
let entityObject
switch (type) {
@ -27,6 +29,14 @@ export function initMapData(type, data) {
break
case 'pincerArrow':
entityObject = new YJ.Obj.PincerArrowObject(window['earth_ts'], data)
break
case 'tileset':
data.host = baseURL
entityObject = new YJ.Obj.Tileset(window['earth_ts'], data)
entityObject.load((res) => {
cb && cb(entityObject)
})
break
}
if (entityObject) {
@ -48,7 +58,7 @@ export function initMapData(type, data) {
export function addMapSource(type, pId, option, cb: any = null) {
console.log("添加到地球上", option)
let options
let baseURL = localStorage.getItem('ip')
/*switch (type) {
case 'point':
data = {id, name, position: option.position}

25
src/renderer/src/views/TS/newEvent.vue
View File

@ -34,7 +34,7 @@
<el-date-picker
v-model="form.datetime"
type="datetime"
placeholder="Select date and time"
placeholder="选择触发时间"
/>
</el-form-item>
<el-form-item label="持续时间">
@ -78,7 +78,7 @@
<el-form-item>
<div class="optionbtn">
<el-button>确定</el-button>
<el-button @click="addEvent">确定</el-button>
<el-button>取消</el-button>
</div>
</el-form-item>
@ -98,7 +98,7 @@ import type {RenderContentContext, TreeInstance} from 'element-plus'
const treeRef = ref<TreeInstance>()
// 存储当前需要高亮的节点 key（初始为空）
const currentKey = ref<number | null>(1);
const currentKey = ref<number | string | null>("flicker");
interface Tree {
label: string
@ -107,6 +107,7 @@ interface Tree {
const form = reactive({
name: '',
datetime: '',
})
const hour = ref(0)
const minute = ref(0)
@ -116,7 +117,7 @@ const numbers = ref(0)//闪烁次数
const isContainModelPosition = ref(true)
const eventBus: any = inject('bus')
form['datetime'] = new Date(2000, 1, 1, 12, 0, 0)
// form['datetime'] = new Date(2000, 1, 1, 12, 0, 0)
const isShowPup = ref(false)
const eventTree: { children: ({ label: string } | { label: string })[]; id: string; label: string }[] = [
{
@ -143,6 +144,9 @@ const handleNodeClick = (data: Tree, node, TreeNode, event) => {
currentKey.value = data.id; // data.id 为节点的唯一 key（需与 tree 的 node-key 对应）
form.name = data.label
}
const addEvent = () => {
console.log(form)
}
eventBus.on('openAddEvent', (data, cb, type) => {
// selectCallback = cb
// addType.value = type
@ -155,6 +159,10 @@ eventBus.on('openAddEvent', (data, cb, type) => {
</script>
<style lang="scss" scoped>
:deep(.newEvent>div) {
position: absolute;
}
.newEvent {
position: absolute;
z-index: 99;
@ -234,13 +242,18 @@ eventBus.on('openAddEvent', (data, cb, type) => {
}
}
:deep(.el-overlay-dialog) {
/*position: absolute;
bottom: auto;
right: auto;*/
}
:deep(.el-dialog) {
background: linear-gradient(180deg, rgba(0, 255, 255, 0.2) 0%, rgba(0, 255, 255, 0) 100%),
rgba(0, 0, 0, 0.6);
border: 1px solid #00c9ff;
padding: 0 !important;
width: 30vw;
height: 30vh;
//position: absolute;
width: 570px;
height: 323px;