20240308

lixuliang

2024-03-08 ac755c3add30177675e189cf7cb637e1f09eb827

 src/components/poplayer/history2.vue

@@ -11,7 +11,9 @@
          @click="changeLeftMap(item)"
          :class="{ active: currentValue == item }"
        >
          {{ item }}
          <span>
            {{ item }}
          </span>
        </li>
      </ul>
    </div>
@@ -19,6 +21,7 @@
</template>

<script>
import _GLOBAL from "@/assets/GLOBAL";
import store from "@/utils/store2";
import { addHistoryLayer } from "@/utils/tool";
export default {
@@ -34,8 +37,13 @@
    };
  },
  mounted() {
    store.setNavigatorShow(false);
    store.setMapToolShow(false);
    window.mapapi.getView().setCenter([4.606512, 2.621472]);
    addHistoryLayer(this.currentValue);
    if (_GLOBAL.GPSMarker) {
      window.mapapi.removeLayer(_GLOBAL.GPSMarker);
    }
  },
  methods: {
    changeLeftMap(item) {
@@ -44,6 +52,10 @@
    },
    close() {
      store.setHistoryShow(false);
      window.mapapi.removeLayer(this.$global.historyLayer);
      window.mapapi.getView().setCenter([116.505348, 39.795592]);
      store.setNavigatorShow(true);
      store.setMapToolShow(true);
    },
  },
};
@@ -51,30 +63,45 @@
<style scoped>
.colseBtn {
  position: absolute;
  top: 5vh;
  right: 20px;
  top: 20px;
  right: 9px;
}

.searchBtn {
  width: 40px;
  height: 40px;
  width: 51px;
  /* height: 40px; */
}

.listBox {
  position: absolute;
  right: 20px;
  bottom: 10px;
  background-color: #373737;
  right: 10px;
  bottom: 18px;
  width: 48px;
  height: 594px;
  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: 15px;
  color: #1c222f;
  height: 28px;
  line-height: 28px;
  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 {
@@ -85,6 +112,7 @@
}

.active {
  background-color: #4590d7;
  /* background-color: #4590d7; */
  color: #127dff;
}
</style>