From fde8e3bedaf5f883f38c3a0ec33d3c6a8748d1c9 Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期五, 21 六月 2024 18:02:44 +0800
Subject: [PATCH] wfs 范围查询
---
src/views/homePage/index.vue | 55 +++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 45 insertions(+), 10 deletions(-)
diff --git a/src/views/homePage/index.vue b/src/views/homePage/index.vue
index ddd7f6c..0b0cd92 100644
--- a/src/views/homePage/index.vue
+++ b/src/views/homePage/index.vue
@@ -1,13 +1,24 @@
<template>
<div class="mapChart">
<div class="leftChart">
- <div
- :class="
- $store.state.setScreenFlag ? 'leftContentActive' : 'leftContent'
- "
- >
- <map-chart></map-chart></div>
+ <div class="chartContent">
+ <div class="chartHeader">
+ <chartHeader></chartHeader>
+ </div>
+ <div class="chartBox">
+ <div
+ :class="
+ $store.state.setScreenFlag ? 'leftContentActive' : 'leftContent'
+ "
+ >
+ <map-chart></map-chart>
+ </div>
+ </div>
+ </div>
<!-- -->
+ <!-- -->
+
+ <!-- </div> -->
</div>
<div :class="$store.state.setScreenFlag ? 'rightMapActive' : 'rightMap'">
<map-view></map-view>
@@ -18,37 +29,61 @@
<script>
import mapChart from "./../mapChart/index.vue";
import mapView from "./../mapView/index.vue";
+import chartHeader from "./../mapChart/chartHeader.vue";
export default {
components: {
mapChart,
- mapView
+ mapView,
+ chartHeader
},
mounted() {}
};
</script>
-<style>
+<style scoped>
.mapChart {
width: 100%;
height: 100%;
display: flex;
overflow: hidden;
+ background: #333333;
}
.leftChart {
flex: 1;
+}
+.chartContent {
+ width: 100%;
+ height: 100%;
+ /* background: skyblue; */
+ display: flex;
+ flex-direction: column;
+}
+.chartHeader {
+ width: 100%;
+ height: 38px;
+}
+.chartContent .chartBox {
+ flex: 1;
display: flex;
justify-content: center;
+
+ /*
+ height: (100% - 38px);
+*/
}
.leftContent {
- width: 50%;
+ width: 40%;
height: 100%;
transition: 1s ease-out;
+ display: flex;
+ justify-content: center;
+ background: skyblue;
}
.leftContentActive {
width: 100%;
height: 100%;
transition: 1s ease-out;
-
+ background: skyblue;
}
.rightMapActive {
width: 50%;
--
Gitblit v1.9.3