From 54cca8780ee531afafdaf9a288f3a6f722db1b3d Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Sat, 19 Apr 2025 17:44:57 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/hooks/useTaskViewInfo/useTaskViewInfo.js | 39 +-
src/hooks/useTaskWayline/useTaskWayline.js | 37 +-
src/views/SignMachineNest/MachineRight/MachineStatus/MachineStatus.vue | 738 ++++++++++++++++++++++++++--------------------------
3 files changed, 422 insertions(+), 392 deletions(-)
diff --git a/src/hooks/useTaskViewInfo/useTaskViewInfo.js b/src/hooks/useTaskViewInfo/useTaskViewInfo.js
index 54d4e18..046d46e 100644
--- a/src/hooks/useTaskViewInfo/useTaskViewInfo.js
+++ b/src/hooks/useTaskViewInfo/useTaskViewInfo.js
@@ -3,7 +3,7 @@
import CreateFrustum from '@/utils/cesium/frustum/CreateFrustum'
export function useTaskViewInfo (viewer, wsInfo, removeEntitys) {
- const newViewer = unref(viewer)
+ const newViewer = isRef(viewer) ? viewer : ref(viewer)
let viewInfoFrustum
// 设置视椎
@@ -14,7 +14,7 @@
const attitude_head = 180 + host.attitude_head
const gimbal_pitch = 90 - Number(host?.payloads[0]?.gimbal_pitch) || 0
- viewInfoFrustum = new CreateFrustum(newViewer, {
+ viewInfoFrustum = new CreateFrustum(newViewer.value, {
position: {
longitude: host.longitude,
latitude: host.latitude,
@@ -33,14 +33,14 @@
function setAircraftGltf () {
const host = deviceOsdInfo.value?.data?.host
- const aircraftEntity = newViewer.entities.getById('aircraftGltf')
+ const aircraftEntity = newViewer.value?.entities.getById('aircraftGltf')
const position = Cesium.Cartesian3.fromDegrees(host.longitude, host.latitude, host.height)
if (aircraftEntity) {
aircraftEntity.position = new Cesium.ConstantPositionProperty(position)
return
}
- newViewer.entities.add({
+ newViewer.value?.entities.add({
id: 'aircraftGltf',
position,
model: {
@@ -55,22 +55,33 @@
// 视椎加载处理
const deviceOsdInfo = computed(() => wsInfo.value?.device_osd)
- watch(deviceOsdInfo, () => {
- const host = deviceOsdInfo.value?.data?.host
- if ([14, 0].includes(host.mode_code)) {
- mapEntityRemove()
- return
+ watch(
+ [
+ () => deviceOsdInfo.value,
+ () => newViewer.value
+ ],
+ (
+ [curDeviceOsdInfo, curViewer],
+ ) => {
+ const host = deviceOsdInfo.value?.data?.host
+
+ if (!curViewer) return
+
+ if ([14, 0].includes(host.mode_code)) {
+ mapEntityRemove()
+ return
+ }
+
+ setCreateFrustum(host)
+ setAircraftGltf()
}
-
- setCreateFrustum(host)
- setAircraftGltf()
- })
+ )
const mapEntityRemove = () => {
viewInfoFrustum?.clear()
- newViewer.entities.removeById('aircraftGltf')
+ newViewer.value?.entities.removeById('aircraftGltf')
removeEntitys && removeEntitys()
}
diff --git a/src/hooks/useTaskWayline/useTaskWayline.js b/src/hooks/useTaskWayline/useTaskWayline.js
index 200de38..45cf87b 100644
--- a/src/hooks/useTaskWayline/useTaskWayline.js
+++ b/src/hooks/useTaskWayline/useTaskWayline.js
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2025-04-19 14:24:34
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2025-04-19 15:23:57
+ * @LastEditTime: 2025-04-19 17:21:58
* @FilePath: \command-center-dashboard\src\hooks\useTaskWayline\useTaskWayline.js
* @Description:
*
@@ -20,7 +20,7 @@
import { Cartesian3 } from 'cesium'
export function useTaskWayline (viewer, taskDetails) {
- const newViewer = unref(viewer)
+ const newViewer = isRef(viewer) ? viewer : ref(viewer)
// 解析kmz文件
const parsingFiles = async url => {
@@ -30,7 +30,7 @@
const waylinesXMLObj = removeTextKey(waylinesXMLJSON.Folder)
if (!waylinesXMLObj.Placemark.length) return
const allPoint = waylinesXMLObj.Placemark.map(item => item.Point.coordinates.split(','))
- flyVisual(allPoint, newViewer)
+ flyVisual(allPoint, newViewer.value)
drawWayline(waylinesXMLObj)
}
@@ -40,7 +40,7 @@
return Cartesian3.fromDegrees(Number(lon), Number(lat))
})
// 起点
- newViewer.entities.add({
+ newViewer.value.entities.add({
id: 'drone-job-wayline-start',
position: positions[0],
billboard: {
@@ -51,7 +51,7 @@
})
// 终点
- newViewer.entities.add({
+ newViewer.value.entities.add({
id: 'drone-job-wayline-end',
position: positions[positions.length - 1],
billboard: {
@@ -63,7 +63,7 @@
})
// 路径线
- newViewer.entities.add({
+ newViewer.value.entities.add({
id: 'drone-job-wayline-polyline',
polyline: {
width: 4,
@@ -79,17 +79,26 @@
})
}
- watch(taskDetails, () => {
- if (taskDetails.value?.way_lines?.length) {
- parsingFiles(taskDetails.value.way_lines[0].url)
- }
- }, { immediate: true })
+ watch(
+ [
+ () => taskDetails.value?.way_lines?.length,
+ () => newViewer.value
+ ],
+ (
+ [wayLinesLength, curViewer],
+ ) => {
+ if (wayLinesLength && wayLinesLength > 0 && curViewer) {
+ parsingFiles(taskDetails.value.way_lines[0].url)
+ }
+ },
+ { immediate: true }
+ )
const removeEntitys = () => {
- const entitiesIDs = newViewer?.entities.values.map(i => i.id)
+ const entitiesIDs = newViewer.value?.entities.values.map(i => i.id)
- entitiesIDs.forEach(item => {
- item.includes('drone-job-wayline-') && newViewer?.entities.removeById(item)
+ Array.isArray(entitiesIDs) && entitiesIDs.forEach(item => {
+ item.includes('drone-job-wayline-') && newViewer.value?.entities.removeById(item)
})
}
diff --git a/src/views/SignMachineNest/MachineRight/MachineStatus/MachineStatus.vue b/src/views/SignMachineNest/MachineRight/MachineStatus/MachineStatus.vue
index 3f40360..ad8534a 100644
--- a/src/views/SignMachineNest/MachineRight/MachineStatus/MachineStatus.vue
+++ b/src/views/SignMachineNest/MachineRight/MachineStatus/MachineStatus.vue
@@ -1,393 +1,403 @@
<!-- 机巢状态 -->
<template>
- <CommonTitle title="机巢状态" @details="detailsFun" />
- <div :style="{ marginLeft: pxToRem(14) }">
- <div class="machine-status">
- <div class="info">
- <img src="../../../../assets/images/signMachineNest/machineRight/wrj.png" alt="">
- <div class="info-right">
- <!-- <div class="name">{{ osdVisible?.callsign || '--' }}</div> -->
- <div class="name">{{ osdVisible?.nickname || '--' }}</div>
- <div class="wz">
- <span class="left">当前位置：</span>
- <span class="right">{{ detailInfo.longitude }},{{ detailInfo.latitude }}</span>
- </div>
- <div class="close-wb">
- <div class="close" :class="AircraftStatus == undefined ? '' : 'other'">
- {{ AircraftStatus == undefined ? '舱内关机' : AircraftStatus }}
- </div>
- <!-- <div class="wb">需要维保</div> -->
- </div>
- </div>
- </div>
- <div class="status">
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/height.png" alt="">
- <span class="text">实时真高</span>
- </div>
- <div class="text-data">{{ detailInfo.height || '--' }}<span class="text">米</span></div>
- </div>
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/speed.png" alt="">
- <span class="text">飞行速度</span>
- </div>
- <div class="text-data">{{ detailInfo.horizontal_speed }}<span class="text">米/秒</span></div>
- </div>
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/signal.png" alt="">
- <span class="text">信号强度</span>
- </div>
- <div class="text-data">{{ detailInfo.quality }}</div>
- </div>
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/electricity.png" alt="">
- <span class="text">电池电量</span>
- </div>
- <div v-if="drone_charge_state.capacity_percent != 0" class="text-data">
- {{ drone_charge_state.capacity_percent }}<span class="text">%</span>
- </div>
- <div v-else class="text-data">{{ detailInfo.capacity_percent }}<span class="text">%</span></div>
- </div>
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/distance.png" alt="">
- <span class="text">飞行距离</span>
- </div>
- <div class="text-data">{{ singleTotal.flight_mileage }}<span class="text">km</span></div>
- </div>
- <div class="card">
- <div>
- <img src="../../../../assets/images/signMachineNest/machineRight/duration.png" alt="">
- <span class="text">飞行时长</span>
- </div>
- <div class="text-data">{{ singleTotal.hour_count }}<span class="text">h</span></div>
- </div>
- </div>
- </div>
- </div>
- <MachineTableDetails v-model:show="isShowDetails"/>
+ <CommonTitle title="机巢状态" @details="detailsFun" />
+ <div :style="{ marginLeft: pxToRem(14) }">
+ <div class="machine-status">
+ <div class="info">
+ <img src="../../../../assets/images/signMachineNest/machineRight/wrj.png" alt="" />
+ <div class="info-right">
+ <!-- <div class="name">{{ osdVisible?.callsign || '--' }}</div> -->
+ <div class="name">{{ osdVisible?.nickname || '--' }}</div>
+ <div class="wz">
+ <span class="left">当前位置：</span>
+ <span class="right">{{ detailInfo.longitude }},{{ detailInfo.latitude }}</span>
+ </div>
+ <div class="close-wb">
+ <div class="close" :class="AircraftStatus == undefined ? '' : 'other'">
+ {{ AircraftStatus == undefined ? '舱内关机' : AircraftStatus }}
+ </div>
+ <!-- <div class="wb">需要维保</div> -->
+ </div>
+ </div>
+ </div>
+ <div class="status">
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/height.png" alt="" />
+ <span class="text">实时真高</span>
+ </div>
+ <div class="text-data">
+ {{ detailInfo.height || '--' }}
+ <span class="text">米</span>
+ </div>
+ </div>
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/speed.png" alt="" />
+ <span class="text">飞行速度</span>
+ </div>
+ <div class="text-data">
+ {{ detailInfo.horizontal_speed }}
+ <span class="text">米/秒</span>
+ </div>
+ </div>
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/signal.png" alt="" />
+ <span class="text">信号强度</span>
+ </div>
+ <div class="text-data">{{ detailInfo.quality }}</div>
+ </div>
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/electricity.png" alt="" />
+ <span class="text">电池电量</span>
+ </div>
+ <div v-if="drone_charge_state.capacity_percent != 0" class="text-data">
+ {{ drone_charge_state.capacity_percent }}
+ <span class="text">%</span>
+ </div>
+ <div v-else class="text-data">
+ {{ detailInfo.capacity_percent }}
+ <span class="text">%</span>
+ </div>
+ </div>
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/distance.png" alt="" />
+ <span class="text">飞行距离</span>
+ </div>
+ <div class="text-data">
+ {{ singleTotal.flight_mileage }}
+ <span class="text">km</span>
+ </div>
+ </div>
+ <div class="card">
+ <div>
+ <img src="../../../../assets/images/signMachineNest/machineRight/duration.png" alt="" />
+ <span class="text">飞行时长</span>
+ </div>
+ <div class="text-data">
+ {{ singleTotal.hour_count }}
+ <span class="text">h</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <MachineTableDetails v-model:show="isShowDetails" />
</template>
<script setup>
-import CommonTitle from '@/components/CommonTitle.vue';
-import { EDeviceTypeName } from '@/utils/staticData/enums.js';
-import { EModeCode, EDockModeText, EModeText } from '@/utils/staticData/device';
-import { getLnglatAltitude } from '@/utils/cesium/mapUtil.js';
-import { useStore } from 'vuex';
-import MachineTableDetails from '@/views/SignMachineNest/MachineRight/MachineStatus/MachineTableDetails/MachineTableDetails.vue';
+import CommonTitle from '@/components/CommonTitle.vue'
+import { EDeviceTypeName } from '@/utils/staticData/enums.js'
+import { EModeCode, EDockModeText, EModeText } from '@/utils/staticData/device'
+import { getLnglatAltitude } from '@/utils/cesium/mapUtil.js'
+import { useStore } from 'vuex'
+import MachineTableDetails from '@/views/SignMachineNest/MachineRight/MachineStatus/MachineTableDetails/MachineTableDetails.vue'
-const store = useStore();
+const store = useStore()
// 获取机巢信息
-let osdVisible = ref({});//computed(() => store.state.home.osdVisible);
-const singleUavHome = computed(() => store.state.home.singleUavHome);
+let osdVisible = ref({}) //computed(() => store.state.home.osdVisible);
+const singleUavHome = computed(() => store.state.home.singleUavHome)
// 单个机巢统计数据
-const singleTotal = computed(() => store.state.home.singleTotal);
+const singleTotal = computed(() => store.state.home.singleTotal)
// 是否展示机机巢状态详情
-let isShowDetails = ref(false);
+let isShowDetails = ref(false)
-let str = '--';
+let str = '--'
let drone_charge_state = ref({
- capacity_percent: '--',
- state: 0
+ capacity_percent: '--',
+ state: 0,
})
-let AircraftStatus = ref(null);
+let AircraftStatus = ref(null)
let detailInfo = ref({
- longitude: '--',
- latitude: '--',
- home_distance: '--',
- quality: '--',
- horizontal_speed: '--',
- height: '--',
- remain_flight_time: '--',
- capacity_percent: '--',
-});
-let quality = ref(['弱', '较弱', '中等', '较强', '强']);
+ longitude: '--',
+ latitude: '--',
+ home_distance: '--',
+ quality: '--',
+ horizontal_speed: '--',
+ height: '--',
+ remain_flight_time: '--',
+ capacity_percent: '--',
+})
+let quality = ref(['弱', '较弱', '中等', '较强', '强'])
let deviceInfo = ref({
- gateway: {
- capacity_percent: str,
- transmission_signal_quality: str,
- },
- dock: {},
- device: {
- gear: -1,
- mode_code: EModeCode.Disconnected,
- height: str,
- home_distance: str,
- horizontal_speed: str,
- vertical_speed: str,
- wind_speed: str,
- wind_direction: str,
- elevation: str,
- position_state: {
- gps_number: str,
- is_fixed: 0,
- rtk_number: str,
- },
- battery: {
- capacity_percent: str,
- landing_power: str,
- remain_flight_time: 0,
- return_home_power: str,
- },
- latitude: 0,
- longitude: 0,
- },
-});
-let mode_code = ref('已断开连接');
+ gateway: {
+ capacity_percent: str,
+ transmission_signal_quality: str,
+ },
+ dock: {},
+ device: {
+ gear: -1,
+ mode_code: EModeCode.Disconnected,
+ height: str,
+ home_distance: str,
+ horizontal_speed: str,
+ vertical_speed: str,
+ wind_speed: str,
+ wind_direction: str,
+ elevation: str,
+ position_state: {
+ gps_number: str,
+ is_fixed: 0,
+ rtk_number: str,
+ },
+ battery: {
+ capacity_percent: str,
+ landing_power: str,
+ remain_flight_time: 0,
+ return_home_power: str,
+ },
+ latitude: 0,
+ longitude: 0,
+ },
+})
+let mode_code = ref('已断开连接')
-watch(() => store.state.home.osdVisible, (newValue) => {
- osdVisible.value = newValue;
-});
+watch(
+ () => store.state.home.osdVisible,
+ newValue => {
+ osdVisible.value = newValue
+ }
+)
// 监听实时信息
watch(
- () => store.state.home.wsMessage,
- (newValue) => {
- if (newValue.mode_code === 14) return
- if (Object.keys(newValue).length === 0) return
- detailInfo.value.longitude = newValue?.longitude.toFixed(6) || '--';
- detailInfo.value.latitude = newValue?.latitude.toFixed(6) || '--';
- // console.log(window.$viewer)
- getLnglatAltitude(Number(detailInfo.value.longitude), Number(detailInfo.value.latitude),window.$viewer).then((res) => {
- const height = newValue?.height - res?.height;
- //针对西安实时高度进行降低
- const wId = localStorage.getItem('bs_workspace_id');
- if (wId === 'f47ac10b-58cc-4372-a567-0e02b2c3d479') {
- detailInfo.value.height = reduceHeight(height);
- } else {
- detailInfo.value.height = height.toFixed(1) || '--';
- }
+ () => store.state.home.wsMessage,
+ newValue => {
+ if (newValue.mode_code === 14) return
+ if (Object.keys(newValue).length === 0) return
+ detailInfo.value.longitude = newValue?.longitude.toFixed(6) || '--'
+ detailInfo.value.latitude = newValue?.latitude.toFixed(6) || '--'
+ // console.log(window.$viewer)
+ getLnglatAltitude(Number(detailInfo.value.longitude), Number(detailInfo.value.latitude), window.$viewer).then(
+ res => {
+ const height = newValue?.height - res?.height
+ //针对西安实时高度进行降低
+ const wId = localStorage.getItem('bs_workspace_id')
+ if (wId === 'f47ac10b-58cc-4372-a567-0e02b2c3d479') {
+ detailInfo.value.height = reduceHeight(height)
+ } else {
+ detailInfo.value.height = height.toFixed(1) || '--'
+ }
- detailInfo.value.quality = quality.value[newValue?.position_state.quality - 1] || '--';
- detailInfo.value.horizontal_speed = newValue?.horizontal_speed.toFixed(1) || '--';
- detailInfo.value.remain_flight_time = (newValue?.battery.remain_flight_time / 60).toFixed(0) || '--';
- detailInfo.value.capacity_percent = (newValue?.battery.capacity_percent).toFixed(0) || '--';
- });
- },
- { immediate: true, deep: true }
-);
+ detailInfo.value.quality = quality.value[newValue?.position_state.quality - 1] || '--'
+ detailInfo.value.horizontal_speed = newValue?.horizontal_speed.toFixed(1) || '--'
+ detailInfo.value.remain_flight_time = (newValue?.battery.remain_flight_time / 60).toFixed(0) || '--'
+ detailInfo.value.capacity_percent = (newValue?.battery.capacity_percent).toFixed(0) || '--'
+ }
+ )
+ },
+ { immediate: true, deep: true }
+)
// 获取最新机场状态
-watch(store.state.home.deviceState, (newValue) => {
- // console.log('newValue', newValue);
- if (newValue.currentType === EDeviceTypeName.Dock && newValue?.dockInfo[newValue.currentSn]) {
- // 机场状态
- mode_code.value = EDockModeText[newValue?.dockInfo[newValue.currentSn]?.basic_osd?.mode_code];
- // this.$emit('updateModeCode', mode_code.value);
- // 舱内状态
- AircraftStatus.value =
- EModeText[newValue.deviceInfo[
- deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
- osdVisible.sn
- ]?.mode_code
- ];
- // 舱内关机时显示的电量
- let child_sn = newValue?.dockInfo[newValue.currentSn].basic_osd.sub_device?.device_sn;
- // 飞机在线时取飞机中的电量
- if(newValue.deviceInfo[child_sn]) {
- drone_charge_state.value = {
- capacity_percent: newValue.deviceInfo[child_sn].battery.capacity_percent,
- state: newValue.deviceInfo[child_sn].battery.landing_power
- }
- } else{
- // 遥控器这里拿不到值data.drone_charge_state_new == undefined 会一直报错
- if (newValue.drone_charge_state_new) {
- drone_charge_state.value = newValue.drone_charge_state_new;
- }
- }
- if (osdVisible.value.visible && osdVisible.value.is_dock && osdVisible.value.gateway_sn !== '') {
- deviceInfo.value.dock = newValue.dockInfo[osdVisible.value.gateway_sn];
- deviceInfo.value.device =
- newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
- osdVisible.value.sn
- ];
- // 设备关机即不显示信息
- // 兼容遥控器 关闭无人机 mode_code返回的是14 不是undefined
- if (
- newValue.deviceInfo[
- deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
- osdVisible.value.sn
- ]?.mode_code === undefined || newValue.deviceInfo[
- deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
- osdVisible.value .sn
- ]?.mode_code == 14
- ) {
- detailInfo.value = {
- longitude: '--',
- latitude: '--',
- home_distance: '--',
- quality: '--',
- horizontal_speed: '--',
- remain_flight_time: '--',
- height: '--',
- capacity_percent: '--',
- };
- }
- }
- }
- },
- { immediate: true, deep: true }
-);
+watch(
+ store.state.home.deviceState,
+ newValue => {
+ // console.log('newValue', newValue);
+ if (newValue.currentType === EDeviceTypeName.Dock && newValue?.dockInfo[newValue.currentSn]) {
+ // 机场状态
+ mode_code.value = EDockModeText[newValue?.dockInfo[newValue.currentSn]?.basic_osd?.mode_code]
+ // this.$emit('updateModeCode', mode_code.value);
+ // 舱内状态
+ AircraftStatus.value =
+ EModeText[
+ newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ?? osdVisible.sn]?.mode_code
+ ]
+ // 舱内关机时显示的电量
+ let child_sn = newValue?.dockInfo[newValue.currentSn].basic_osd?.sub_device?.device_sn
+ // 飞机在线时取飞机中的电量
+ if (newValue.deviceInfo[child_sn]) {
+ drone_charge_state.value = {
+ capacity_percent: newValue.deviceInfo[child_sn].battery.capacity_percent,
+ state: newValue.deviceInfo[child_sn].battery.landing_power,
+ }
+ } else {
+ // 遥控器这里拿不到值data.drone_charge_state_new == undefined 会一直报错
+ if (newValue.drone_charge_state_new) {
+ drone_charge_state.value = newValue.drone_charge_state_new
+ }
+ }
+ if (osdVisible.value.visible && osdVisible.value.is_dock && osdVisible.value.gateway_sn !== '') {
+ deviceInfo.value.dock = newValue.dockInfo[osdVisible.value.gateway_sn]
+ deviceInfo.value.device =
+ newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ?? osdVisible.value.sn]
+ // 设备关机即不显示信息
+ // 兼容遥控器 关闭无人机 mode_code返回的是14 不是undefined
+ if (
+ newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ?? osdVisible.value.sn]
+ ?.mode_code === undefined ||
+ newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ?? osdVisible.value.sn]
+ ?.mode_code == 14
+ ) {
+ detailInfo.value = {
+ longitude: '--',
+ latitude: '--',
+ home_distance: '--',
+ quality: '--',
+ horizontal_speed: '--',
+ remain_flight_time: '--',
+ height: '--',
+ capacity_percent: '--',
+ }
+ }
+ }
+ }
+ },
+ { immediate: true, deep: true }
+)
-const reduceHeight = (height) => {
- if (!Number(height)) return '--';
- let theFinheight = 0;
- if (height < 120) {
- theFinheight = height;
- } else if (height > 220) {
- theFinheight = height - 110;
- } else if (height > 210) {
- theFinheight = height - 100;
- } else if (height > 200) {
- theFinheight = height - 90;
- } else if (height > 190) {
- theFinheight = height - 80;
- } else if (height > 180) {
- theFinheight = height - 70;
- } else if (height > 170) {
- theFinheight = height - 60;
- } else if (height > 160) {
- theFinheight = height - 50;
- } else if (height > 150) {
- theFinheight = height - 40;
- } else if (height > 140) {
- theFinheight = height - 30;
- } else if (height > 130) {
- theFinheight = height - 20;
- } else if (height > 120) {
- theFinheight = height - 10;
- }
- return theFinheight.toFixed(1);
-};
+const reduceHeight = height => {
+ if (!Number(height)) return '--'
+ let theFinheight = 0
+ if (height < 120) {
+ theFinheight = height
+ } else if (height > 220) {
+ theFinheight = height - 110
+ } else if (height > 210) {
+ theFinheight = height - 100
+ } else if (height > 200) {
+ theFinheight = height - 90
+ } else if (height > 190) {
+ theFinheight = height - 80
+ } else if (height > 180) {
+ theFinheight = height - 70
+ } else if (height > 170) {
+ theFinheight = height - 60
+ } else if (height > 160) {
+ theFinheight = height - 50
+ } else if (height > 150) {
+ theFinheight = height - 40
+ } else if (height > 140) {
+ theFinheight = height - 30
+ } else if (height > 130) {
+ theFinheight = height - 20
+ } else if (height > 120) {
+ theFinheight = height - 10
+ }
+ return theFinheight.toFixed(1)
+}
// 详情
const detailsFun = () => {
- isShowDetails.value = true;
-};
+ isShowDetails.value = true
+}
</script>
<style lang="scss" scoped>
- .machine-status {
- width: 390px;
- height: 230px;
- background: linear-gradient(
- 270deg,
- #1f3e7a 0%,
- rgba(31, 62, 122, 0.35) 79%,
- rgba(31, 62, 122, 0) 100%
- );
- opacity: 0.85;
- margin: 2px 0 13 0;
+.machine-status {
+ width: 390px;
+ height: 230px;
+ background: linear-gradient(270deg, #1f3e7a 0%, rgba(31, 62, 122, 0.35) 79%, rgba(31, 62, 122, 0) 100%);
+ opacity: 0.85;
+ margin: 2px 0 13 0;
- padding: 8px 0px 20px 18px;
- .info {
- display: flex;
- // justify-content: ce;
- height: 88px;
- display: flex;
- align-items: center;
- img {
- width: 94px;
- height: 88px;
- margin-right: 22px;
- }
- .info-right {
- .name {
- width: 184px;
- height: 31px;
- font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
- font-weight: 400;
- font-size: 24px;
- color: #0BE5F5;
- line-height: 28px;
- overflow: hidden; // 添加溢出隐藏
- text-overflow: ellipsis; // 显示省略号
- white-space: nowrap; // 不换行
- }
- .wz {
- font-family: Source Han Sans CN, Source Han Sans CN;
- font-size: 14px;
- color: #FFFFFF;
- line-height: 16px;
- .left {
- width: 70px;
- height: 21px;
- font-weight: 400;
- opacity: 0.6;
- }
- .right {
- width: 100px;
- height: 21px;
- font-weight: bold;
- }
- }
- .close-wb {
- display: flex;
- margin-top: 10px;
- text-align: center;
- line-height: 16px;
- .close {
- width: 60px;
- height: 20px;
- line-height: 20px;
- background: rgba(255,178,106,0.2);
- border-radius: 4px 4px 4px 4px;
- border: 1px solid #FFB26A;
- color: #FFB26A;
- margin-right: 10px;
- }
- .other {
- border: 1px solid #8EFFAC;
- color: #8EFFAC;
- }
- .wb {
- width: 60px;
- height: 20px;
- background: rgba(255,106,106,0.2);
- border-radius: 4px 4px 4px 4px;
- border: 1px solid #FF6A6A;
- color: #FF6A6A;
- }
- }
-
- }
- }
- .status {
- display: flex;
- flex-wrap: wrap;
- gap: 10px 20px;
- margin-top: 18px;
- .card {
- width: calc(33.33% - 14px);
- }
- img {
- width: 16px;
- height: 16px;
- // margin-right: 0px;
- // margin-top: 2px;
- }
- .text {
- width: 56px;
- height: 21px;
- font-family: Source Han Sans CN, Source Han Sans CN;
- font-weight: 400;
- font-size: 14px;
- color: #FFFFFF;
- line-height: 16px;
- }
- .text-data {
- // width: 40px;
- margin-left: 20px;
- height: 23px;
- font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
- font-weight: 400;
- font-size: 18px;
- color: #0BE5F5;
- line-height: 21px;
- }
- }
- }
+ padding: 8px 0px 20px 18px;
+ .info {
+ display: flex;
+ // justify-content: ce;
+ height: 88px;
+ display: flex;
+ align-items: center;
+ img {
+ width: 94px;
+ height: 88px;
+ margin-right: 22px;
+ }
+ .info-right {
+ .name {
+ width: 184px;
+ height: 31px;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
+ font-size: 24px;
+ color: #0be5f5;
+ line-height: 28px;
+ overflow: hidden; // 添加溢出隐藏
+ text-overflow: ellipsis; // 显示省略号
+ white-space: nowrap; // 不换行
+ }
+ .wz {
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-size: 14px;
+ color: #ffffff;
+ line-height: 16px;
+ .left {
+ width: 70px;
+ height: 21px;
+ font-weight: 400;
+ opacity: 0.6;
+ }
+ .right {
+ width: 100px;
+ height: 21px;
+ font-weight: bold;
+ }
+ }
+ .close-wb {
+ display: flex;
+ margin-top: 10px;
+ text-align: center;
+ line-height: 16px;
+ .close {
+ width: 60px;
+ height: 20px;
+ line-height: 20px;
+ background: rgba(255, 178, 106, 0.2);
+ border-radius: 4px 4px 4px 4px;
+ border: 1px solid #ffb26a;
+ color: #ffb26a;
+ margin-right: 10px;
+ }
+ .other {
+ border: 1px solid #8effac;
+ color: #8effac;
+ }
+ .wb {
+ width: 60px;
+ height: 20px;
+ background: rgba(255, 106, 106, 0.2);
+ border-radius: 4px 4px 4px 4px;
+ border: 1px solid #ff6a6a;
+ color: #ff6a6a;
+ }
+ }
+ }
+ }
+ .status {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 10px 20px;
+ margin-top: 18px;
+ .card {
+ width: calc(33.33% - 14px);
+ }
+ img {
+ width: 16px;
+ height: 16px;
+ // margin-right: 0px;
+ // margin-top: 2px;
+ }
+ .text {
+ width: 56px;
+ height: 21px;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 400;
+ font-size: 14px;
+ color: #ffffff;
+ line-height: 16px;
+ }
+ .text-data {
+ // width: 40px;
+ margin-left: 20px;
+ height: 23px;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
+ font-size: 18px;
+ color: #0be5f5;
+ line-height: 21px;
+ }
+ }
+}
</style>
--
Gitblit v1.9.3