libingkun/skyeyesystem
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

修改执行中任务的面板交互逻辑

Browse Source
This commit is contained in:
wxs 2026-02-02 17:48:54 +08:00
parent 0158cabf7b
commit ca8852c311
6 changed files with 119 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/Skyeye-sys-ui/src/views/home/components/twin-situation/index.js
View File

@ -475,6 +475,12 @@ export default {
historyPictureList = [] historyPictureList = []
} }
} }
},
'detailUav.visible': {
handler: function (nv) {
this.$emit('sar-change', nv)
},
immediate: true,
} }
}, },
created() { created() {
@ -1110,8 +1116,8 @@ export default {
// 测试 // 测试
// this.addUavToScene(item) // this.addUavToScene(item)
}) })
this.detailUav.id = data[0].id this.detailUav.id = data.length ? data[0].id : 1
this.detailUav.visible = true this.detailUav.visible = data.length ? true : false
taskListResource = data taskListResource = data
this.taskList.data = list this.taskList.data = list
if (this.taskList.data.length) { if (this.taskList.data.length) {
@ -1557,7 +1563,7 @@ export default {
}).then(res => { }).then(res => {
stopTaskFly({ id: info.id }).then(res => { stopTaskFly({ id: info.id }).then(res => {
if (res.data.code === 200) { if (res.data.code === 200) {
info.status = 2 // info.status = 2
this.getTaskList() this.getTaskList()
this.$message.success('任务已结束！') this.$message.success('任务已结束！')
this.removeTaskTarget(info.id) this.removeTaskTarget(info.id)
@ -2738,7 +2744,6 @@ export default {
console.log('SAR波形', JSON.parse(info.body)) console.log('SAR波形', JSON.parse(info.body))
let data = JSON.parse(info.body) let data = JSON.parse(info.body)
console.log('id对比', this.detailUav.id, data.payloadId); console.log('id对比', this.detailUav.id, data.payloadId);
// && this.detailUav.id === data.payloadId
if (this.detailUav.visible && this.detailUav.id === data.jobId) { if (this.detailUav.visible && this.detailUav.id === data.jobId) {
let channel1False = [] let channel1False = []
let channel1Real = [] let channel1Real = []

16
frontend/Skyeye-sys-ui/src/views/home/components/twin-situation/index.scss
View File

@ -405,6 +405,14 @@
height: calc(100vh - 620px); height: calc(100vh - 620px);
} }
.detail-uav-wrap {
width: 430px;
position: fixed;
bottom: 5px;
right: 10px;
height: calc(100vh - 60px);
}
.detail-info { .detail-info {
width: 460px; width: 460px;
//position: fixed; //position: fixed;
@ -1174,8 +1182,8 @@
.detail-uav { .detail-uav {
width: 460px; width: 410px;
position: fixed; // position: fixed;
top: 60px; top: 60px;
//bottom: 5px; //bottom: 5px;
right: 10px; right: 10px;
@ -1185,6 +1193,10 @@
transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
z-index: 2; z-index: 2;
::v-deep .dt-card__header {
display: none;
}
.detail-uav__content { .detail-uav__content {
padding-right: 8px; padding-right: 8px;
box-sizing: border-box; box-sizing: border-box;

149
frontend/Skyeye-sys-ui/src/views/home/components/twin-situation/index.vue
View File

@ -77,10 +77,7 @@
> >
<div class="left-part"> <div class="left-part">
<!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>--> <!-- <div class="task-progress-bar" :style="'width: ' + item.uavCompletion +'%;'"></div>-->
<div <div class="execute-info">
class="execute-info"
@click.stop="openTaskLineDetail(item)"
>
<span <span
class="execute-type-icon" class="execute-type-icon"
:class="'execute-state-' + item.status" :class="'execute-state-' + item.status"
@ -344,74 +341,75 @@
</right-slide> </right-slide>
<!-- 详情 --> <!-- 详情 -->
<dt-card <right-slide class="detail-uav-wrap" v-if="detailUav.visible">
:class="{ <dt-card
'detail-uav': true, :class="{
'detail-uav__large': isIconModeLarge, 'detail-uav': true,
}" 'detail-uav__large': isIconModeLarge,
icon="iconfont icon-target" }"
title="详细信息" icon="iconfont icon-target"
v-if="detailUav.visible" title="详细信息"
:visible.sync="detailUav.visible" v-if="detailUav.visible"
:scroll="true" :visible.sync="detailUav.visible"
:showClose="true" :scroll="true"
:showDivider="false" :showClose="true"
> :showDivider="false"
<div class="detail-uav__content"> >
<div class="other-info"> <div class="detail-uav__content">
<el-collapse <div class="other-info">
v-model="detailUav.activeNames" <el-collapse
@change="handleUavDetailCollapse" v-model="detailUav.activeNames"
> @change="handleUavDetailCollapse"
<el-collapse-item title="状态信息" name="3"> >
<el-tabs v-model="detailUav.activeTab"> <el-collapse-item title="状态信息" name="3">
<el-tab-pane label="DEV" name="DEV"> <el-tabs v-model="detailUav.activeTab">
<div <el-tab-pane label="DEV" name="DEV">
class="uav-span-wrap" <div
v-for="item in detailUav.statusInfo.dev" class="uav-span-wrap"
:key="item.name" v-for="item in detailUav.statusInfo.dev"
> :key="item.name"
<span>{{ item.name }}：</span> >
<span>{{ item.value }}{{ item.unit }}</span> <span>{{ item.name }}：</span>
</div> <span>{{ item.value }}{{ item.unit }}</span>
</el-tab-pane> </div>
<el-tab-pane label="GPS" name="GPS"> </el-tab-pane>
<div <el-tab-pane label="GPS" name="GPS">
class="uav-span-wrap" <div
v-for="item in detailUav.statusInfo.gps" class="uav-span-wrap"
:key="item.name" v-for="item in detailUav.statusInfo.gps"
> :key="item.name"
<span>{{ item.name }}：</span> >
<span>{{ item.value }}{{ item.unit }}</span> <span>{{ item.name }}：</span>
</div> <span>{{ item.value }}{{ item.unit }}</span>
</el-tab-pane> </div>
<el-tab-pane label="IMU" name="IMU"> </el-tab-pane>
<div <el-tab-pane label="IMU" name="IMU">
class="uav-span-wrap" <div
v-for="item in detailUav.statusInfo.imu" class="uav-span-wrap"
:key="item.name" v-for="item in detailUav.statusInfo.imu"
> :key="item.name"
<span>{{ item.name }}：</span> >
<span>{{ item.value }}{{ item.unit }}</span> <span>{{ item.name }}：</span>
</div> <span>{{ item.value }}{{ item.unit }}</span>
</el-tab-pane> </div>
</el-tabs> </el-tab-pane>
</el-collapse-item> </el-tabs>
<el-collapse-item title="波形信息" name="4"> </el-collapse-item>
<div class="wave-chart"> <el-collapse-item title="波形信息" name="4">
<dt-multiple-analysis <div class="wave-chart">
ref="uavDetailChart" <dt-multiple-analysis
:data="detailUav.chart.data" ref="uavDetailChart"
:legend="detailUav.chart.legend" :data="detailUav.chart.data"
:tooltip="detailUav.chart.tooltip" :legend="detailUav.chart.legend"
:title="detailUav.chart.title" :tooltip="detailUav.chart.tooltip"
:grid="detailUav.chart.grid" :title="detailUav.chart.title"
:xAxis="detailUav.chart.xAxis" :grid="detailUav.chart.grid"
:yAxis="detailUav.chart.yAxis" :xAxis="detailUav.chart.xAxis"
></dt-multiple-analysis> :yAxis="detailUav.chart.yAxis"
</div> ></dt-multiple-analysis>
</el-collapse-item> </div>
<!-- <el-collapse-item title="回传图像" name="5"> </el-collapse-item>
<!-- <el-collapse-item title="回传图像" name="5">
<div class="back-image"> <div class="back-image">
<div <div
v-for="item in detailInfo.pictureList" v-for="item in detailInfo.pictureList"
@ -447,10 +445,11 @@
</div> </div>
</div> </div>
</el-collapse-item> --> </el-collapse-item> -->
</el-collapse> </el-collapse>
</div>
</div> </div>
</div> </dt-card>
</dt-card> </right-slide>
<dt-dialog <dt-dialog
:title="taskLineDetail.title" :title="taskLineDetail.title"

7
frontend/Skyeye-sys-ui/src/views/home/index.js
View File

@ -443,7 +443,8 @@ export default {
visible: false, visible: false,
data: [], data: [],
boatTypeLegend: [] boatTypeLegend: []
} },
moveInfoBar: false
} }
}, },
computed: { computed: {
@ -1522,7 +1523,9 @@ export default {
} }
}, },
//#endregion //#endregion
sarChange(val) {
this.moveInfoBar = val
},
//#region ais船 //#region ais船
getAisData() { getAisData() {

12
frontend/Skyeye-sys-ui/src/views/home/index.scss
View File

@ -66,6 +66,7 @@
width: 300px; width: 300px;
box-sizing: border-box; box-sizing: border-box;
padding: 5px 10px; padding: 5px 10px;
.message-title { .message-title {
height: 30px; height: 30px;
display: flex; display: flex;
@ -74,16 +75,19 @@
box-sizing: border-box; box-sizing: border-box;
border-bottom: 1px solid $--color-black-3; border-bottom: 1px solid $--color-black-3;
margin-bottom: 4px; margin-bottom: 4px;
>span { >span {
font-size: 14px; font-size: 14px;
color: $--color-text-1; color: $--color-text-1;
} }
>i { >i {
font-size: 16px; font-size: 16px;
color: $--color-text-1; color: $--color-text-1;
cursor: pointer; cursor: pointer;
} }
} }
.message-body { .message-body {
//height: 50px; //height: 50px;
@ -95,10 +99,12 @@
padding: 0 5px; padding: 0 5px;
position: relative; position: relative;
width: 100%; width: 100%;
.el-textarea { .el-textarea {
flex: 1; flex: 1;
margin: 0 10px; margin: 0 10px;
} }
>i { >i {
font-size: 14px; font-size: 14px;
color: $--color-text-1; color: $--color-text-1;
@ -106,12 +112,14 @@
margin-top: 10px; margin-top: 10px;
} }
} }
.message-send { .message-send {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-top: 10px; margin-top: 10px;
.el-button { .el-button {
margin: 0 10px; margin: 0 10px;
} }
@ -124,3 +132,7 @@
width: 100%; width: 100%;
} }
} }
.info-bar-show {
right: 430px;
}

6
frontend/Skyeye-sys-ui/src/views/home/index.vue
View File

@ -37,6 +37,7 @@
ref="twinSituation" ref="twinSituation"
v-if="menus.situation.active" v-if="menus.situation.active"
:visible.sync="menus.situation.active" :visible.sync="menus.situation.active"
@sar-change="sarChange"
></twin-situation> ></twin-situation>
<task-manage <task-manage
v-if="menus.taskManage.active" v-if="menus.taskManage.active"
@ -58,8 +59,11 @@
v-if="menus.userList.active" v-if="menus.userList.active"
:visible.sync="menus.userList.active" :visible.sync="menus.userList.active"
></user-list> ></user-list>
<info-bar v-if="menus.situation.active || menus.taskManage.active" />
<info-bar
:class="{ 'info-bar-show': moveInfoBar }"
v-if="menus.situation.active || menus.taskManage.active"
/>
<!-- 遮罩 --> <!-- 遮罩 -->
<!-- <dt-loading :visible="loadingCount > 0"></dt-loading> --> <!-- <dt-loading :visible="loadingCount > 0"></dt-loading> -->
</div> </div>