1

src/main.ts

@@ -61,6 +61,7 @@ ElDialog.props.closeOnClickModal.default = false;*/
 // **main.js**
 import { vue3ScrollSeamless } from 'vue3-scroll-seamless';
 import bus from './utils/bus';
+import $message from '@/plugins/modal';
 
 const app = createApp(App);
 
@@ -80,3 +81,4 @@ directive(app);
 app.mount('#app');
 
 app.config.globalProperties.mittBus = mitt();
+app.config.globalProperties.$message = $message;

src/plugins/modal.ts

@@ -18,6 +18,18 @@ export default {
   msgWarning(content: any) {
     ElMessage.warning(content);
   },
+  // 警告消息
+  warning(content: any) {
+    ElMessage.warning(content);
+  },
+  // 错误消息
+  error(content: any) {
+    ElMessage.error(content);
+  },
+  // 成功消息
+  success(content: any) {
+    ElMessage.success(content);
+  },
   // 弹出提示
   alert(content: any) {
     ElMessageBox.alert(content, '系统提示');
@@ -34,6 +46,7 @@ export default {
   alertWarning(content: any) {
     ElMessageBox.alert(content, '系统提示', { type: 'warning' });
   },
+
   // 通知提示
   notify(content: any) {
     ElNotification.info(content);

src/views/drone/components/bottomTabs/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="bottom_tabs flex ai_center center">
-    <div v-for="item in tabs" class="item " :class="{ active: item.id == selectId }" @click="select(item)">
+    <div v-for="item in tabs" class="item" :class="{ active: item.id == selectId }" @click="select(item)">
       <div class="text" :class="{ active: item.id == selectId }">
         {{ item.label }}
       </div>
@@ -9,43 +9,45 @@
 </template>
 
 <script>
+import $modal from '@/plugins/modal';
+
 export default {
   data() {
     return {
       tabs: [
         {
-          label: "无人机",
-          id: 1,
+          label: '无人机',
+          id: 1
         },
         {
-          label: "航线库",
-          id: 2,
+          label: '航线库',
+          id: 2
         },
         {
-          label: "计划库",
-          id: 3,
+          label: '计划库',
+          id: 3
         },
         {
-          label: "媒体库",
-          id: 4,
-        },
+          label: '媒体库',
+          id: 4
+        }
       ],
-      selectId: 1,
+      selectId: 1
     };
   },
-  created() { },
-  mounted() { },
+  created() {},
+  mounted() {},
   methods: {
     select(item) {
-      let airGateway = JSON.parse(localStorage.getItem('airGateway'))
+      let airGateway = JSON.parse(localStorage.getItem('airGateway'));
       if (!airGateway) {
-        this.$message.warning("请先选择无人机");
+        $modal.msgWarning('请先选择无人机');
         return;
       }
       this.selectId = item.id;
-      this.$emit("select", item);
-    },
-  },
+      this.$emit('select', item);
+    }
+  }
 };
 </script>
 <style lang="scss" scoped>
@@ -64,18 +66,15 @@ export default {
     width: 136px;
     height: 40px;
     line-height: 45px;
-    background: url("../../images/tab.png");
+    background: url('../../images/tab.png');
     background-size: cover;
-    font-family: "alimamashuheiti";
+    font-family: 'alimamashuheiti';
     text-align: center;
     color: aliceblue;
     cursor: pointer;
 
     .text {
-      background: linear-gradient(180deg,
-          #ffffff,
-          #efffff,
-          #00ffff);
+      background: linear-gradient(180deg, #ffffff, #efffff, #00ffff);
       /* 标准语法 */
       -webkit-background-clip: text;
       /* Chrome, Safari */
@@ -88,10 +87,7 @@ export default {
 
     .text:hover,
     .active {
-      background: linear-gradient(180deg,
-          #ffffff,
-          #fff8eb,
-          #ffa600);
+      background: linear-gradient(180deg, #ffffff, #fff8eb, #ffa600);
       /* 标准语法 */
       -webkit-background-clip: text;
       /* Chrome, Safari */
@@ -105,7 +101,7 @@ export default {
 
   .item:hover,
   .active {
-    background: url("../../images/tab_h.png");
+    background: url('../../images/tab_h.png');
     background-size: cover;
   }
 
@@ -118,13 +114,13 @@ export default {
     opacity: 0;
     transition: opacity 0.3s ease;
     transform: translate(-50%);
-    content: "";
+    content: '';
     display: block;
     width: 22px;
     /* 设置图片宽度 */
     height: 16px;
     /* 设置图片高度 */
-    background-image: url("../../images/hover.png");
+    background-image: url('../../images/hover.png');
     /* 设置图片路径 */
     background-size: cover;
     /* 背景图片覆盖整个元素 */

src/views/drone/components/home/components/AircraftMonitoringLiveBroadcast/index.vue

@@ -295,6 +295,8 @@ export default {
       // 判断是否选择无人机
       let airGateway = JSON.parse(localStorage.getItem('airGateway'));
       if (!airGateway) {
+        console.log(this.$message);
+
         this.$message.warning('请先选择无人机');
         return;
       }

src/views/drone/components/home/components/MonitorLiveStreaming/index.vue

@@ -412,7 +412,8 @@ export default {
     visibleDropdown(flag) {
       this.time1 = setTimeout(() => {
         if (document.querySelector('.el-dropdown-menu')) {
-          this.$refs.monitorLiveVideo.appendChild(document.querySelectorAll('.el-dropdown-menu')[1]);
+          console.log(document.querySelectorAll('.el-dropdown-menu')[0]);
+
           this.$refs.monitorLiveVideo.appendChild(document.querySelectorAll('.el-dropdown-menu')[0]);
         }
       }, 200);

src/views/drone/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="UAVhome">
-    <div class="fly_heard" style="position: fixed; top: 0; left: 0">
+    <div class="fly_heard" style="position: fixed; top: 0; left: 0; z-index: 2">
       <img src="./images/head.png" alt="" />
       <div class="setFlyer">
         <el-dropdown placement="bottom">