From f5233339920a59103d53e8efadc6f3f5d0b64f31 Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期三, 08 五月 2024 14:45:37 +0800
Subject: [PATCH] 移动端
---
src/components/poplayer/history2.vue | 74 ++++++++++++++++++++++---------------
1 files changed, 44 insertions(+), 30 deletions(-)
diff --git a/src/components/poplayer/history2.vue b/src/components/poplayer/history2.vue
index fd2a20a..3475168 100644
--- a/src/components/poplayer/history2.vue
+++ b/src/components/poplayer/history2.vue
@@ -1,7 +1,7 @@
<template>
<div class="historyBox">
- <div class="colseBtn">
- <img class="searchBtn" @click="close" src="@/assets/closeinput1.png" />
+ <div class="closeWrapper">
+ <img class="colseBtn" @click="close" src="@/assets/closeinput1.png" />
</div>
<div class="listBox">
<ul>
@@ -11,7 +11,9 @@
@click="changeLeftMap(item)"
:class="{ active: currentValue == item }"
>
- {{ item }}
+ <span>
+ {{ item }}
+ </span>
</li>
</ul>
</div>
@@ -19,16 +21,17 @@
</template>
<script>
+import _GLOBAL from "@/assets/GLOBAL";
import store from "@/utils/store2";
-import { addHistoryLayer } from "@/utils/tool";
+import { addHistoryLayer, addHistoryLW } from "@/utils/tool";
export default {
name: "historyBox",
components: {},
data() {
return {
arr: [
- 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012,
- 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021,
+ 2021, 2020, 2019, 2018, 2017, 2016, 2015, 2014, 2013, 2012, 2011, 2010,
+ 2009, 2008, 2007, 2006, 2005, 2004, 2003, 2002, 2001,
],
currentValue: 2021,
};
@@ -36,8 +39,10 @@
mounted() {
store.setNavigatorShow(false);
store.setMapToolShow(false);
- window.mapapi.getView().setCenter([4.606512, 2.621472]);
+ window.mapapi.getView().setCenter(ol.proj.fromLonLat([4.606512, 2.621472]));
+ // window.mapapi.getView().setCenter(ol.proj.fromLonLat([116.505348, 39.795592]));
addHistoryLayer(this.currentValue);
+ addHistoryLW();
if (_GLOBAL.GPSMarker) {
window.mapapi.removeLayer(_GLOBAL.GPSMarker);
}
@@ -50,7 +55,10 @@
close() {
store.setHistoryShow(false);
window.mapapi.removeLayer(this.$global.historyLayer);
- window.mapapi.getView().setCenter([116.505348, 39.795592]);
+ window.mapapi.removeLayer(this.$global.historyLW);
+ window.mapapi
+ .getView()
+ .setCenter(ol.proj.fromLonLat([116.505348, 39.795592]));
store.setNavigatorShow(true);
store.setMapToolShow(true);
},
@@ -58,42 +66,48 @@
};
</script>
<style scoped>
-.colseBtn {
+.closeWrapper {
position: absolute;
- top: 3vh;
- right: 20px;
+ top: 20px;
+ right: 9px;
}
-.searchBtn {
- width: 40px;
- height: 40px;
+.colseBtn {
+ width: 0.4rem;
+ /* height: 40px; */
}
.listBox {
position: absolute;
- right: 20px;
- bottom: 0.5rem;
- background-color: #373737;
+ right: 10px;
+ bottom: 18px;
+ width: 48px;
+ background: #ffffff;
+ box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.21);
+ border-radius: 13px;
}
+.listBox ul {
+ margin-top: 3px;
+}
.listBox li {
- padding: 2px;
- border: 1px solid #000;
- color: white;
+ font-weight: bold;
+ font-size: 0.12rem;
+ line-height: 0.25rem;
+ color: #1c222f;
+ border-bottom: 1px solid #e5e5e5;
+ text-align: center;
+}
+.listBox li:last-child {
+ border: none;
}
.listBox li:hover {
- background-color: #00e1ff;
+ /* background-color: #00e1ff; */
+ color: #127dff;
}
-.mapLeft {
- float: left;
- position: absolute;
- width: 100vw;
- height: 100vh;
-}
-
-.active {
- background-color: #4590d7;
+.listBox .active {
+ color: #127dff;
}
</style>
--
Gitblit v1.9.3