From c7c9de0214cb1e6ad3d29c8a3a0c7a8ea31fbaaa Mon Sep 17 00:00:00 2001
From: GuLiMmo <2820890765@qq.com>
Date: Tue, 05 Dec 2023 15:37:13 +0800
Subject: [PATCH] 航线点位事件编辑完善
---
src/pages/page-web/projects/wayline.vue | 47 +++++++++++++++++++----
src/components/waylinetool/index.vue | 24 +++++++++++-
2 files changed, 60 insertions(+), 11 deletions(-)
diff --git a/src/components/waylinetool/index.vue b/src/components/waylinetool/index.vue
index b9be2f4..df3854d 100644
--- a/src/components/waylinetool/index.vue
+++ b/src/components/waylinetool/index.vue
@@ -82,6 +82,7 @@
key: string,
icon: string,
title: string,
+ distinguish?: string,
param: popoverParamType[],
event: Function,
selected?: boolean
@@ -266,6 +267,7 @@
// 云台偏航角
{
key: 'gimbalRotate',
+ distinguish: 'yaw',
icon: getResource('waylinetool/holderyaw.png'),
title: '云台偏航角',
param: [
@@ -332,6 +334,7 @@
// 云台俯仰角
{
key: 'gimbalRotate',
+ distinguish: 'pitch',
icon: getResource('waylinetool/holdertilt.png'),
title: '云台俯仰角',
param: [
@@ -548,14 +551,20 @@
const funcRegx = /<wpml:actionActuatorFunc>([\s\S]*?)<\/wpml:actionActuatorFunc>/g
const funcs = (points[currentPosition.value] || '').match(funcRegx)
const funcNameRegx = /<wpml:actionActuatorFunc>(.*?)<\/wpml:actionActuatorFunc>/
-
const shootTypeRegx = /<wpml:shootType>([\s\S]*?)<\/wpml:shootType>/g
const shootType = (points[currentPosition.value] || '').match(shootTypeRegx)
const shootTypeValueRegx = /<wpml:shootType>(.*?)<\/wpml:shootType>/
+
+ // 云台正则
+ const actionRegx = /<wpml:action>([\s\S]*?)<\/wpml:action>/g
+ const actions = (points[currentPosition.value] || '').match(actionRegx)
+ const gimbalPitchRotateAngleRegx = /<wpml:gimbalPitchRotateAngle>(.*?)<\/wpml:gimbalPitchRotateAngle>/
+ const gimbalYawRotateAngleRegx = /<wpml:gimbalYawRotateAngle>(.*?)<\/wpml:gimbalYawRotateAngle>/
+
btnList.value.forEach(sBtn => {
funcs?.forEach((func: string) => {
const funcName = func.match(funcNameRegx) || []
- if (funcName[1] === sBtn.key) {
+ if (funcName[1] === sBtn.key && !sBtn.distinguish) {
sBtn.selected = true
}
})
@@ -565,6 +574,17 @@
sBtn.selected = true
}
})
+ if (sBtn.distinguish) {
+ const action = actions?.find((action: string) => action.includes('<wpml:actionActuatorFunc>gimbalRotate</wpml:actionActuatorFunc>'))
+ const pitchAngle = action?.match(gimbalPitchRotateAngleRegx) || []
+ const yawAngle = action?.match(gimbalYawRotateAngleRegx) || []
+ if (!!Number(pitchAngle[1]) && sBtn.distinguish === 'pitch') {
+ sBtn.selected = true
+ }
+ if (!!Number(yawAngle[1]) && sBtn.distinguish === 'yaw') {
+ sBtn.selected = true
+ }
+ }
})
settingDefaultValue(content)
})
diff --git a/src/pages/page-web/projects/wayline.vue b/src/pages/page-web/projects/wayline.vue
index 998bede..f6ce2e6 100644
--- a/src/pages/page-web/projects/wayline.vue
+++ b/src/pages/page-web/projects/wayline.vue
@@ -99,13 +99,10 @@
<ArrowLeftOutlined />
<span>返回上一页</span>
</div>
- <li
- v-for="(item, index) in tragetPointArr"
- :key="index"
- :class="{ selectedColor : index === selectedPoint }"
+ <li v-for="(item, index) in tragetPointArr" :key="index" :class="{ selectedColor: index === selectedPoint }"
@click="tragetPointClick(item.position, index)">
<div class="graph">
- <div class="left" :style="{borderTopColor: index === selectedPoint ? '#FF9900' : '#2D8CF0'}"></div>
+ <div class="left" :style="{ borderTopColor: index === selectedPoint ? '#FF9900' : '#2D8CF0' }"></div>
<div class="right">{{ index + 1 }}</div>
</div>
<div class="graph-right">
@@ -190,6 +187,7 @@
const eventList = reactive<{
key: string,
name: string,
+ distinguish?: string,
icon?: string
}[]>([
{
@@ -229,8 +227,15 @@
},
{
key: 'gimbalRotate',
- name: '旋转云台',
+ distinguish: 'Yaw',
+ name: '云台俯仰角',
icon: getResource('waylinetool/holderyaw.png'),
+ },
+ {
+ key: 'gimbalYawRotate',
+ name: '云台偏航角',
+ distinguish: 'pitch',
+ icon: getResource('waylinetool/holdertilt.png'),
},
{
key: 'rotateYaw',
@@ -564,6 +569,9 @@
const actionRegx = /<wpml:action>([\s\S]*?)<\/wpml:action>/g
// 获取shootType
const shootTypeRegx = /<wpml:shootType>([\s\S]*?)<\/wpml:shootType>/g
+ // 云台角度
+ const gimbalPitchRotateAngleRegx = /<wpml:gimbalPitchRotateAngle>(.*?)<\/wpml:gimbalPitchRotateAngle>/
+ const gimbalYawRotateAngleRegx = /<wpml:gimbalYawRotateAngle>(.*?)<\/wpml:gimbalYawRotateAngle>/
// 当前kmz文件航点
const kmlPoints = kml.match(regx)
kmlPoints?.forEach((point: string, index: number) => {
@@ -575,7 +583,18 @@
const actions = ponitAction[0].match(actionRegx)
actions?.forEach(action => {
eventList.forEach((item: any) => {
- action.includes(item.key) && eventArr.push(item)
+ if (!item.distinguish) {
+ action.includes(item.key) && eventArr.push(item)
+ } else {
+ const pitchAngle = action?.match(gimbalPitchRotateAngleRegx) || []
+ const yawAngle = action?.match(gimbalYawRotateAngleRegx) || []
+ if (!!Number(pitchAngle[1]) && item.distinguish === 'pitch') {
+ eventArr.push(item)
+ }
+ if (!!Number(yawAngle[1]) && item.distinguish === 'yaw') {
+ eventArr.push(item)
+ }
+ }
})
})
tragetPointArr.value[index].eventList = eventArr
@@ -637,26 +656,32 @@
padding: 0;
margin: 0;
list-style-type: none;
+
.back-btn {
cursor: pointer;
padding: 10px;
border-bottom: 1px solid #4f4f4f;
+
span {
margin-left: 10px;
}
+
&:hover {
color: #2d8cf0;
}
}
+
li {
cursor: pointer;
padding: 10px 0;
margin: 0 7px;
display: flex;
+
.graph {
width: 40px;
display: flex;
align-items: center;
+
.left {
width: 0;
height: 0;
@@ -664,27 +689,32 @@
border-right: 10px solid transparent;
border-left: 10px solid transparent;
}
+
.right {
margin-left: 3px;
}
}
+
.graph-right {
width: calc(100% - 40px);
height: 30px;
border-bottom: 1px solid #4f4f4f;
display: flex;
align-items: center;
+
.s-event-icon {
width: 25px;
height: 25px;
display: flex;
justify-content: center;
align-items: center;
+
img {
width: 70%;
}
}
}
+
&:hover {
background-color: #3C3C3C;
}
@@ -736,5 +766,4 @@
.selectedColor {
background-color: #3C3C3C;
-}
-</style>
+}</style>
--
Gitblit v1.9.3