From 208f09ade28eeb3a2111f5f198c2e1ef84ec8069 Mon Sep 17 00:00:00 2001
From: 584911253@qq.com <584911253@qq.com>
Date: 星期三, 22 三月 2023 19:37:38 +0800
Subject: [PATCH] 页面修改
---
src/assets/img/menu/en.png | 0
src/assets/img/terrain.png | 0
src/assets/img/2D.png | 0
src/assets/img/menu/navbg.jpg | 0
src/assets/img/basemap.png | 0
src/assets/css/index.css | 52 ++++++++++---
src/components/mapsdk.vue | 115 ++++++++++++++++++++--------
src/assets/img/3D.png | 0
src/assets/img/menu/navtitle.png | 0
public/SmartEarthSDK/Workers/css/smartearth.css | 5
src/assets/img/menu/user.png | 0
src/components/navMenu.vue | 44 +++++-----
src/assets/img/menu/theme.png | 0
13 files changed, 144 insertions(+), 72 deletions(-)
diff --git a/public/SmartEarthSDK/Workers/css/smartearth.css b/public/SmartEarthSDK/Workers/css/smartearth.css
index 6f2ca1b..848ec6d 100644
--- a/public/SmartEarthSDK/Workers/css/smartearth.css
+++ b/public/SmartEarthSDK/Workers/css/smartearth.css
@@ -76,7 +76,8 @@
#distanceLegendDiv {
position: absolute;
- bottom: 250px !important;
+ bottom: 340px !important;
+ /*bottom: 250px !important;*/
right: 120px !important;
}
@@ -131,4 +132,4 @@
.el-message-box__message {
user-select: text;
-}
\ No newline at end of file
+}
diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index 11697f2..8c72cc0 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -25,7 +25,10 @@
.NavBox {
width: 100%;
height: 100%;
- background-image: linear-gradient(rgb(34, 33, 33), rgb(27, 31, 78));
+ background-image: url("../../assets/img/menu/navbg.jpg");
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+ /*background-image: linear-gradient(rgb(34, 33, 33), rgb(27, 31, 78));*/
}
.topBox {
@@ -42,7 +45,7 @@
background: url("../img/LOGO.png") no-repeat center; */
width: 240px;
height: 50px;
- background: url("../img/LOGO.png") no-repeat center center;
+ background: url("../img/menu/navtitle.png") no-repeat center center;
background-size: 100% 100%;
}
@@ -57,6 +60,7 @@
height: 100%;
display: flex;
align-items: center;
+ justify-content: center;
}
.contentDiv {
@@ -64,7 +68,8 @@
}
.ImgMenu {
- width: 100%;
+ /*width: 100%;*/
+ width: 40px;
height: auto;
display: flex;
justify-content: center;
@@ -78,9 +83,10 @@
.menulabel {
font-size: 10px;
font-family: Source Han Sans CN;
-
- text-align: center;
- width: 120px;
+ text-align: left;
+ padding: 0 20px;
+ /*width: 100px;*/
+ /*width: 120px;*/
color: #fff
}
@@ -161,18 +167,21 @@
.topUser {
color: white;
height: 70px;
+ display: flex;
+ align-items: center;
}
.userName {
- margin: 10px 10px;
+ margin: 0px 10px 0 5px;
+ /*margin-right: 10px;*/
display: flex;
justify-content: space-between;
height: 30px;
}
.userLanguage {
- margin: 0px 10px;
- margin-top: 10px;
+ /*margin: 0px 10px;*/
+ /*margin-top: 10px;*/
display: flex;
height: 30px;
}
@@ -185,13 +194,21 @@
}
.user1 {
- background: url("../img/user.png") no-repeat;
+ /*background: url("../img/user.png") no-repeat;*/
+ background: url("../img/menu/user.png") no-repeat;
background-size: 100% 100%;
}
.user2 {
- background: url("../img/EN.png") no-repeat;
+ /*background: url("../img/EN.png") no-repeat;*/
+ background: url("../img/menu/en.png") no-repeat;
background-size: 100% 100%;
+ cursor: pointer;
+}
+.theme {
+ background: url("../img/menu/theme.png") no-repeat;
+ background-size: 100% 100%;
+ cursor: pointer;
}
.userText {
@@ -275,4 +292,15 @@
.ol-scale-line {
display: block !important;
-}
\ No newline at end of file
+}
+
+/*.mapTerrain {*/
+/* position: absolute;*/
+/* right: 30px;*/
+/* bottom: 100px;*/
+/* width: 30px;*/
+/* height: 28px;*/
+/* background-image: url("../../assets/img/synthesis/鍦板舰.png");*/
+/* background-repeat: no-repeat;*/
+/* background-size: contain;*/
+/*}*/
diff --git a/src/assets/img/2D.png b/src/assets/img/2D.png
new file mode 100644
index 0000000..6c33ac6
--- /dev/null
+++ b/src/assets/img/2D.png
Binary files differ
diff --git a/src/assets/img/3D.png b/src/assets/img/3D.png
new file mode 100644
index 0000000..f8c347d
--- /dev/null
+++ b/src/assets/img/3D.png
Binary files differ
diff --git a/src/assets/img/basemap.png b/src/assets/img/basemap.png
new file mode 100644
index 0000000..d37d31b
--- /dev/null
+++ b/src/assets/img/basemap.png
Binary files differ
diff --git a/src/assets/img/menu/en.png b/src/assets/img/menu/en.png
new file mode 100644
index 0000000..34dc28c
--- /dev/null
+++ b/src/assets/img/menu/en.png
Binary files differ
diff --git a/src/assets/img/menu/navbg.jpg b/src/assets/img/menu/navbg.jpg
new file mode 100644
index 0000000..ee2b612
--- /dev/null
+++ b/src/assets/img/menu/navbg.jpg
Binary files differ
diff --git a/src/assets/img/menu/navtitle.png b/src/assets/img/menu/navtitle.png
new file mode 100644
index 0000000..38ad962
--- /dev/null
+++ b/src/assets/img/menu/navtitle.png
Binary files differ
diff --git a/src/assets/img/menu/theme.png b/src/assets/img/menu/theme.png
new file mode 100644
index 0000000..019ebf0
--- /dev/null
+++ b/src/assets/img/menu/theme.png
Binary files differ
diff --git a/src/assets/img/menu/user.png b/src/assets/img/menu/user.png
new file mode 100644
index 0000000..e050291
--- /dev/null
+++ b/src/assets/img/menu/user.png
Binary files differ
diff --git a/src/assets/img/terrain.png b/src/assets/img/terrain.png
new file mode 100644
index 0000000..2f7fd90
--- /dev/null
+++ b/src/assets/img/terrain.png
Binary files differ
diff --git a/src/components/mapsdk.vue b/src/components/mapsdk.vue
index ebf0113..6dbed95 100644
--- a/src/components/mapsdk.vue
+++ b/src/components/mapsdk.vue
@@ -297,7 +297,7 @@
</div>
</el-card>
</div>
- <div style="display: flex">
+<!-- <div style="display: flex;">-->
<div
class="changeTerrain"
@click="changeTerrainLayer"
@@ -308,9 +308,10 @@
class="mapTerrain"
></div>
</div>
+<!-- class="center CenDiv"-->
<div
@click="changeMenulayer"
- class="center CenDiv"
+ class="changeLayer"
>
<div
title="搴曞浘鍒囨崲"
@@ -329,7 +330,7 @@
:class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"
></div>
</div>
- </div>
+<!-- </div>-->
<!-- 鍧″害鍒嗘瀽寮圭獥-->
<div
class="lengend"
@@ -1812,65 +1813,109 @@
.mapBaseMap {
width: 100%;
height: 100%;
- margin-left: 10px;
- background-image: url("../assets/img/synthesis/搴曞浘.png");
+ //margin-left: 10px;
+ background-image: url("../assets/img/basemap.png");
+ //background-image: url("../assets/img/synthesis/搴曞浘.png");
background-repeat: no-repeat;
background-size: contain;
}
-.changeMapType {
- position: absolute;
- bottom: 1%;
- left: calc(1% + 150px);
- height: 40px;
- width: 60px;
- z-index: 101;
- display: flex;
- justify-content: center;
- align-items: center;
- // box-shadow: 3px 3px 6px #666;
- //border: 1px solid rgba(204, 204, 204, 0.76);
- border-radius: 5px;
-
- cursor: pointer;
-}
+//.changeMapType {
+// position: absolute;
+// bottom: 1%;
+// left: calc(1% + 150px);
+// height: 40px;
+// width: 60px;
+// z-index: 101;
+// display: flex;
+// justify-content: center;
+// align-items: center;
+// // box-shadow: 3px 3px 6px #666;
+// //border: 1px solid rgba(204, 204, 204, 0.76);
+// border-radius: 5px;
+//
+// cursor: pointer;
+//}
.changeTerrain {
position: absolute;
- bottom: 1%;
- left: 1%;
- height: 40px;
- width: 60px;
+ bottom: 84px;
+ right: 46px;
+ height: 30px;
+ width: 30px;
z-index: 101;
display: flex;
justify-content: center;
align-items: center;
-
- border-radius: 5px;
cursor: pointer;
+ border: 1px solid rgba(255,255,255,.5);
}
+.changeLayer{
+ position: absolute;
+ bottom: 116px;
+ right: 46px;
+ height: 30px;
+ width: 30px;
+ z-index: 101;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ border: 1px solid rgba(255,255,255,.5);
+}
+.changeMapType {
+ position: absolute;
+ bottom: 52px;
+ right: 46px;
+ height: 30px;
+ width: 30px;
+ z-index: 101;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ border: 1px solid rgba(255,255,255,.5);
+}
+//.changeTerrain {
+// position: absolute;
+// bottom: 1%;
+// left: 1%;
+// height: 40px;
+// width: 60px;
+// z-index: 101;
+// display: flex;
+// justify-content: center;
+// align-items: center;
+//
+// border-radius: 5px;
+// cursor: pointer;
+//}
.mapTypeTwo {
width: 100%;
height: 100%;
margin-left: 10px;
- background-image: url("../assets/img/synthesis/3D.png");
+ background-image: url("../assets/img/3D.png");
+ //background-image: url("../assets/img/synthesis/3D.png");
background-repeat: no-repeat;
- background-size: contain;
+
+ //background-size: contain;
}
.mapTerrain {
width: 100%;
height: 100%;
- margin-left: 10px;
- background-image: url("../assets/img/synthesis/鍦板舰.png");
+ //margin-left: 10px;
+ //background-image: url("../assets/img/synthesis/鍦板舰.png");
+ //background-image: url("../assets/img/synthesis/鍦板舰.png");
+ background-image: url("../assets/img/terrain.png");
background-repeat: no-repeat;
- background-size: contain;
+ //background-size: contain;
}
.mapTypeThree {
width: 100%;
height: 100%;
- margin-left: 10px;
- background-image: url("../assets/img/synthesis/2D 鎷疯礉 2.png");
+ //margin-left: 10px;
+ background-image: url("../assets/img/2D.png");
background-repeat: no-repeat;
- background-size: contain;
+ //background-size: contain;
}
.pdfClass {
diff --git a/src/components/navMenu.vue b/src/components/navMenu.vue
index e171aac..40a0ec5 100644
--- a/src/components/navMenu.vue
+++ b/src/components/navMenu.vue
@@ -12,7 +12,7 @@
@click="setMenuMove(index, item)"
v-for="(item, index) in listMenu"
>
- <div>
+ <div style="display: flex;align-items: center">
<div class="ImgMenu">
<div
class="menuImage"
@@ -42,6 +42,24 @@
</div>
</div>
<div class="topUser">
+ <div class="userLanguage">
+ <div class="userImage theme" @click="themeChange"></div>
+ <div class="userImage user2" @click="switchLang"></div>
+<!-- <div class="TextLanguage">-->
+<!-- <el-link-->
+<!-- @click="switchLang"-->
+<!-- :underline="false"-->
+<!-- class="elLink"-->
+<!-- >{{$t("common.language")}}</el-link>-->
+<!-- </div>-->
+<!-- <div class="TextLanguage">-->
+<!-- <el-link-->
+<!-- @click="themeChange"-->
+<!-- :underline="false"-->
+<!-- class="elLink"-->
+<!-- > 涓婚鍒囨崲</el-link>-->
+<!-- </div>-->
+ </div>
<div class="userName">
<div class="userImage user1"></div>
<div class="userText">
@@ -52,26 +70,7 @@
class="elLink"
>{{ $t('common.logout') }}</el-link>
</div>
-
</div>
- <div class="userLanguage">
- <div class="userImage user2"></div>
- <div class="TextLanguage">
- <el-link
- @click="switchLang"
- :underline="false"
- class="elLink"
- >{{$t("common.language")}}</el-link>
- </div>
- <div class="TextLanguage">
- <el-link
- @click="themeChange"
- :underline="false"
- class="elLink"
- > 涓婚鍒囨崲</el-link>
- </div>
- </div>
-
</div>
</div>
@@ -237,7 +236,7 @@
this.showFlag = null;
}
}
- //
+ //
if (index === 4 || index === 5 || index === 6) {
sessionStorage.removeItem('changeliSelect')
this.$set(this, 'changeliSelect', null)
@@ -465,5 +464,4 @@
},
};
</script>
-
-
\ No newline at end of file
+
--
Gitblit v1.9.3