From 04477a62f8966e9aabc31421bab138960eff323e Mon Sep 17 00:00:00 2001
From: hejianhao <15708179461@qq.com>
Date: 星期三, 26 三月 2025 15:57:29 +0800
Subject: [PATCH] 除地图外所有接口对接、样式调整
---
src/views/DataScreen.vue | 57 ++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 36 insertions(+), 21 deletions(-)
diff --git a/src/views/DataScreen.vue b/src/views/DataScreen.vue
index 7222478..272346a 100644
--- a/src/views/DataScreen.vue
+++ b/src/views/DataScreen.vue
@@ -1,12 +1,12 @@
<template>
- <div >
+ <div class="data-screen">
<Header />
- <div class="main-content">
- <LeftPanel />
+ <div v-if="loading" class="main-content">
+ <LeftPanel :staticsData="staticsData" :rentRank="rentRank" />
<MapPanel />
- <RightPanel />
+ <RightPanel :staticsData="staticsData" :realTimeRentData="realTimeRentData" />
</div>
- <BottomCharts />
+ <BottomCharts v-if="loading" :rentIncomeTrend="rentIncomeTrend" :tenantCountTrend="tenantCountTrend" />
<div class="footer"></div>
</div>
</template>
@@ -17,7 +17,7 @@
import MapPanel from '@/components/MapPanel.vue'
import RightPanel from '@/components/RightPanel.vue'
import BottomCharts from '@/components/BottomCharts.vue'
-import { getData } from './service'
+import { getStaticsData, getRentRank, getRentIncomeTrend, getTenantCountTrend, getRealTimeRentData } from '@/components/service'
export default {
name: 'DataScreen',
@@ -28,8 +28,17 @@
RightPanel,
BottomCharts
},
+ data() {
+ return {
+ staticsData: {},
+ rentRank: [],
+ rentIncomeTrend: [],
+ tenantCountTrend: [],
+ realTimeRentData: [],
+ loading: false
+ }
+ },
created() {
- console.log(this.$route);
if (this.$route.query.token || localStorage.getItem('token')) {
localStorage.setItem('token', 'Bearer ' + this.$route.query.token)
this.fetchData()
@@ -37,8 +46,13 @@
},
methods: {
fetchData() {
- getData().then(res => {
- console.log(res)
+ Promise.all([getStaticsData(), getRentRank(), getRentIncomeTrend(), getTenantCountTrend(), getRealTimeRentData()]).then(res => {
+ this.staticsData = res[0].data
+ this.rentRank = res[1].data
+ this.rentIncomeTrend = res[2].data
+ this.tenantCountTrend = res[3].data
+ this.realTimeRentData = res[4].data
+ this.loading = true
})
}
}
@@ -46,18 +60,14 @@
</script>
<style>
-#app {
- width: 100vw;
- height: 100vh;
- margin: 0;
- padding: 0;
- padding: 0 !important;
- overflow: hidden;
- background: linear-gradient(to bottom, #1a2b3c 0%, rgba(26, 43, 60, 0.8) 20%, rgba(26, 43, 60, 0) 100%);
- color: #fff;
- font-family: 'DIN ', 'DIN', sans-serif;
+.data-screen {
+ width: 100%;
+ height: 100%;
display: flex;
flex-direction: column;
+ position: relative;
+ color: #fff;
+ font-family: 'DIN', sans-serif;
}
/* 添加全局字体声明 */
@@ -73,15 +83,20 @@
flex: 1;
display: flex;
gap: 10px;
+ height: calc(100% - 300px);
+ position: relative;
+ margin-top: 100px;
+ min-height: 0;
}
.footer {
height: 200px;
- position: fixed;
+ position: absolute;
bottom: 0;
left: 0;
- width: 100vw;
+ width: 100%;
z-index: 1000;
background: linear-gradient(to top, rgba(1, 85, 121, 0.8) 0%, rgba(1, 85, 121, 0.4) 20%, rgba(151, 190, 192, 0) 100%);
+ pointer-events: none;
}
</style>
--
Gitblit v1.7.1