From 744f3b89a2ed8832f669f322ace820d65cba33fc Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Fri, 13 Oct 2023 10:25:40 +0800
Subject: [PATCH] 调整表格宽度

---
 src/components/GMap.vue |   80 ++++++++++++++++++++++++++--------------
 1 files changed, 52 insertions(+), 28 deletions(-)

diff --git a/src/components/GMap.vue b/src/components/GMap.vue
index 476dd41..693bfce 100644
--- a/src/components/GMap.vue
+++ b/src/components/GMap.vue
@@ -300,8 +300,8 @@
                 </a-col>
                 <a-col span="2"></a-col>
                 <a-col span="8">
-                  <a-button :class="[showOption ? 'active-color' : 'unactive-color']" class="width-100" type="primary"
-                    :disabled="dockControlPanelVisible" size="small" @click="openFlySetting">
+                  <a-button :class="[airPortOption ? 'active-color' : 'unactive-color']" class="width-100" type="primary"
+                     size="small" @click="openFlySetting">
                     操作
                   </a-button>
                 </a-col>
@@ -443,13 +443,15 @@
         <div class="osd flex-1">
           <a-row class="mr-20" align="middle">
             <a-col span="9"
-              :style="!deviceInfo.device || deviceInfo.device?.mode_code === EModeCode.Disconnected ? 'color: red; font-weight: 700;' : 'color: rgb(25,190,107)'">
-              {{ !deviceInfo.device ? EModeText[EModeCode.Disconnected] : EModeText[deviceInfo.device?.mode_code]
+              :style="deviceInfo.device || deviceInfo.device?.mode_code !== EModeCode.Disconnected ? 'color: rgb(25,190,107)' : deviceInfo.dock.basic_osd?.drone_in_dock === 0 ?'color: red; font-weight: 700;': '' ">
+              <!-- DroneInDockEnum[deviceInfo.dock.basic_osd?.drone_in_dock] -->
+              {{ deviceInfo.device ? EModeText[deviceInfo.device?.mode_code] : (deviceInfo.dock.basic_osd?.drone_in_dock === 1) ? '舱内关机' : EModeText[EModeCode.Disconnected]
               }}</a-col>
             <a-col span="15">
-              <a-select :showArrow="false" v-model:value="aircraSelected" :bordered="false" :options="aircraftList"
-                :placeholder="aircraftList.length == 0 || deviceInfo.device?.mode_code == 14 || !deviceInfo.device ? 'N/A' : '请选择'" :disabled="aircraftList.length == 0 ? true : false"
-                size="small" style="width:100%;background-color: #5d5f61;color: #fff;" @change="selectChange"></a-select>
+              <div style="width:100%;padding:0 5px;background-color: #5d5f61;color: #fff;font-size: 10px;">{{deviceInfo.device?.mode_code == 14 || !deviceInfo.device ? 'N/A' : '当前正常'}}</div>
+              <!-- <a-select :showArrow="false" v-model:value="aircraSelected" :bordered="false" :options="aircraftList"
+                :placeholder="aircraftList.length == 0 ? 'N/A' : '请选择'" :disabled="aircraftList.length == 0 ? true : false"
+                size="small" style="width:100%;background-color: #5d5f61;color: #fff;" @change="selectChange"></a-select> -->
             </a-col>
           </a-row>
           <a-row align="middle" justify="center">
@@ -458,15 +460,22 @@
                 class="flex-display flex-justify-center mt5 mb5">当前设备已关机,无法进行直播</div>
             </a-col>
           </a-row>
-          <a-row class="p5" align="middle" justify="space-between">
+          <a-row class="p5" v-if="deviceInfo.device?.mode_code != 14 && deviceInfo.device"  align="middle" justify="space-between">
             <a-col span="11">
-              <a-button :disabled="deviceInfo.device?.mode_code == 14 || !deviceInfo.device ? true : false"
-                :class="[showAircraft ? 'active-color' : 'unactive-color']" class="width-100" type="primary" size="small"
-                @click="openAircra">
-                监控
+              <a-button :class="[aircrafIndex === 0 ? 'active-color' : 'unactive-color']" class="width-100" type="primary" size="small"
+                @click="openAircra(0)">
+                飞行相机
               </a-button>
             </a-col>
             <a-col span="11">
+              <a-button :class="[aircrafIndex === 1 ? 'active-color' : 'unactive-color']" class="width-100" type="primary"
+                size="small" @click="openAircra(1)">
+                M30T相机
+              </a-button>
+            </a-col>
+          </a-row>
+          <a-row v-if="deviceInfo.device?.mode_code != 14 && deviceInfo.device" class="p5" align="middle" justify="space-between">
+            <a-col span="24">
               <a-button :class="[openDroneControl ? 'active-color' : 'unactive-color']" class="width-100" type="primary"
                 size="small" @click="openDeviceSetting">
                 操作
@@ -607,7 +616,7 @@
               </a-tooltip>
             </a-col>
           </a-row> -->
-        <!-- <a-row align="middle">
+        <a-row align="middle">
           <a-col span="6" class="flex-row flex-align-center flex-justify-start">
             <a-tooltip title="飞行模式">
               <span>
@@ -663,7 +672,7 @@
                 deviceInfo.device?.vertical_speed.toFixed(2) + ' m/s' }}</span>
             </a-tooltip>
           </a-col>
-        </a-row> -->
+        </a-row>
       </div>
       <!-- 飞行控制 -->
       <!-- <div class="fly-control flex-display">
@@ -776,12 +785,11 @@
     const root = getRoot()
     // 监控显示
     const showMonitor = ref(false)
-    // 操作显示
-    const showOption = ref(false)
     const mouseMode = ref(false)
     const store = useMyStore()
     // 机场直播地址
     const airPortUrl = ref('')
+    const airPortOption = ref(false)
     // 设备列表
     const droneList = ref()
     // 设备相机
@@ -799,7 +807,8 @@
     const showAircraft = ref(false)
     // 飞机视频列表
     const aircraftList = ref([])
-    const aircraSelected = ref('')
+    const aircraSelected = ref(undefined)
+    const aircrafIndex = ref(-1)
     const state = reactive({
       currentType: '',
       coverIndex: 0
@@ -873,10 +882,17 @@
       }
     }
     // 打开飞机监控
-    const openAircra = () => {
+    const openAircra = (type: number) => {
       showAircraft.value = !showAircraft.value
+      if (type === aircrafIndex.value) {
+        showAircraft.value = false
+        aircrafIndex.value = -1
+      } else {
+        showAircraft.value = true
+        aircrafIndex.value = type
+      }
       if (showAircraft.value) {
-        loadDroneVideo()
+        loadDroneVideo(type)
       } else {
         closeFly()
       }
@@ -930,7 +946,7 @@
         })
     }
     // 加载无人机的视频信息
-    const loadDroneVideo = async () => {
+    const loadDroneVideo = async (index: number) => {
       aircraftList.value = []
       await getLiveCapacity({ id: store.state.common.projectId })
         .then(res => {
@@ -939,7 +955,6 @@
               console.warn('warning: get live capacity is null!!!')
               return
             }
-            const resData: Array<[]> = res.data
             const drone = res.data.find(v => v.sn === deviceInfo.dock.basic_osd.sub_device?.device_sn)
             const temp: Array<SelectOption> = []
             if (drone) {
@@ -955,7 +970,7 @@
                   vadeosList: v.videos_list
                 }
               })
-              aircraSelected.value = aircraftList.value[0].value
+              aircraSelected.value = aircraftList.value[index].value
               flyOnStart()
             } else {
               showAircraft.value = false
@@ -1024,6 +1039,7 @@
       const videoId = deviceInfo.dock.basic_osd?.sub_device?.device_sn + '/' + aircraSelected.value + '/' + 'normal-0'
       const streamId = deviceInfo.dock.basic_osd?.sub_device?.device_sn + '-' + aircraSelected.value + '-' + 'normal-0'
       const liveURL = config.rtmpURL + streamId
+      console.log('飞机设备播放事件触发')
       await startLivestream({
         url: liveURL,
         video_id: videoId,
@@ -1056,11 +1072,17 @@
     // 打开机场操作
     const openFlySetting = () => {
       openDroneControl.value = false
-      setDockControlPanelVisible(true)
+      airPortOption.value = !airPortOption.value
+      if (airPortOption.value) {
+        setDockControlPanelVisible(true)
+      } else {
+        setDockControlPanelVisible(false)
+      }
     }
     // 打开无人机操作
     const openDeviceSetting = () => {
       setDockControlPanelVisible(false)
+      airPortOption.value = false
       openDroneControl.value = !openDroneControl.value
     }
     watch(() => store.state.deviceStatusEvent,
@@ -1102,7 +1124,7 @@
       aircraftUrl.value = ''
       showAircraft.value = false
       aircraftList.value = []
-      aircraSelected.value = ''
+      aircraSelected.value = undefined
       airPortUrl.value = ''
       droneList.value = []
       if (deviceInfo.dock.basic_osd?.mode_code === 2) {
@@ -1181,6 +1203,7 @@
     } = useDockControl()
     // 关闭设备控制方法
     const closeOperate = (sn: string) => {
+      airPortOption.value = false
       if (deviceInfo.dock.basic_osd?.mode_code === 2) {
         onCloseControlPanel(sn)
       } else {
@@ -1374,7 +1397,6 @@
       hmsInfo,
       sn,
       showMonitor,
-      showOption,
       airPortUrl,
       openMonitor,
       droneIndex,
@@ -1390,7 +1412,9 @@
       openFlySetting,
       openDeviceSetting,
       airTimeout,
-      flyTimeout
+      flyTimeout,
+      aircrafIndex,
+      airPortOption
     }
   }
 })
@@ -1441,10 +1465,10 @@
   left: 10px;
   top: 10px;
   width: 480px;
-  background: #000;
+  background-color: #232323;
   color: #fff;
   border-radius: 2px;
-  opacity: 0.8;
+  // opacity: 0.8;
 }
 
 .overflow {

--
Gitblit v1.9.3