From 065669d31914a2f65c48d351417f48e49bd79c0c Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期三, 13 三月 2024 11:30:46 +0800
Subject: [PATCH] Merge branch 'master' of http://103.135.160.14:9034/r/PM20221203225_MobileWeb
---
src/components/poplayer/history2.vue | 200 +++++++++++++++++---------------------------------
1 files changed, 68 insertions(+), 132 deletions(-)
diff --git a/src/components/poplayer/history2.vue b/src/components/poplayer/history2.vue
index f6386b7..866745f 100644
--- a/src/components/poplayer/history2.vue
+++ b/src/components/poplayer/history2.vue
@@ -1,176 +1,112 @@
<template>
<div class="historyBox">
- <div class="leftBox">
- <div id="mapContainer" class="mapLeft"></div>
- <div class="colseBtn">
- <img class="searchBtn" @click="close" src="@/assets/closeinput1.png" />
- </div>
- <div class="listBox">
- <ul>
- <li v-for="(item, index) in arr" :key="index" @click="changeLeftMap(item, index)"
- :class="{ active: currentIndex1 == index }">
+ <div class="colseBtn">
+ <img class="searchBtn" @click="close" src="@/assets/closeinput1.png" />
+ </div>
+ <div class="listBox">
+ <ul>
+ <li
+ v-for="(item, index) in arr"
+ :key="index"
+ @click="changeLeftMap(item)"
+ :class="{ active: currentValue == item }"
+ >
+ <span>
{{ item }}
- </li>
- </ul>
- </div>
+ </span>
+ </li>
+ </ul>
</div>
</div>
</template>
<script>
-import mapType from "@/utils/maptype";
-import { Map, View } from "ol";
-import Tile from "ol/layer/Tile";
-import WMTS from "ol/source/WMTS";
-import WMTSTileGrid from "ol/tilegrid/WMTS";
-import * as olProj from "ol/proj";
-import XYZ from "ol/source/XYZ";
-import store from '@/utils/store2'
-let view = new View({
- center: olProj.fromLonLat([4.606512, 2.621472]),
- zoom: 12,
- enableRotation: false,
-});
-var topResolution = 896.0859375;
-var resolutions = [];
-let matrixIds = [];
-
-for (let zoom = 0; zoom < 13; zoom++) {
- resolutions.push(topResolution / Math.pow(2, zoom));
- matrixIds[zoom] = zoom;
-}
-let LwSource = new Tile({
- source: new WMTS({
- url: "https://skyzt.bda.gov.cn/service/ImageEngine/picdis/abc?user=jjjskfq&password=Jjjskfq@2022",
- layer: "Shiliang_Lw_2019",
- style: "",
- format: "image/png",
- // 鎶曞奖鍧愭爣绯�
- tileGrid: new WMTSTileGrid({
- extent: [371987.18334, 252920.58593, 624459.12036, 423400.07714],
- origin: [0, 688194],
- resolutions: resolutions,
- matrixIds: matrixIds,
- tileSize: 256,
- }),
- }),
-});
+import _GLOBAL from "@/assets/GLOBAL";
+import store from "@/utils/store2";
+import { addHistoryLayer } from "@/utils/tool";
export default {
name: "historyBox",
components: {},
data() {
return {
- openMap: null,
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,
],
- tileLayer1: null, // 鍦板浘灞�
- tileLayer2: null, // 鍦板浘灞�
- mapList: [], // 鍦板浘鍒楄〃
- locaMap1: "2021",
- // locaMap2: "2020",
- currentIndex1: 20,
- // currentIndex2: 19,
+ currentValue: 2021,
};
},
mounted() {
- this.mapList = mapType;
- this.tileLayer1 = new Tile({
- source: this.mapList.find((e) => e.id == this.locaMap1).value,
- });
- // this.tileLayer2 = new Tile({
- // source: this.mapList.find((e) => e.id == this.locaMap2).value,
- // });
- this.initMap();
+ store.setNavigatorShow(false);
+ store.setMapToolShow(false);
+ // 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);
+ if (_GLOBAL.GPSMarker) {
+ window.mapapi.removeLayer(_GLOBAL.GPSMarker);
+ }
},
methods: {
- initMap() {
- new Map({
- target: "mapContainer",
- layers: [
- this.tileLayer1,
- LwSource,
- // new Tile({
- // source: new XYZ({
- // url: "https://skyzt.bda.gov.cn/yzAdapter/Vector/?request=1&year=2002&type=Sate&level={z}&x={x}&y={y}",
- // }),
- // }),
- ],
- view: view,
- controls: [],
- });
+ changeLeftMap(item) {
+ this.currentValue = item;
+ addHistoryLayer(this.currentValue);
},
- changeLeftMap(item, index) {
- this.tileLayer1.setSource(this.mapList.find((e) => e.id == item).value);
- this.currentIndex1 = index;
- },
- close(){
+ close() {
store.setHistoryShow(false);
-
- }
- // changeRightMap(item, index) {
- // this.tileLayer2.setSource(this.mapList.find((e) => e.id == item).value);
- // this.currentIndex2 = index;
- // },
+ window.mapapi.removeLayer(this.$global.historyLayer);
+ window.mapapi.getView().setCenter(ol.proj.fromLonLat([116.505348, 39.795592]));
+ store.setNavigatorShow(true);
+ store.setMapToolShow(true);
+ },
},
- // watch: {
- // "state.show": {
- // handler: function (newVal, oldVal) {
- // debugger;
- // let that = this;
- // this.state.show =newVal
- // },
- // },
- // },
};
</script>
<style scoped>
-.historyBox {
- position: absolute;
- z-index: 2;
- width: 100vw;
- height: 100vh;
- background: rgba(0, 0, 0, 0.5);
- top: 0;
- left: 0;
-}
-
.colseBtn {
position: absolute;
- top: 5vh;
- right: 20px;
+ top: 20px;
+ right: 9px;
}
.searchBtn {
- width: 40px;
- height: 40px;
+ width: 0.4rem;
+ /* height: 40px; */
}
.listBox {
position: absolute;
- right: 20px;
- bottom: 10px;
- 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;
-}</style>
+
+.listBox .active {
+ /* background-color: #4590d7; */
+ color: #127dff;
+}
+</style>
--
Gitblit v1.9.3