From b4ba7ef43a97b02a3af5bff339a66f3f6443fe0e Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Fri, 28 Mar 2025 17:09:39 +0800
Subject: [PATCH] feat:增加底部和右侧图
---
src/assets/images/home/homeLeft/tq.png | 0
src/layout/index.vue | 4 +
src/assets/images/home/homeLeft/table-icon.png | 0
src/assets/images/home/homeLeft/table-zx.png | 0
src/assets/images/chat.png | 0
src/assets/images/machine-nest.png | 0
src/views/Home/components/HomeLeft/HomeLeft.vue | 2
src/assets/images/orthophoto.png | 0
src/assets/images/chat-bottom.png | 0
src/assets/images/home/homeLeft/inspection-num.png | 0
src/assets/images/layer.png | 0
src/assets/images/3D.png | 0
src/assets/images/measuring-scale.png | 0
src/layout/Footer.vue | 56 ++++++++++++++++++
src/layout/Header.vue | 2
src/assets/images/home/homeLeft/next-num.png | 0
src/assets/images/cursor.png | 0
src/views/Home/components/HomeLeft/InspectionRaskDetails.vue | 2
src/assets/images/panorama.png | 0
src/assets/images/intelligent-introduction-flying.png | 0
/dev/null | 0
src/assets/images/self-positioning.png | 0
src/layout/RSide.vue | 82 +++++++++++++++++++++++++++
src/views/Home/components/HomeLeft/OverviewNext.vue | 6 +-
src/assets/images/event.png | 0
25 files changed, 148 insertions(+), 6 deletions(-)
diff --git a/src/assets/images/3D.png b/src/assets/images/3D.png
new file mode 100644
index 0000000..139d3c6
--- /dev/null
+++ b/src/assets/images/3D.png
Binary files differ
diff --git a/src/assets/images/bg-mc.png b/src/assets/images/bg-mc.png
deleted file mode 100644
index cdefe6e..0000000
--- a/src/assets/images/bg-mc.png
+++ /dev/null
Binary files differ
diff --git a/src/assets/images/bg.png b/src/assets/images/bg.png
deleted file mode 100644
index 95eb792..0000000
--- a/src/assets/images/bg.png
+++ /dev/null
Binary files differ
diff --git a/src/assets/images/chat-bottom.png b/src/assets/images/chat-bottom.png
new file mode 100644
index 0000000..c117107
--- /dev/null
+++ b/src/assets/images/chat-bottom.png
Binary files differ
diff --git a/src/assets/images/chat.png b/src/assets/images/chat.png
new file mode 100644
index 0000000..a5212ed
--- /dev/null
+++ b/src/assets/images/chat.png
Binary files differ
diff --git a/src/assets/images/cursor.png b/src/assets/images/cursor.png
new file mode 100644
index 0000000..37372fa
--- /dev/null
+++ b/src/assets/images/cursor.png
Binary files differ
diff --git a/src/assets/images/event.png b/src/assets/images/event.png
new file mode 100644
index 0000000..492d0d4
--- /dev/null
+++ b/src/assets/images/event.png
Binary files differ
diff --git a/src/assets/images/inspection-num.png b/src/assets/images/home/homeLeft/inspection-num.png
similarity index 100%
rename from src/assets/images/inspection-num.png
rename to src/assets/images/home/homeLeft/inspection-num.png
Binary files differ
diff --git a/src/assets/images/next-num.png b/src/assets/images/home/homeLeft/next-num.png
similarity index 100%
rename from src/assets/images/next-num.png
rename to src/assets/images/home/homeLeft/next-num.png
Binary files differ
diff --git a/src/assets/images/table-icon.png b/src/assets/images/home/homeLeft/table-icon.png
similarity index 100%
rename from src/assets/images/table-icon.png
rename to src/assets/images/home/homeLeft/table-icon.png
Binary files differ
diff --git a/src/assets/images/table-zx.png b/src/assets/images/home/homeLeft/table-zx.png
similarity index 100%
rename from src/assets/images/table-zx.png
rename to src/assets/images/home/homeLeft/table-zx.png
Binary files differ
diff --git a/src/assets/images/tq.png b/src/assets/images/home/homeLeft/tq.png
similarity index 100%
rename from src/assets/images/tq.png
rename to src/assets/images/home/homeLeft/tq.png
Binary files differ
diff --git a/src/assets/images/intelligent-introduction-flying.png b/src/assets/images/intelligent-introduction-flying.png
new file mode 100644
index 0000000..c1a1780
--- /dev/null
+++ b/src/assets/images/intelligent-introduction-flying.png
Binary files differ
diff --git a/src/assets/images/layer.png b/src/assets/images/layer.png
new file mode 100644
index 0000000..9f083f1
--- /dev/null
+++ b/src/assets/images/layer.png
Binary files differ
diff --git a/src/assets/images/machine-nest.png b/src/assets/images/machine-nest.png
new file mode 100644
index 0000000..774a92a
--- /dev/null
+++ b/src/assets/images/machine-nest.png
Binary files differ
diff --git a/src/assets/images/measuring-scale.png b/src/assets/images/measuring-scale.png
new file mode 100644
index 0000000..9b8c9b2
--- /dev/null
+++ b/src/assets/images/measuring-scale.png
Binary files differ
diff --git a/src/assets/images/orthophoto.png b/src/assets/images/orthophoto.png
new file mode 100644
index 0000000..08f02ac
--- /dev/null
+++ b/src/assets/images/orthophoto.png
Binary files differ
diff --git a/src/assets/images/panorama.png b/src/assets/images/panorama.png
new file mode 100644
index 0000000..2cd0a0a
--- /dev/null
+++ b/src/assets/images/panorama.png
Binary files differ
diff --git a/src/assets/images/self-positioning.png b/src/assets/images/self-positioning.png
new file mode 100644
index 0000000..710e22a
--- /dev/null
+++ b/src/assets/images/self-positioning.png
Binary files differ
diff --git "a/src/assets/images/\350\203\214\346\231\257\345\233\276@2x.png" "b/src/assets/images/\350\203\214\346\231\257\345\233\276@2x.png"
deleted file mode 100644
index 9c2014f..0000000
--- "a/src/assets/images/\350\203\214\346\231\257\345\233\276@2x.png"
+++ /dev/null
Binary files differ
diff --git a/src/layout/Footer.vue b/src/layout/Footer.vue
new file mode 100644
index 0000000..f7c8504
--- /dev/null
+++ b/src/layout/Footer.vue
@@ -0,0 +1,56 @@
+<template>
+ <div class="footer">
+ <img class="machine-nest" src="@/assets/images/machine-nest.png" alt="">
+ <img class="event" src="@/assets/images/event.png" alt="">
+ <img class="panorama" src="@/assets/images/panorama.png" alt="">
+ <img class="threeD" src="@/assets/images/3D.png" alt="">
+ <img class="orthophoto" src="@/assets/images/orthophoto.png" alt="">
+ </div>
+ <div class="intelligent-introduction-flying">
+ <img class="orthophoto" src="@/assets/images/intelligent-introduction-flying.png" alt="">
+ </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped lang="scss">
+ .footer {
+ position: absolute;
+ bottom: 84px;
+ left: 624px;
+ img {
+ width: 103px;
+ height: 119px;
+ }
+ .event {
+ position: relative;
+ left: 40px;
+ bottom: 15px;
+ }
+ .panorama {
+ position: relative;
+ left: 80px;
+ bottom: 34px;
+ }
+ .threeD {
+ position: relative;
+ left: 120px;
+ bottom: 15px;
+ }
+ .orthophoto {
+ position: relative;
+ left: 160px;
+ }
+ }
+ .intelligent-introduction-flying {
+ position: absolute;
+ left: 888px;
+ bottom: 23px;
+ img {
+ width: 146px;
+ height: 54px;
+ }
+ }
+</style>
\ No newline at end of file
diff --git a/src/layout/Header.vue b/src/layout/Header.vue
index 7a49c54..99e667b 100644
--- a/src/layout/Header.vue
+++ b/src/layout/Header.vue
@@ -24,7 +24,7 @@
.header {
width: calc(100% - 57px - 59px);
margin-left: 57px;
- padding-top: 38px;
+ padding-top: 30px;
display: flex;
justify-content: space-between;
// position: relative;
diff --git a/src/layout/RSide.vue b/src/layout/RSide.vue
new file mode 100644
index 0000000..ad43f52
--- /dev/null
+++ b/src/layout/RSide.vue
@@ -0,0 +1,82 @@
+<template>
+ <div class="ai-chat">
+ <img class="chat" src="@/assets/images/chat.png" alt="">
+ <img class="chat-bottom" src="@/assets/images/chat-bottom.png" alt="">
+ </div>
+ <div class="r-side">
+ <img class="positioning" src="@/assets/images/self-positioning.png" alt="" @mouseenter="enterHover(0)" @mouseleave="logIndex=3">
+ <img class="measuring-scale" src="@/assets/images/measuring-scale.png" alt="" @mouseenter="enterHover(1)" @mouseleave="logIndex=3">
+ <img class="layer" src="@/assets/images/layer.png" alt="" @mouseenter="enterHover(2)" @mouseleave="logIndex=3">
+ </div>
+ <div v-if="logIndex===0" class="r-side-positioning">切换地图模式</div>
+ <div v-if="logIndex===1" class="r-side-measuring">量尺</div>
+ <div v-if="logIndex===2" class="r-side-layer">返回当前位置</div>
+</template>
+
+<script setup>
+let logIndex = ref(3);
+const enterHover = (value) => {
+ logIndex.value = value;
+}
+</script>
+
+<style scoped lang="scss">
+.ai-chat {
+ position: absolute;
+ bottom: 309px;
+ right: 440px;
+ cursor: pointer;
+ img {
+ width: 100px;
+ height: 68px;
+ display: block;
+ };
+ .chat {
+ position: relative;
+ bottom: -50px;
+ height: 124px;
+ }
+}
+.r-side {
+ position: absolute;
+ bottom: 122px;
+ right: 463px;
+ cursor: pointer;
+ img {
+ display: block;
+ width: 48px;
+ height: 48px;
+ }
+ .positioning {
+ position: relative;
+ bottom: 24px;
+ }
+ .measuring-scale {
+ position: relative;
+ bottom: 12px;
+ }
+}
+.r-side-positioning, .r-side-measuring, .r-side-layer {
+ position: absolute;
+ right: 514px;
+ width: 130px;
+ height: 48px;
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 400;
+ font-size: 18px;
+ color: #FFFFFF;
+ line-height: 48px;
+ text-align: center;
+ background: url('@/assets/images/cursor.png');
+}
+.r-side-positioning {
+ bottom: 242px;
+}
+.r-side-measuring {
+ bottom: 182px;
+}
+.r-side-layer {
+ bottom: 122px;
+}
+
+</style>
\ No newline at end of file
diff --git a/src/layout/index.vue b/src/layout/index.vue
index d240e08..2d3b78f 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -4,6 +4,8 @@
<div class="page-index">
<Header />
<router-view></router-view>
+ <RSide />
+ <Footer />
</div>
</div>
</template>
@@ -12,6 +14,8 @@
import { onMounted } from 'vue';
import cesiumOperation from '@/utils/cesium-tsa';
import Header from './Header.vue';
+import Footer from './Footer.vue';
+import RSide from './RSide.vue';
const { _init } = cesiumOperation();
const narrowScreen = ref(false)
diff --git a/src/views/Home/components/HomeLeft/HomeLeft.vue b/src/views/Home/components/HomeLeft/HomeLeft.vue
index 9235761..48d86b4 100644
--- a/src/views/Home/components/HomeLeft/HomeLeft.vue
+++ b/src/views/Home/components/HomeLeft/HomeLeft.vue
@@ -5,7 +5,7 @@
<div class="time">{{ time }}</div>
<div class="line"></div>
<div class="weather">
- <img src="@/assets/images/tq.png" alt="" />
+ <img src="@/assets/images/home/homeLeft/tq.png" alt="" />
<span class="tq">阴天</span>
<span class="qk">适合飞行</span>
</div>
diff --git a/src/views/Home/components/HomeLeft/InspectionRaskDetails.vue b/src/views/Home/components/HomeLeft/InspectionRaskDetails.vue
index 860a5b2..6a75f93 100644
--- a/src/views/Home/components/HomeLeft/InspectionRaskDetails.vue
+++ b/src/views/Home/components/HomeLeft/InspectionRaskDetails.vue
@@ -171,7 +171,7 @@
border-radius: 0px 0px 0px 0px;
opacity: 0.85;
.inspection-num {
- background: url('@/assets/images/inspection-num.png') no-repeat center / 100% 100%;
+ background: url('@/assets/images/home/homeLeft/inspection-num.png') no-repeat center / 100% 100%;
width: 360px;
height: 118px;
position: relative;
diff --git a/src/views/Home/components/HomeLeft/OverviewNext.vue b/src/views/Home/components/HomeLeft/OverviewNext.vue
index af377ca..74e0a61 100644
--- a/src/views/Home/components/HomeLeft/OverviewNext.vue
+++ b/src/views/Home/components/HomeLeft/OverviewNext.vue
@@ -28,8 +28,8 @@
</div>
<div class="table-item" v-for="item in tableList">
<div class="name">
- <img class="yjzx-img" width="10" height="10" src="@/assets/images/table-zx.png" alt="" />
- <img width="13" height="15" src="@/assets/images/table-icon.png" alt="" />
+ <img class="yjzx-img" width="10" height="10" src="@/assets/images/home/homeLeft/table-zx.png" alt="" />
+ <img width="13" height="15" src="@/assets/images/home/homeLeft/table-icon.png" alt="" />
{{ item.name }}
</div>
<div class="status">{{ item.status }}</div>
@@ -78,7 +78,7 @@
.next-num {
width: 358px;
height: 92px;
- background: url(@/assets/images/next-num.png) no-repeat center / 100% 100%;
+ background: url(@/assets/images/home/homeLeft/next-num.png) no-repeat center / 100% 100%;
position: relative;
.total {
position: absolute;
--
Gitblit v1.9.3