From b3ac30a5a5540b6e376fac7de98f5670a98e785e Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Wed, 25 Oct 2023 17:27:11 +0800
Subject: [PATCH] fix:实时风场图点击弹窗修改
---
src/views/main/index.vue | 190 +++++++++++++++++++++++++++--------------------
1 files changed, 109 insertions(+), 81 deletions(-)
diff --git a/src/views/main/index.vue b/src/views/main/index.vue
index 79ae316..d20cfed 100644
--- a/src/views/main/index.vue
+++ b/src/views/main/index.vue
@@ -1,5 +1,5 @@
<template>
- <div class="dashboard-container" style="height:100%">
+ <div class="dashboard-container" style="height: 100%">
<el-container style="height: 100%; border: 1px solid #eee">
<el-aside
v-if="this.$store.state.aside"
@@ -7,7 +7,7 @@
style="background-color: rgb(238, 241, 246)"
>
<!-- ��������������������������������������� -->
- <div style="display:flex;margin-bottom:5px">
+ <div style="display: flex; margin-bottom: 5px">
<el-cascader
v-model="newRegion"
placeholder="���������/���/���"
@@ -15,27 +15,45 @@
:props="{ checkStrictly: true }"
clearable
change-on-select
- style="flex:1"
+ style="flex: 1"
/>
- <div style="width: 20%;line-height: 30px;text-align: center;background: #409eff;color: #fff;margin: 5px;border-radius: 5px;cursor: pointer;font-size: 14px;" @click="getRegionApi">������</div>
+ <div
+ style="
+ width: 20%;
+ line-height: 30px;
+ text-align: center;
+ background: #409eff;
+ color: #fff;
+ margin: 5px;
+ border-radius: 5px;
+ cursor: pointer;
+ font-size: 14px;
+ "
+ @click="getRegionApi"
+ >
+ ������
+ </div>
</div>
- <div style="display:flex;margin-bottom:5px">
- <el-input v-model="searchText" placeholder="������������" clearable prefix-icon="el-icon-search" />
+ <div style="display: flex; margin-bottom: 5px">
+ <el-input
+ v-model="searchText"
+ placeholder="������������"
+ clearable
+ prefix-icon="el-icon-search"
+ />
</div>
- <el-menu
- :default-openeds="openeds"
- >
+ <el-menu :default-openeds="openeds" class="elwidth">
<el-submenu
- v-for="(item,index) in defaultData"
+ v-for="(item, index) in defaultData"
:key="index"
- :index="(index+1).toString()"
- style="border-bottom:1px solid #eee;padding-left: 15px;"
+ :index="(index + 1).toString()"
+ style="border-bottom: 1px solid #eee; padding-left: 15px"
class="abc"
>
<template
slot="title"
class="title"
- style="padding-left:20px!important"
+ style="padding-left: 20px !important"
>
<!-- <i
style="vertical-align: -2px;font-size: 20px;margin-right:5px"
@@ -43,32 +61,57 @@
/> -->
<span
- style="height:12px;display: inline-block;"
+ style="height: 12px; display: inline-block"
class="circle"
- :class="{'circle-0':item.state == 0,'circle-1':item.state == 1,'circle-2':item.state == 2,'circle-3':item.state == 3,'circle-4':item.state == 4,'circle-5':item.state == 5,'circle-6':item.state == 6}"
+ :class="{
+ 'circle-0': item.state == 0,
+ 'circle-1': item.state == 1,
+ 'circle-2': item.state == 2,
+ 'circle-3': item.state == 3,
+ 'circle-4': item.state == 4,
+ 'circle-5': item.state == 5,
+ 'circle-6': item.state == 6,
+ }"
/>
<!-- <el-button type="primary" circle /> -->
{{ item.name }}
</template>
<el-menu-item
- v-for="(items,indexitem) in item.devices"
+ v-for="(items, indexitem) in item.devices"
:key="indexitem"
- style="display: flex;justify-content: space-between;align-items: center;padding-right: 0;padding-left:35px"
- :index="(index+1 + '-' + indexitem + 1).toString()"
+ style="
+ display: flex;
+ align-items: center;
+ padding-right: 0;
+ padding-left: 35px;
+ "
+ :index="(index + 1 + '-' + indexitem + 1).toString()"
@click="jump(items)"
>
<!-- <div> -->
<!-- <el-button type="primary" circle /> -->
<span
class="circle"
- :class="{'circle-0':items.state == 0,'circle-1':items.state == 1,'circle-2':items.state == 2,'circle-3':items.state == 3,'circle-4':items.state == 4,'circle-5':items.state == 5,'circle-6':items.state == 6}"
+ :class="{
+ 'circle-0': items.state == 0,
+ 'circle-1': items.state == 1,
+ 'circle-2': items.state == 2,
+ 'circle-3': items.state == 3,
+ 'circle-4': items.state == 4,
+ 'circle-5': items.state == 5,
+ 'circle-6': items.state == 6,
+ }"
/>
<span>{{ items.name }}</span>
<i
- style="vertical-align: -2.5px;font-size: 20px;margin-right:10px;margin-left:auto"
+ style="
+ vertical-align: -2.5px;
+ font-size: 20px;
+ margin-left: 5px;
+ "
class="iconfont iconfaxianzuobiao"
- @click="deviceDetail(items.mac,item,items,indexitem)"
+ @click="deviceDetail(items.mac, item, items, indexitem)"
/>
<!-- </div> -->
</el-menu-item>
@@ -80,7 +123,7 @@
<!-- <Map :mpid="monitorPointId" :rc="regionCode" /> -->
<compoment
:is="this.$store.state.type"
- v-if="weidu&&jingdu"
+ v-if="weidu && jingdu"
ref="child"
:weidu="weidu"
:jingdu="jingdu"
@@ -101,6 +144,7 @@
<script>
// import Cookies from 'js-cookie'
import '@/assets/icon/iconfont.css'
+import _ from 'lodash'
// import $ from 'jquery'
import Map from '@/components/Wind/Map.vue'
import LineChart from '@/components/Echarts/LineChart'
@@ -163,60 +207,33 @@
},
watch: {
searchText(newVal, oldVal) {
- // console.log(oldVal)
+ console.log(typeof (newVal))
// console.log(newVal)
// defaultData���������������������������
- // this.openeds="['1','2','3']"
- if (newVal !== oldVal) {
- // let that = this
- const newDefaultData = [
- {
- name: '',
- devices: []
- }
- ]
- let ke = 1
- this.defaultData.forEach((v, k, a) => {
- for (let i = 0; i < v.devices.length; i++) {
- // console.log(v.devices[i].name)
- if (v.devices[i].name.match(newVal)) {
- // console.log(v)
- // console.log('������')
- this.openeds.push((ke++).toString())
- // return value.devices[i].name.match(newVal)
- newDefaultData[k].name = this.defaultData[k].name
- newDefaultData[k].devices.push(v.devices[i])
- // this.$set(newDefaultData[k], 'name', this.defaultData[k].name)
- // this.$set(newDefaultData[k], 'devices', v.devices[i])
- // console.log(newDefaultData)
- } else {
- // console.log('���������')
- // return value.name.match(newVal)
- }
- // console.log(newDefaultData)
- }
- })
- // const newDevices = this.defaultData.filter(value => {
- // const newDevices = this.defaultData.filter(value => {
- // for (let i = 0; i < value.devices.length; i++) {
- // console.log(value.devices[i].name)
- // if (value.devices[i].name.match(newVal)) {
- // console.log('������')
- // this.openeds.push((ke++).toString())
- // return value.devices[i].name.match(newVal)
- // this.newDefaultData.push(value.devices[i].name.match(newVal))
- // } else {
- // console.log('���������')
- // return value.name.match(newVal)
- // }
- // }
- // })
- // console.log(this.openeds)
- this.defaultData = newDefaultData
- }
+ const copyData = _.cloneDeep(this.defaultDataMiddle)
+ this.defaultData = copyData
+ this.openeds = []
+ const arr = []
+ let ke = 1
+ const jList = []
if (newVal === '') {
- this.defaultData = this.defaultDataMiddle
+ this.defaultData = copyData
this.openeds = []
+ return
+ }
+ if (newVal !== oldVal) {
+ for (var i = 0; i < this.defaultData.length; i++) {
+ for (var j = 0; j < this.defaultData[i].devices.length; j++) {
+ if (this.defaultData[i].devices[j].name.indexOf(newVal.toUpperCase()) >= 0) {
+ this.openeds.push((ke++).toString())
+ jList.push(this.defaultData[i].devices[j])
+ }
+ }
+
+ console.log(arr)
+ }
+ this.defaultData = jList
+ console.log(this.defaultData)
}
},
changeCity(newVal, oldVal) {
@@ -236,6 +253,7 @@
this.getRegion()
},
methods: {
+
// ���������������������������������
bd09togcj02(bd_lon, bd_lat) {
var x_pi = (3.14159265358979324 * 3000.0) / 180.0
@@ -249,16 +267,18 @@
},
// ������������������������������������������������������
jump(items) {
+ console.log(items)
this.jumpData = []
// const newLL = this.bd09togcj02(items.longitude, items.latitude)
const newLL = [items.latitude, items.longitude]
this.jumpData.push(newLL[0])
this.jumpData.push(newLL[1])
- // console.log(this.jumpData)
+ console.log(this.jumpData)
this.$refs.child.jumpMap(this.jumpData)
},
// ���������������������
deviceDetail(mac, item, items, indexs) {
+ // this.$message.warning('���������������������������������������')
// console.log('������������������������')
// console.log(mac)
// console.log(item)
@@ -285,7 +305,7 @@
},
query: {
monitorPointInfo: JSON.stringify(item),
- device: items,
+ device: JSON.stringify(items),
macName: mac,
indexs: indexs,
items: [items.latitude, items.longitude]
@@ -301,20 +321,22 @@
this.getData()
this.$refs.child.getRegionApiRequest()
this.jump({ latitude: this.weidu, longitude: this.jingdu })
+ console.log(this.weidu, '������')
+ console.log(this.jingdu, '������')
},
// ������������������������
getData() {
this.monitorPointIds = []
this.$request({
- url: '/monitorPoint/queryMonitorPoints',
+ url: '/monitorPoint/queryMonitorPointsState',
method: 'get',
params: {
organizationId: this.organizationId,
regionCode: this.$store.state.regionCode
}
})
- .then(res => {
- // console.log(res)
+ .then((res) => {
+ console.log(res, '123')
this.monitorPointIds = []
// console.log(this.monitorPointIds)
this.weidu = res.data.monitorPoints[0].devices[0].latitude
@@ -333,7 +355,10 @@
let devisesLength = 0
if (this.defaultData[i].devices) {
for (let j = 0; j < this.defaultData[i].devices.length; j++) {
- if (this.defaultData[i].devices.length > 1 && this.defaultData[i].devices[j].state === '0') {
+ if (
+ this.defaultData[i].devices.length > 1 &&
+ this.defaultData[i].devices[j].state === '0'
+ ) {
devisesLength++
// continue
if (devisesLength === this.defaultData[i].devices.length) {
@@ -354,7 +379,7 @@
this.$store.state.monitorPointName = res.data.monitorPoints[0].name
Bus.$emit('monitorPointIds', this.monitorPointIds) // ������������������������monitorPointIds
})
- .catch(error => {
+ .catch((error) => {
console.log(error)
// console.log('������')
this.defaultData = []
@@ -368,7 +393,7 @@
organizationId: this.$store.state.orgId
}
})
- .then(res => {
+ .then((res) => {
// console.log('������������getMapPath������')
// console.log(res.data)
// console.log(res)
@@ -394,7 +419,7 @@
}
}
})
- .catch(err => {
+ .catch((err) => {
// console.log('������Region������')
console.log(err)
})
@@ -477,4 +502,7 @@
.title {
padding: 0 20px;
}
+.elwidth {
+ width: 400px;
+}
</style>
--
Gitblit v1.8.0