From 426c8b34e6c0a6f97de69864c537cf5e0d7dbb08 Mon Sep 17 00:00:00 2001
From: odc.xiaohui <xiaohui@Q1>
Date: 星期四, 15 十二月 2022 18:13:34 +0800
Subject: [PATCH] 2022-12-15 趋势分析 地图位置 ，弹窗修改
---
src/views/intelligentPatrol/studyJudge/index.vue | 2
src/components/map/index.vue | 14 +++++--
src/views/intelligentPatrol/trendAnalysis/index.vue | 54 +++++++++++++++++++-------
3 files changed, 50 insertions(+), 20 deletions(-)
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index a39ac2e..3377fbe 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -12,7 +12,7 @@
};
},
created() {
- debugger
+
// if (this.point) {
// this._point = this.point;
// }
@@ -23,8 +23,8 @@
methods: {
locationMap() {
const that = this;
- debugger
- setTimeout(() => {
+
+
// console.log("_zoom---", that.zoom);
// console.log("_point---", JSON.stringify(that.point));
that.map.setZoomAndCenter(that._zoom, [that.point.x, that.point.y]);
@@ -37,8 +37,14 @@
// 灏嗗垱寤虹殑鐐规爣璁版坊鍔犲埌宸叉湁鐨勫湴鍥惧疄渚嬶細
that.map.add(marker);
+ marker.on('click',function(e){
+ console.log('666')
+ that.$emit('fatherMethod')
+ // that.$parent.fatherMethod();
+
+ })
}
- }, 1000);
+
},
},
mounted() {
diff --git a/src/views/intelligentPatrol/studyJudge/index.vue b/src/views/intelligentPatrol/studyJudge/index.vue
index f10e22f..305858c 100644
--- a/src/views/intelligentPatrol/studyJudge/index.vue
+++ b/src/views/intelligentPatrol/studyJudge/index.vue
@@ -691,7 +691,7 @@
line-height: 4.8vh;
.count-data-span{
cursor: pointer;
- color: blue;
+ color: #66b1ff;
}
.left-form > ::v-deep.el-form-item__label {
font-size: 16px !important;
diff --git a/src/views/intelligentPatrol/trendAnalysis/index.vue b/src/views/intelligentPatrol/trendAnalysis/index.vue
index 11608c0..5d5a93a 100644
--- a/src/views/intelligentPatrol/trendAnalysis/index.vue
+++ b/src/views/intelligentPatrol/trendAnalysis/index.vue
@@ -6,11 +6,11 @@
<div class="trend-input-area">
<span class="trend-title">瓒嬪娍鍒嗘瀽</span>
<el-form ref="form" :model="search" label-width="6vw">
- <el-form-item label="绫诲瀷鏌ヨ">
- <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 label="绫诲瀷鏌ヨ">-->
+<!-- <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 @change="searchList" start-placeholder="寮�濮嬫椂闂�" end-placeholder="缁撴潫鏃堕棿" v-model="search.timeRange"
type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss">
@@ -28,7 +28,7 @@
<!-- 瀵瑰簲鏁版嵁 -->
<div class="trend-data-main">
<div class="point-item" v-for="item in trendAnalysisList" :key="item.id" @click="pointClick(item)">
- <span>{{ item.name }}</span>
+ <span class="point-name">{{ item.name }}</span>
<span>{{ item.count }}</span>
</div>
</div>
@@ -37,12 +37,18 @@
<div class="trend-main">
<div class="map">
- <MyMap :point="point" :zoom="zoom" :mark="mark"></MyMap>
+ <MyMap :point="point" :zoom="zoom" :mark="mark" @fatherMethod="fatherMethod"></MyMap>
</div>
- <div class="trend-main-echarts" id="echarts">
- </div>
</div>
+ <el-dialog
+ title="鎻愮ず"
+ :visible.sync="echartsDialogVisible"
+ width="30%"
+ :before-close="handleClose">
+ <div style="height: 500px;width: 500px;" id="echarts">
+ </div>
+ </el-dialog>
</div>
</template>
@@ -59,7 +65,7 @@
},
mounted() {
- this.renderEchart();
+ // this.renderEchart();
},
computed: {
@@ -70,6 +76,8 @@
data() {
return {
+ echartsList:null,
+ echartsDialogVisible:false,
search: {
type: null,
timeRange: null
@@ -85,6 +93,17 @@
}
},
methods: {
+ fatherMethod(){
+ console.log('7777')
+ this.echartsDialogVisible=true
+ this.$nextTick(function (){
+ this.renderEchart(this.echartsList);
+
+ })
+ },
+ handleClose(){
+ this.echartsDialogVisible = false
+ },
renderEchart(dataList) {
if (!this.echarts) {
this.echarts = echarts.init(document.getElementById('echarts'));
@@ -132,8 +151,9 @@
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);
+ // const countList = res.map(item => +item.count);
+ this.echartsList= res.map(item => +item.count);
+ // this.renderEchart(countList);
})
.catch(err => this.$message.error(err))
}
@@ -192,6 +212,10 @@
display: flex;
padding: 0 2vw;
justify-content: space-between;
+ .point-name{
+ cursor: pointer;
+ color: #66b1ff;
+ }
}
}
}
@@ -214,7 +238,7 @@
}
}
.map {
- height: 488px;
- min-width: 460px;
+ height: 100%;
+ min-width: 80%;
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0