Skip to content

M
mmc-stl-vue2
提交 fd265343 作者: 温凯
操作

feat:蛙跳飞行对接

上级 c996f127
正在显示 包含 410 行增加 和 2 行删除
iframe/src/App.vue
......@@ -24,6 +24,8 @@
@airwayListGet="dispatchEvent('airwayListGet', $event)"
@airwayGet="dispatchEvent('airwayGet', $event)"
@taskListGet="dispatchEvent('taskListGet', $event)"
@leapFrogFlighGet="dispatchEvent('leapFrogFlighGet', $event)"
@apronUavSkipEvent="dispatchEvent('apronUavSkipEvent', $event)"
@taskRecordPageGet="dispatchEvent('taskRecordPageGet', $event)"
@taskInfoUpdateTime="dispatchEvent('taskInfoUpdateTime', $event)"
@taskInfoRecordDel="dispatchEvent('taskInfoRecordDel', $event)"
......
src/components/MMCFlightControlCenter/components/hangar/components/controlPanel/components/controlLeft/components/airwayList/components/leapFrogFligh/components/leapFrogDialog/index.vue 0 → 100644
<template>
<el-dialog :visible.sync="localVisible" :close-on-click-modal="false" :modal-append-to-body="false"
:show-close="showClose" @close="handleClose" :width="width">
<div slot="title" class="dialog-header">
<div >
<img src="../../../../../../assets/images/mount_head.png" />
<span class="title vas">{{ title }}</span>
</div>
</div>
<div class="stl-timed-task">
<div class="timed-task-header">
<div class="header__column flex2">序号</div>
<div class="header__column flex2">机库名称</div>
<div class="header__column status">状态</div>
<div class="header__column flex2">距离(km)</div>
</div>
<div class="timed-task-main" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.8)">
<div class="row" :class="{ single: i % 2 != 0 }" v-for="(item, i) in taskListAll" :key="item.id">
<div class="row__column flex2">
<span class="f12">
<span class="mr10">
<el-checkbox v-model="item.active" :label="item.id"
:disabled="item.type === '忙碌'"></el-checkbox>
</span>{{ i + 1 }}
</span>
</div>
<div class="row__column flex2">
<el-tooltip class="item" effect="dark" :content="item.name" placement="top-start">
<span class="f12">{{ item.name }}</span>
</el-tooltip>
</div>
<div class="row__column flex2">
<el-tooltip class="item" effect="dark" :content="item.type" placement="top-start">
<span class="f12"
:class="{ 'text-red': item.type === '忙碌', 'text-green': item.type == '空闲' }">{{
item.type
}}</span>
</el-tooltip>
</div>
<div class="row__column status" style="color: rgb(255, 189, 54)">
<el-tooltip class="item" effect="dark" :content="String(item.distance)" placement="top-start">
<span class="f12">{{ item.distance }}</span>
</el-tooltip>
</div>
</div>
</div>
<div class="task-add-btn">
<div class="task-add__btn">生成航线</div>
<div class="task-add__btn">一键任务</div>
</div>
</div>
</el-dialog>
</template>
<script>
export default {
name: 'leapFrogDialog',
props: {
title: {
type: String,
default: ''
},
showClose: {
type: Boolean,
default: true
},
visible: {
type: Boolean,
default: false
},
width: {
type: String,
default: '30%'
}
},
data() {
return {
loading: false,
taskListAll: [{
active: true,
name: "机库1",
type: "空闲",
distance: 10
},
{
active: true,
name: "机库2",
type: "忙碌",
distance: 12
}],
localVisible: this.visible // 根据 prop 初始化本地状态
};
},
watch: {
visible(newVal) {
this.localVisible = newVal; // 监听 prop 的变化
}
},
methods: {
handleClose() {
this.localVisible = false;
this.$emit('update:visible', false); // 通知父组件
},
confirm() {
this.$emit('confirm');
this.handleClose();
}
}
}
</script>
<style scoped lang="scss">
::v-deep {
.el-dialog__header {
padding: 5px;
}
.el-dialog__headerbtn {
top: 12px;
}
.el-dialog__footer {
text-align: center;
}
}
.dialog-header {
.title {
font-size: 20px;
font-family: YouSheBiaoTiHei;
color: #14faff;
line-height: 26px;
text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);
background: linear-gradient(135deg, #e3aa77 0%, #f5cda9 38%, #f9ecd3 58%, #fcdbb1 79%, #edb07a 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
.dialog-footer {
.btn {
color: #fff;
background-color: #222222;
}
}
.stl-timed-task {
height: 230px;
display: flex;
flex-direction: column;
padding: 16px 4px;
gap: 0px;
box-sizing: border-box;
position: relative;
&::before {
position: absolute;
content: "";
width: calc(100% - 5px);
height: calc(100% - 24px);
border-radius: 4px;
border: 1px solid #4b4b4b;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.timed-task-header {
display: flex;
flex-shrink: 0;
font-size: 14px;
height: 42px;
background: #343434;
font-family: YouSheBiaoTiHei;
font-size: 16px;
color: #ebf9ff;
.header__column {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
&.flex2 {
flex: 2;
}
&.status {
flex: initial;
width: 70px;
}
}
}
.timed-task-main {
color: #fff;
overflow-y: auto;
flex: 1;
z-index: 1;
.row {
display: flex;
color: #fff;
min-height: 52px;
background-color: #222222;
align-items: center;
gap: 3px;
&.single {
background-color: #343434;
}
.row__column {
font-size: 14px;
flex: 1;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.text-red {
color: red
}
.text-green {
color: green;
}
&.col-2 {
text-overflow: initial;
font-size: 14px;
}
&.flex2 {
flex: 2;
}
&.ctrl {
display: flex;
justify-content: center;
align-items: center;
gap: 5px;
i {
cursor: pointer;
font-size: 20px;
&.loading {
opacity: 0.5;
}
}
}
&.status {
flex: initial;
width: 70px;
font-size: 14px;
}
}
}
}
.task-add-btn {
display: flex;
z-index: 1;
.task-add__btn {
cursor: pointer;
width: 100px;
height: 28px;
background: #3388ff;
border-radius: 2px;
text-align: center;
line-height: 28px;
margin: 0 auto;
margin-bottom: 10px;
color: #fff;
}
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/hangar/components/controlPanel/components/controlLeft/components/airwayList/components/leapFrogFligh/components/leapFrogFlighDialog/index.vue 0 → 100644
<template>
<el-dialog :modal='modal' :visible.sync="localVisible" :close-on-click-modal="false" :modal-append-to-body="false" :show-close="showClose" @close="handleClose"
:width="width">
<div slot="title" class="dialog-header">
<div v-if="dialogType == 1">
<img src="../../../../../../assets/images/mount_head.png" />
<span class="title vas">{{ title }}</span>
</div>
<span v-else class="dialog-header">
<div class="cf tc vas">{{ title }}</div>
</span>
</div>
<div>
<slot></slot>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="btn" @click="handleClose">取消</el-button>
<el-button type="primary" @click="confirm">确定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name: 'LeapFrogFlighDialog',
props: {
modal: {
type: Boolean,
default: true
},
title: {
type: String,
default: ''
},
dialogType: {
type: Number,
default: 1
},
showClose: {
type: Boolean,
default: true
},
visible: {
type: Boolean,
default: false
},
width: {
type: String,
default: '30%'
}
},
data() {
return {
localVisible: this.visible // 根据 prop 初始化本地状态
};
},
watch: {
visible(newVal) {
this.localVisible = newVal; // 监听 prop 的变化
}
},
methods: {
handleClose() {
this.localVisible = false;
this.$emit('update:visible', false); // 通知父组件
},
confirm() {
this.$emit('confirm');
this.handleClose();
}
}
}
</script>
<style scoped lang="scss">
::v-deep {
.el-dialog__header {
padding: 5px;
}
.el-dialog__headerbtn {
top: 12px;
}
.el-dialog__footer{
text-align: center;
}
}
.dialog-header {
.title {
font-size: 20px;
font-family: YouSheBiaoTiHei;
color: #14faff;
line-height: 26px;
text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);
background: linear-gradient(135deg, #e3aa77 0%, #f5cda9 38%, #f9ecd3 58%, #fcdbb1 79%, #edb07a 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
.dialog-footer {
.btn {
color: #fff;
background-color: #222222;
}
}
</style>
\ No newline at end of file
src/components/MMCFlightControlCenter/components/hangar/components/controlPanel/components/controlLeft/components/airwayList/components/normalTask/index.vue
......@@ -172,7 +172,6 @@ export default {
*/
getTaskList(id) {
return new Promise((resolve) => {
console.log("getTaskList", this.taskListAll);
this.rootNode.$emit("taskListGet", {
pageNo: 1,
pageSize: 100,
......
src/components/MMCFlightControlCenter/components/hangar/components/controlPanel/components/controlLeft/components/airwayList/index.vue
......@@ -15,13 +15,18 @@
<div class="task-list-header__item" :class="{active: tabIndex === 2}" @click="tabIndex = 2">
<label>周期飞行</label>
</div>
<div class="task-list-header__item" :class="{active: tabIndex ===3}" @click="tabIndex = 3">
<label>蛙跳飞行</label>
</div>
</template>
</div>
<div class="task-list-main">
<!-- 常态任务 -->
<NormalTask v-if="tabIndex === 0"></NormalTask>
<!-- 定时任务 --><!-- 周期任务 -->
<TimedTask v-else :type="tabIndex"></TimedTask>
<TimedTask v-else-if="tabIndex === 1 || tabIndex === 2 " :type="tabIndex"></TimedTask>
<!-- 蛙跳飞行 -->
<leapFrogFligh v-else></leapFrogFligh>
</div>
</div>
</template>
......@@ -29,6 +34,8 @@
<script>
import NormalTask from "./components/normalTask";
import TimedTask from "./components/timedTask";
import leapFrogFligh from "./components/leapFrogFligh";
import { mapState } from "vuex";
export default {
......@@ -36,6 +43,7 @@ export default {
components: {
NormalTask,
TimedTask,
leapFrogFligh
},
data() {
return {
......
src/components/MMCFlightControlCenter/index.vue
......@@ -257,6 +257,7 @@ export default {
const content = JSON.parse(data.content || "{}");
const msg = content.message;
switch (type) {
// 接管申请
case "uas-device-take-message":
//接管消息
......@@ -344,6 +345,9 @@ export default {
const content = JSON.parse(data.content || "{}");
const msg = content.message;
switch (type) {
case "uas-device-take-message":
console.log(msg,'msg');
break;
// 刷新无人机列表
case "uas-device-getTree-message":
this.bus.$emit("uas-device-getTree-message", {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论