完善机场详情

Web/src/api/custom/index.ts

@@ -88,7 +88,7 @@ export type FetchPilotPasswordApiParams = {
 };
 
 // Api函数类型
-export type FetchDeviceLogListApi = (sn: string, params: { domain_list: number }) => Promise<any>;
+export type FetchDeviceLogListApi = (sn: string, params: { domain_list: string }) => Promise<any>;
 export type CreateDeviceFeedbackApi = (sn: string, data: CreateDeviceFeedbackApiParams) => Promise<any>;
 export type SignLoginApi = (data: SignLoginApiParams) => Promise<any>;
 export type FetchDeviceModelApi = (params?: { flg: boolean }) => Promise<any>;

Web/src/components/GMap.vue

@@ -91,7 +91,6 @@ export default defineComponent({
     DeviceOsdInfoModal,
   },
   name: 'GMap',
-  props: {},
   setup() {
     const useMouseToolHook = useMouseTool()
     const useGMapManageHook = useGMapManage()

Web/src/components/airport/components/InfoModal.vue

@@ -1,23 +1,30 @@
 <template>
-  <div v-drag-window class="osd-panel fz12">
-    <div class="drag-title fz16 pl5 pr5 flex-align-center flex-row flex-justify-between"
-      style="border-bottom: 1px solid #515151; height: 10%;">
-      <span>{{ osdInfo.gateway_callsign }}</span>
-    </div>
-    <span>
-      <a style="color: white; position: absolute; top: 5px; right: 5px;" @click="() => osdInfo.visible = false">
+  <div v-drag-window class="content">
+    <div class="content-title">
+      <div class="drag-title">
+        <div class="content-title-left">
+          <img class="content-title-left-icon" :src="taskSrc">
+          <div>
+            无任务
+          </div>
+        </div>
+      </div>
+      <div>
+        <span>{{ osdInfo.gateway_callsign }}</span>
+      </div>
+      <a class="fz16" style="color: white;" @click="() => osdInfo.visible = false">
         <CloseOutlined />
       </a>
-    </span>
+    </div>
     <!-- 机场 -->
-    <div class="flex-display" style="border-bottom: 1px solid #515151;">
-      <div class="flex-column flex-align-stretch flex-justify-center" style="width: 60px; background: #2d2d2d;">
-        <a-tooltip :title="osdInfo.model">
-          <div class="flex-column  flex-align-center flex-justify-center" style="width: 90%;">
-            <span>
-              <RobotFilled style="font-size: 48px;" />
-            </span>
-            <span class="mt10">Dock</span>
+    <div class="content-dock">
+      <div class="content-dock-left">
+        <div class="content-dock-left-image">
+          <a-image :src="dock2Src" :preview="false" />
+        </div>
+        <a-tooltip title="Dock 2">
+          <div class="content-dock-left-image-text">
+            Dock 2
           </div>
         </a-tooltip>
       </div>
@@ -172,12 +179,15 @@
       </div>
     </div>
     <!--  飞机-->
-    <div class="flex-display">
-      <div class="flex-column flex-align-stretch flex-justify-center" style="width: 60px;  background: #2d2d2d;">
+    <div class="content-aircraft">
+      <div class="content-dock-left">
+        <div class="content-dock-left-image">
+          <a-image :src="M3tdSrc" :preview="false" v-if="osdInfo.model === 'M3TD'" />
+          <a-image :src="M30Src" :preview="false" v-else />
+        </div>
         <a-tooltip :title="osdInfo.model">
-          <div style="width: 90%;" class="flex-column flex-align-center flex-justify-center">
-            <span><a-image :src="M30Src" :preview="false" /></span>
-            <span>M30</span>
+          <div class="content-dock-left-image-text">
+            {{ osdInfo.model }}
           </div>
         </a-tooltip>
       </div>
@@ -331,21 +341,23 @@
     <DockControlPanel v-if="dockControlPanelVisible" :sn="osdInfo.gateway_sn" :deviceInfo="deviceInfo"
       @close-control-panel="onCloseControlPanel" />
     <!-- 飞行指令 -->
-    <DroneControlPanel :sn="osdInfo.gateway_sn" :deviceInfo="deviceInfo" :payloads="osdInfo.payloads" />
+    <!-- <DroneControlPanel :sn="osdInfo.gateway_sn" :deviceInfo="deviceInfo" :payloads="osdInfo.payloads" /> -->
   </div>
 </template>
 
 <script lang="ts" setup>
-import { h, computed, reactive, onMounted } from 'vue';
+import { computed, reactive, onMounted } from 'vue';
 import { message } from 'ant-design-vue';
 import {
-  BorderOutlined, LineOutlined, CloseOutlined, AimOutlined, ControlOutlined, TrademarkOutlined, ArrowDownOutlined,
+  CloseOutlined, ControlOutlined, TrademarkOutlined, ArrowDownOutlined,
   ThunderboltOutlined, SignalFilled, GlobalOutlined, HistoryOutlined, CloudUploadOutlined, RocketOutlined,
-  FieldTimeOutlined, CloudOutlined, CloudFilled, FolderOpenOutlined, RobotFilled, ArrowUpOutlined, CarryOutOutlined
+  FieldTimeOutlined, FolderOpenOutlined, ArrowUpOutlined, CarryOutOutlined
 } from '@ant-design/icons-vue'
-
 import LivePlayer from '/@/components/livePlayer/index.vue';
-import M30Src from '/@/assets/icons/m30.png';
+import taskSrc from '../icons/info/task.svg';
+import dock2Src from '../icons/info/dock2.png';
+import M30Src from '../icons/info/m30.png';
+import M3tdSrc from '../icons/info/m3td.png';
 import controllerSrc from '../icons/info/controller.svg';
 import controllerErrorSrc from '../icons/info/controllerError.svg';
 import networkSrc from '../icons/info/network.svg';
@@ -382,22 +394,19 @@ const props = withDefaults(defineProps<Props>(), {
 
 });
 
-// dock 控制面板
-const {
-  dockControlPanelVisible,
-  setDockControlPanelVisible,
-  onCloseControlPanel,
-} = useDockControl()
+// 机场控制面板
+const { dockControlPanelVisible, setDockControlPanelVisible, onCloseControlPanel } = useDockControl()
 
 // 遥控器信号
 const controllerSignal = computed(() => {
-  const info = props.deviceInfo.gateway;
-  if (info && info.wireless_link) {
-    return info.wireless_link['4g_gnd_quality'];
-  } else {
-    return 0;
-  }
+  // const info = props.deviceInfo.gateway;
+  // if (info && info.wireless_link) {
+  //   return info.wireless_link['4g_gnd_quality'];
+  // } else {
+  //   return 0;
+  // }
 });
+console.log(props.osdInfo, 'dev');
 
 // 飞机信号
 const aircraftSignal = computed(() => {
@@ -569,6 +578,95 @@ const onStop = async () => {
 </script>
 
 <style lang="scss" scoped>
+.content {
+  width: 420px;
+  color: #fff;
+  border-radius: 4px;
+  overflow: visible;
+  background-color: #232323;
+  position: absolute;
+  left: 10px;
+  top: 10px;
+
+  &-title {
+    width: 100%;
+    height: 40px;
+    padding-right: 5px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #535759;
+
+    &-left {
+      width: 80px;
+      height: 40px;
+      padding-left: 5px;
+      background: #4a4d4e;
+      display: flex;
+      align-items: center;
+
+      &-icon {
+        width: 20px;
+        height: 20px;
+        margin-right: 5px;
+      }
+    }
+  }
+
+  &-dock {
+    display: flex;
+    border-bottom: 1px solid #535759;
+    position: relative;
+
+    &-left {
+      width: 80px;
+      padding: 5px;
+      background: #3d3d3d;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      &-image {
+        width: 80%;
+        margin-bottom: 10px;
+      }
+
+      &-text {
+        text-align: center;
+        white-space: nowrap;
+        overflow: hidden;
+      }
+    }
+  }
+
+  &-aircraft {
+    display: flex;
+    border-bottom: 1px solid #535759;
+
+    &-left {
+      width: 80px;
+      padding: 5px;
+      background: #3d3d3d;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      &-image {
+        width: 80%;
+        margin-bottom: 10px;
+      }
+
+      &-text {
+        text-align: center;
+        white-space: nowrap;
+        overflow: hidden;
+      }
+    }
+  }
+}
+
 .osd-panel {
   position: absolute;
   margin-left: 10px;

Web/src/components/devices/deviceList/components/FeedbackCreateModal.vue

@@ -134,23 +134,19 @@ const state: State = reactive({
     droneLogList: [],
 });
 
-const fetchAirportLogList = async () => {
+const fetchList = async () => {
     state.listLoading = true;
     try {
-        const res = await apis.fetchDeviceLogList(props.sn, { domain_list: 3 });
-        state.airportLogList = res.data.files[0].list;
-    } catch (error) {
-        console.error(error);
-    } finally {
-        state.listLoading = false;
-    }
-}
-
-const fetchDroneLogList = async () => {
-    state.listLoading = true;
-    try {
-        const res = await apis.fetchDeviceLogList(props.sn, { domain_list: 0 });
-        state.droneLogList = res.data.files[0].list;
+        const res = await apis.fetchDeviceLogList(props.sn, { domain_list: '0,3' });
+        const files = res.data.files;
+        const airportLog = files.find((item: any) => item.module === '3');
+        if (airportLog) {
+            state.airportLogList = airportLog.list;
+        }
+        const droneLog = files.find((item: any) => item.module === '0');
+        if (droneLog) {
+            state.droneLogList = droneLog.list;
+        }
     } catch (error) {
         console.error(error);
     } finally {
@@ -171,10 +167,7 @@ const getLogSize = (size: number) => {
 };
 
 onMounted(async () => {
-    await Promise.all([
-        fetchAirportLogList(),
-        fetchDroneLogList(),
-    ]);
+    await fetchList();
 })
 
 const handleChangeUpload = (info: any) => {

Web/src/components/onLineDevice/components/InfoModal.vue

@@ -44,13 +44,13 @@
           </div>
           <div class="content-osd-head-right-select">
             <div v-if="state.deviceLiveStatus">
-              <a-select style="width: 130px;margin-right: 5px;" placeholder="摄像头" v-model:value="state.cameraValue">
+              <a-select style="width: 125px;margin-right: 5px;" placeholder="摄像头" v-model:value="state.cameraValue">
                 <a-select-option v-for="item in state.cameraList" :key="item.value" :value="item.value"
                   @click="onCameraSelect(item)">
                   {{ item.label }}
                 </a-select-option>
               </a-select>
-              <a-select style="width: 130px;margin-right: 5px;" placeholder="清晰度" v-model:value="state.clarityValue"
+              <a-select style="width: 125px;margin-right: 5px;" placeholder="清晰度" v-model:value="state.clarityValue"
                 @select="onClaritySelect">
                 <a-select-option v-for="item in clarityList" :key="item.value" :value="item.value">
                   {{ item.label }}
@@ -204,7 +204,7 @@ import { h, computed, reactive, onMounted } from 'vue';
 import { message } from 'ant-design-vue';
 import { CloseOutlined, PlaySquareOutlined, PoweroffOutlined } from '@ant-design/icons-vue'
 import LivePlayer from '/@/components/livePlayer/index.vue';
-import M30Src from '/@/assets/icons/m30.png';
+import M30Src from '../icons/info/m30.png';
 import controllerSrc from '../icons/info/controller.svg';
 import controllerErrorSrc from '../icons/info/controllerError.svg';
 import networkSrc from '../icons/info/network.svg';
@@ -471,14 +471,14 @@ const onStop = async () => {
   width: 420px;
   color: #fff;
   border-radius: 4px;
-  overflow: hidden;
-  // background-color: rgba(0, 0, 0, 0.8);
   background-color: #232323;
   position: absolute;
   left: 10px;
   top: 10px;
 
   &-title {
+    width: 100%;
+    height: 40px;
     padding: 5px;
     display: flex;
     justify-content: space-between;
@@ -513,7 +513,7 @@ const onStop = async () => {
       }
 
       &-right {
-        width: 100%;
+        flex: 1;
         padding: 5px;
 
         &-top {