From 500ddf6571e656f33ef7fe10c570f6345344c989 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Thu, 01 Feb 2024 15:47:38 +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