From bdbef0fbde20317d19bfc6d3473dabb10fb3fb3b Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Sat, 19 Apr 2025 15:41:21 +0800
Subject: [PATCH] feat: 修改任务事件概况的饼状图颜色
---
src/views/SignMachineNest/MachineRight/MachineMonitor.vue | 114 ++++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 76 insertions(+), 38 deletions(-)
diff --git a/src/views/SignMachineNest/MachineRight/MachineMonitor.vue b/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
index 5c8d29e..8f44c2f 100644
--- a/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
+++ b/src/views/SignMachineNest/MachineRight/MachineMonitor.vue
@@ -1,52 +1,90 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2025-04-15 17:19:35
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2025-04-17 21:16:50
+ * @FilePath: \command-center-dashboard\src\views\SignMachineNest\MachineRight\MachineMonitor.vue
+ * @Description:
+ *
+ * Copyright (c) 2025 by shuishen, All Rights Reserved.
+-->
<!-- 机巢监控 -->
<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">
+ <LiveVideo :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 singleUavHome = computed(() => store.state.home.singleUavHome)
// 直播地址
-let airPortUrl = ref('');
+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;
- });
-};
+const getVideoUrl = (sn, quality) => {
+ liveStart(sn, quality).then(res => {
+ if (res.data.code !== 0) return
+ airPortUrl.value = res.data.data.rtcs_url
+ })
+}
+let isCurrentSn = ref(false)
+let CurrentSn = ref('')
+// 监听ws消息
+watch(
+ () => store.state.home.deviceState.deviceInfo,
+ newValue => {
+ CurrentSn.value = Object.keys(newValue)[0]
+ const currentDevice = newValue[CurrentSn.value]
+ if (currentDevice && currentDevice?.mode_code > 0) {
+ isCurrentSn.value = true
+ } else if (currentDevice && currentDevice?.mode_code === 14) {
+ isCurrentSn.value = false
+ } else {
+ isCurrentSn.value = false
+ }
+ },
+ {
+ immediate: true,
+ deep: true,
+ }
+)
+// 监听 isCurrentSn
+watch(
+ isCurrentSn,
+ newVal => {
+ if (newVal) {
+ getVideoUrl(CurrentSn.value, 2)
+ } else {
+ getVideoUrl(singleUavHome.value.device_sn, 1)
+ }
+ },
+ { immediate: true, deep: true }
+)
+
onMounted(() => {
- getVideoUrl();
-});
+ // getVideoUrl(singleUavHome.value.device_sn,1);
+})
</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;
+ // margin: 2px 0 13 0;
+ display: flex;
+ justify-content: space-between;
+ padding: 10px 10px;
+}
+</style>
--
Gitblit v1.9.3