设备管理-设备调控功能完善

main
zhufu 2 months ago
parent 945553caf9
commit 08bdfaa7dc

@ -1,37 +1,309 @@
<template>
<div style="margin-bottom: 10px;">
<div style="display: flex;align-items: center;">
<span style="margin-right: 10px;">远程调试</span>
<div class="open-control-div">
<div class="control-content">
<span class="open-title">远程调试</span>
<a-switch :checked="props.deviceInfoList[props.controlSN].mode_code == 2" @change="openDebug"/>
</div>
</div>
<div style="margin-bottom: 10px;">机场控制</div>
<div style="margin-bottom: 20px;">
<div style="width: 252px;height: 58px;background-color: #f7f9fa;padding-left: 8px;padding-right: 8px;display: flex;justify-content: space-between;">
<div style="display: flex;align-items: center;">
<div :style="`width: 21px;height: 21px;background-color: ${props.deviceInfoList[props.controlSN].cover_state == 1? 'green': 'red'};margin-right: 8px;`"></div>
<div class="setting-control-title">机场控制</div>
<div class="setting-control-list">
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="tabler:drone" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
modeCodeOptions[props.deviceInfoList[props.controlSN].mode_code]
}}
</div>
<div class="show-span">机场系统</div>
</div>
</div>
<div class="button-div">
<a-button class="control-button" @click="changeState('device_reboot')" :disabled="props.deviceInfoList[props.controlSN].mode_code != 2">重启</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="tabler:capture" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
getCoverState(props.deviceInfoList[props.controlSN].cover_state)
}}
</div>
<div class="show-span">舱盖</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeState(props.deviceInfoList[props.controlSN].cover_state == 0? 'cover_open': 'cover_close')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].cover_state == 0? '打开': '关闭'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="streamline:travel-hotel-air-conditioner-heating-ac-air-hvac-cool-cooling-cold-hot-conditioning" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
props.deviceInfoList[props.controlSN].air_conditioner && airConditionerStateOptions[props.deviceInfoList[props.controlSN].air_conditioner.air_conditioner_state]
}}
</div>
<div class="show-span">空调</div>
</div>
</div>
<div class="button-div">
<a-button
v-if="props.deviceInfoList[props.controlSN]?.air_conditioner.air_conditioner_state != 0"
class="control-button"
@click="changeState('air_conditioner_mode_switch',0)"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
停止
</a-button>
<a-dropdown v-else placement="bottom">
<a-button class="control-button">开启</a-button>
<template #overlay>
<a-menu>
<a-menu-item @click="changeState('air_conditioner_mode_switch',1)"></a-menu-item>
<a-menu-item @click="changeState('air_conditioner_mode_switch',2)"></a-menu-item>
<a-menu-item @click="changeState('air_conditioner_mode_switch',3)">湿</a-menu-item>
</a-menu>
</template>
</a-dropdown>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="material-symbols:volume-off" style="font-size: 21px;"/>
</div>
<div>
<div style="line-height: 22px;">{{getCoverState(props.deviceInfoList[props.controlSN].cover_state)}}</div>
<div style="line-height: 22px;">舱盖</div>
<div class="show-span">
{{
silentModeOptions[props.deviceInfoList[props.controlSN].silent_mode]
}}
</div>
<div class="show-span">静音模式</div>
</div>
</div>
<div style="display: flex;align-items: center;">
<a-button style="width: 70px;height: 30px;" @click="openCoverState" :disabled="props.deviceInfoList[props.controlSN].mode_code != 2">{{props.deviceInfoList[props.controlSN].cover_state == 0? '打开': '关闭'}}</a-button>
<div class="button-div">
<a-button
class="control-button"
@click=""
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].silent_mode == 0? '开启': '关闭'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="mdi:alarm-light-outline" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
alarmStateOptions[props.deviceInfoList[props.controlSN].alarm_state]
}}
</div>
<div class="show-span">机场声光报警</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeState('alarm_state_switch',props.deviceInfoList[props.controlSN].alarm_state == 0? 1: 0)"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].alarm_state == 0? '开启': '关闭'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="icon-park-twotone:storage-card-two" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
props.deviceInfoList[props.controlSN].storage &&
`${(props.deviceInfoList[props.controlSN].storage.used / 1000 / 1024).toFixed(1)}/${(props.deviceInfoList[props.controlSN].storage.total / 1000 / 1024).toFixed(1)}GB`
}}
</div>
<div class="show-span">机场存储</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeState('device_format')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
格式化
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="icon-park-outline:storage-card-one" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">--</div>
<div class="show-span">机场增强图传</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click=""
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
设置
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="carbon:certificate-check" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">解禁证书</div>
<div class="show-span">限飞解禁证书</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click=""
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
设置
</a-button>
</div>
</div>
</div>
<div style="margin-bottom: 10px;">飞行器控制</div>
<div>
<div style="width: 252px;height: 58px;background-color: #f7f9fa;padding-left: 8px;padding-right: 8px;display: flex;justify-content: space-between;">
<div style="display: flex;align-items: center;">
<div :style="`width: 21px;height: 21px;background-color: ${props.deviceInfoList[props.controlSN].sub_device.device_online_status == 1? 'green': 'red'};margin-right: 8px;`"></div>
<div class="setting-control-title">飞行器控制</div>
<div class="setting-control-list">
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="material-symbols:power-settings-new" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
deviceOnlineStatusOptions[props.deviceInfoList[props.controlSN].sub_device.device_online_status]
}}
</div>
<div class="show-span">飞行器电源</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeDeviceState(props.deviceInfoList[props.controlSN].sub_device.device_online_status == 0? 'drone_open': 'drone_close')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].sub_device.device_online_status == 0? '开机': '关机'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="mdi:battery-high" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
droneChargeStateOptions[props.deviceInfoList[props.controlSN].drone_charge_state.state]
}}
</div>
<div class="show-span">飞行器充电</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeDeviceState(props.deviceInfoList[props.controlSN].drone_charge_state.state == 0? 'charge_open': 'charge_close')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].drone_charge_state.state == 0? '充电': '停止'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="mdi:signal-4g" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
{{
fourgLinkStateOptions[props.deviceInfoList[props.controlSN].wireless_link["4g_link_state"]]
}}
</div>
<div class="show-span">增强图传</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeDeviceState('sdr_workmode_switch',props.deviceInfoList[props.controlSN].wireless_link['4g_link_state'] == 0? 1: 0, 'link_workmode')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
{{props.deviceInfoList[props.controlSN].wireless_link["4g_link_state"] == 0? '开启': '关闭'}}
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="icon-park-twotone:storage-card-two" style="font-size: 21px;"/>
</div>
<div>
<div class="show-span">
--
</div>
<div class="show-span">飞行器存储</div>
</div>
</div>
<div class="button-div">
<a-button
class="control-button"
@click="changeDeviceState('drone_format')"
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
格式化
</a-button>
</div>
</div>
<div class="control-item">
<div class="info-div">
<div class="icon">
<Icon icon="ph:sim-card-duotone" style="font-size: 21px;"/>
</div>
<div>
<div style="line-height: 22px;">{{props.deviceInfoList[props.controlSN].sub_device.device_online_status == 0? "关机": "开机"}}</div>
<div style="line-height: 22px;">飞行器电源</div>
<div class="show-span">
{{
linkWorkmodeOptions[props.deviceInfoList[props.controlSN].wireless_link.link_workmode]
}}
</div>
<div class="show-span">飞行器增强图传</div>
</div>
</div>
<div style="display: flex;align-items: center;">
<a-button style="width: 70px;height: 30px;" @click="openDeviceOnline" :disabled="props.deviceInfoList[props.controlSN].mode_code != 2">{{props.deviceInfoList[props.controlSN].sub_device.device_online_status == 0? '开机': '关机'}}</a-button>
<div class="button-div">
<a-button
class="control-button"
@click=""
:disabled="props.deviceInfoList[props.controlSN].mode_code != 2">
设置
</a-button>
</div>
</div>
</div>
@ -41,6 +313,9 @@
import { defineProps } from "vue"
import { clientPublish } from '@/utils/mqtt'
import { buildGUID } from '@/utils/uuid';
import Icon from '@/components/Icon/Icon.vue';
import { modeCodeOptions, deviceOnlineStatusOptions, coverStateOptions, airConditionerStateOptions, silentModeOptions,
alarmStateOptions, droneChargeStateOptions, fourgLinkStateOptions, linkWorkmodeOptions } from './util'
const props = defineProps(['deviceInfoList', 'controlSN'])
const openDebug = () => {
@ -60,28 +335,77 @@ const getCoverState = (value) => {
}
return options[value]
}
const openCoverState = () => {
const changeState = (method,action?) => {
let publishUrl = `thing/product/${props.controlSN}/services`
let params = {
method: props.deviceInfoList[props.controlSN].cover_state == 0? 'cover_open': 'cover_close',
method: method,
bid: buildGUID(),
tid: buildGUID(),
timestamp: new Date().getTime(),
data: null,
data: action? { action }: null,
};
clientPublish(publishUrl,params)
}
const openDeviceOnline = () => {
const changeDeviceState = (method, action?, type?) => {
let publishUrl = `thing/product/${props.controlSN}/services`
let params = {
method: props.deviceInfoList[props.controlSN].sub_device.device_online_status == 0? 'drone_open': 'drone_close',
method,
bid: buildGUID(),
tid: buildGUID(),
timestamp: new Date().getTime(),
data: null,
data: type? { [type]: action }: action? { action }: null,
};
clientPublish(publishUrl,params)
}
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.open-control-div{
margin-bottom: 10px;
.control-content{
display: flex;
align-items: center;
.open-title{
margin-right: 10px;
}
}
}
.setting-control-title{
margin-bottom: 10px;
}
.setting-control-list{
margin-bottom: 20px;
display: flex;
flex-wrap: wrap;
gap: 10px;
.control-item{
width: 252px;
height: 58px;
background-color: #f7f9fa;
padding-left: 8px;
padding-right: 8px;
display: flex;
justify-content: space-between;
}
.info-div{
display: flex;
align-items: center;
.icon{
width: 21px;
height: 21px;
margin-right: 8px;
}
.show-span{
line-height: 22px;
}
}
.button-div{
display: flex;
align-items: center;
.control-button{
width: 70px;
height: 30px;
}
}
}
</style>

@ -0,0 +1,56 @@
export const modeCodeOptions = {
0: '空闲中',
1: '现场调试',
2: '远程调试',
3: '固件升级中',
4: '作业中',
5: '待标定',
}
export const deviceOnlineStatusOptions = {
0: '关机',
1: '开机'
}
export const coverStateOptions = {
0: '关闭',
1: '打开',
2: '半开',
3: '舱盖状态异常',
}
export const airConditionerStateOptions = {
0: '空闲模式(无制冷、制热、除湿等)',
1: '制冷模式',
2: '制热模式',
3: '除湿模式',
4: '制冷退出模式',
5: '制热退出模式',
6: '除湿退出模式',
7: '制冷准备模式',
8: '制热准备模式',
9: '除湿准备模式',
10: '风冷准备中',
11: '风冷中',
12: '风冷退出中',
13: '除雾准备中',
14: '除雾中',
15: '除雾退出中',
}
export const silentModeOptions = {
0: '非静音模式',
1: '静音模式',
}
export const alarmStateOptions = {
0: '关闭',
1: '开启',
}
export const droneChargeStateOptions = {
0: '空闲',
1: '充电中',
}
export const fourgLinkStateOptions = {
0: '断开',
1: '连接',
}
export const linkWorkmodeOptions = {
0: 'SDR 模式',
1: '4G 融合模式',
}
Loading…
Cancel
Save