From 9d31b60126cde71483900bf44ef91aba73c4b578 Mon Sep 17 00:00:00 2001
From: wl <173@qq.com>
Date: 星期四, 15 十二月 2022 13:42:59 +0800
Subject: [PATCH] 修改驾驶舱跳转
---
src/views/intelligentPatrol/trendAnalysis/index.vue | 33 +++++++++++++++++++++++++++------
1 files changed, 27 insertions(+), 6 deletions(-)
diff --git a/src/views/intelligentPatrol/trendAnalysis/index.vue b/src/views/intelligentPatrol/trendAnalysis/index.vue
index 1cadf21..ec296df 100644
--- a/src/views/intelligentPatrol/trendAnalysis/index.vue
+++ b/src/views/intelligentPatrol/trendAnalysis/index.vue
@@ -7,12 +7,13 @@
<span class="trend-title">瓒嬪娍鍒嗘瀽</span>
<el-form ref="form" :model="search" label-width="6vw">
<el-form-item label="绫诲瀷鏌ヨ">
- <el-select v-model="search.type" placeholder="鍐呭淇℃伅">
+ <el-select v-model="search.type" @change="searchList" placeholder="鍐呭淇℃伅">
<el-option v-for="option in categoryOptions" :key="option.value" :value="option.value" :label="option.label" ></el-option>
</el-select>
</el-form-item>
<el-form-item class="time-area" label="鏃堕棿鑼冨洿">
- <el-date-picker v-model="search.timeRange" type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss">
+ <el-date-picker @change="searchList" start-placeholder="寮�濮嬫椂闂�" end-placeholder="缁撴潫鏃堕棿" v-model="search.timeRange"
+ type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss">
</el-date-picker>
</el-form-item>
</el-form>
@@ -34,6 +35,10 @@
</div>
</div>
<div class="trend-main">
+
+ <div class="map">
+ <MyMap :point="point" :zoom="zoom" :mark="mark"></MyMap>
+ </div>
<div class="trend-main-echarts" id="echarts">
</div>
@@ -45,8 +50,10 @@
import * as echarts from 'echarts'
import basecase from "@/api/operate/basecase";
import { CATEGOTY } from "@/utils/helper";
+import MyMap from "@/components/map";
export default {
+ components :{MyMap},
created() {
this.searchList()
},
@@ -71,7 +78,10 @@
trendAnalysisList: [],
highFlag: true,
echarts: null,
- pointName: null
+ pointName: null,
+ point: null,
+ mark: null,
+ zoom: null,
}
},
methods: {
@@ -106,6 +116,7 @@
this.trendAnalysisList = this.highFlag ? await basecase.getTrendAnalysisData(trendAnalysisParam)
: await basecase.getFirstTrendAnalysisData(trendAnalysisParam);
},
+
tabChange(params) {
this.highFlag = params === 1;
this.searchList();
@@ -113,7 +124,13 @@
pointClick(data) {
this.pointName = data.name;
- basecase.getPointTrendAnalysisData({ id: data.id })
+ this.point = {
+ x: data.longitude,
+ y: data.latitude,
+ };
+ this.zoom = 19;
+ this.mark = { title: data.address };
+ basecase.getPointTrendAnalysisData({ longitude: data.longitude,latitude: data.latitude })
.then(res => {
const countList = res.map(item => +item.count);
this.renderEchart(countList);
@@ -127,7 +144,7 @@
<style lang="scss" scoped>
.trend-analysis {
height: 100%;
- padding: 10vh 10vw;
+ padding: 10vh 0vw;
color: #4b9bb7;
display: flex;
@@ -183,7 +200,7 @@
.trend-main {
flex: 1;
border: 1px solid #09152f;
-
+ display: flex;
.trend-main-echarts {
width: 500px;
height: 400px;
@@ -196,4 +213,8 @@
}
}
}
+.map {
+ height: 488px;
+ min-width: 460px;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0