This commit is contained in:
Teo
2025-05-16 18:50:17 +08:00
parent 3e67c83ced
commit eaa4a02790
6 changed files with 47 additions and 33 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="UAVhome"> <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="" /> <img src="./images/head.png" alt="" />
<div class="setFlyer"> <div class="setFlyer">
<el-dropdown placement="bottom"> <el-dropdown placement="bottom">