From 07360ad073b3fd82da76b7740cafc25518ca3e15 Mon Sep 17 00:00:00 2001
From: zhongrj <646384940@qq.com>
Date: Mon, 21 Apr 2025 15:51:04 +0800
Subject: [PATCH] 打包配置修改
---
src/views/SignMachineNest/MachineRight/MachineMonitor.vue | 122 +++++++++++++++++++++++++++-------------
1 files changed, 83 insertions(+), 39 deletions(-)
diff --git a/src/views/SignMachineNest/MachineRight/MachineMonitor.vue b/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
index 5c8d29e..f689391 100644
--- a/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
+++ b/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
@@ -1,52 +1,96 @@
-<!-- 机巢监控 -->
+<!-- 直播监控 -->
<template>
- <CommonTitle title="机巢监控" />
- <div :style="{ marginLeft: pxToRem(14) }">
- <div class="machine-monitor">
- <LiveVideo :videoUrl="airPortUrl" />
- </div>
- </div>
+ <CommonTitle title="直播监控" />
+ <div :style="{ marginLeft: pxToRem(14) }">
+ <div class="machine-monitor">
+ <div v-if="singleUavHome.status === 'OFFLINE'" class="off-line">
+ <span>当前设备已关机,无法进行直播</span>
+ </div>
+ <LiveVideo v-else :videoUrl="airPortUrl" />
+ </div>
+ </div>
</template>
<script setup>
-import CommonTitle from '@/components/CommonTitle.vue';
-import LiveVideo from '@/components/LiveVideo.vue';
-import { liveStart } from '@/api/home/machineNest';
+import CommonTitle from '@/components/CommonTitle.vue'
+import LiveVideo from '@/components/LiveVideo.vue'
+import { liveStart } from '@/api/home/machineNest'
// import { CURRENT_CONFIG as config } from '@/utils/http/config'
-import { useStore } from 'vuex';
+import { useStore } from 'vuex'
-
-const store = useStore();
+const store = useStore()
// 单个机巢信息
const singleUavHome = computed(() => store.state.home.singleUavHome);
+const osdVisible = computed(() => store.state.home.osdVisible);
// 直播地址
-let airPortUrl = ref('');
-// 获取直播地址
-const getVideoUrl = () => {
- liveStart(singleUavHome.value.device_sn).then(res => {
- if (res.data.code !== 0) return;
- airPortUrl.value = res.data.data.rtcs_url;
- });
-};
+let airPortUrl = ref('')
+// 获取机巢直播地址
+const getVideoUrl = (sn, quality) => {
+ if (singleUavHome.value.status === 'OFFLINE') return;
+ liveStart(sn, quality).then(res => {
+ if (res.data.code !== 0) return
+ airPortUrl.value = res.data.data.rtcs_url
+ })
+}
+
+// 获取无人机直播url
+async function getDroneLiveUrl(sn, quality) {
+ airPortUrl.value = ''
+ await nextTick()
+ const res = await liveStart(sn, quality)
+ airPortUrl.value = res.data.data.rtcs_url
+}
+
+const isTakeOff = ref(false)
+// 监听ws消息
+watch(() => store.state.home.deviceState, async (newValue) => {
+ console.log(osdVisible.value.sn,'333333')
+ const deviceInfo = newValue?.deviceInfo[osdVisible.value.sn]
+ if (!deviceInfo) return
+
+ const currentIsTakeOff = ![14, 0].includes(deviceInfo?.mode_code)
+ console.log(isTakeOff.value, currentIsTakeOff,'8888')
+ // 如果还是之前的状态,不切换
+ if (isTakeOff.value === currentIsTakeOff) return
+ isTakeOff.value = currentIsTakeOff
+ isTakeOff.value ? await getDroneLiveUrl(osdVisible.value.sn, 2) : await getVideoUrl(singleUavHome.value.device_sn, 1)
+ },
+ {
+ immediate: true,
+ deep: true,
+ }
+)
+
onMounted(() => {
- getVideoUrl();
-});
+ getVideoUrl(singleUavHome.value.device_sn, 1)
+})
+onUnmounted(() => {
+ airPortUrl.value = ''
+})
</script>
<style lang="scss" scoped>
- .machine-monitor {
- width: 390px;
- height: 228px;
- 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;
- display: flex;
- justify-content: space-between;
- padding: 12px 10px 0;
- }
-</style>
\ No newline at end of file
+.machine-monitor {
+ width: 390px;
+ height: 228px;
+ background: linear-gradient(270deg, #1f3e7a 0%, rgba(31, 62, 122, 0.35) 79%, rgba(31, 62, 122, 0) 100%);
+ opacity: 0.85;
+ display: flex;
+ justify-content: space-between;
+ padding: 10px 10px;
+ .off-line {
+ position: relative;
+ width: 100%;
+ height: 100%;
+ background: url(@/assets/images/offLine.png) no-repeat center / 100% 100%;
+ color: #EDEDED;
+ font-size: 16px;
+ span {
+ position: absolute;
+ text-align: center;
+ bottom: 20px;
+ left: 20%;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3