From a19b20afeacf84c1c743c76b5018bcfbddac2270 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Fri, 15 Nov 2024 09:10:12 +0800 Subject: [PATCH] fix: 国控站 --- src/views/main/index.vue | 218 +++++++++++++++++++++++++++++++----------------------- 1 files changed, 126 insertions(+), 92 deletions(-) diff --git a/src/views/main/index.vue b/src/views/main/index.vue index 79ae316..9b477bd 100644 --- a/src/views/main/index.vue +++ b/src/views/main/index.vue @@ -1,13 +1,16 @@ <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" + v-if="$store.state.aside" width="260px" 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 +18,48 @@ :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" + 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 +67,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> @@ -79,8 +128,8 @@ <el-container> <!-- <Map :mpid="monitorPointId" :rc="regionCode" /> --> <compoment - :is="this.$store.state.type" - v-if="weidu&&jingdu" + :is="$store.state.type" + v-if="weidu && jingdu" ref="child" :weidu="weidu" :jingdu="jingdu" @@ -101,6 +150,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' @@ -134,7 +184,7 @@ ReportForm // vLineChart }, - data() { + data () { return { openeds: [], searchText: '', @@ -157,69 +207,42 @@ } }, computed: { - changeCity() { + changeCity () { return this.$store.state.regionCode } }, watch: { - searchText(newVal, oldVal) { - // console.log(oldVal) + searchText (newVal, 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) { + changeCity (newVal, oldVal) { // console.log(newVal) if (newVal !== oldVal) { // this.$store.state.regionCode = newVal @@ -228,16 +251,17 @@ } } }, - beforeCreate() { + beforeCreate () { // this.$store.state.regionCode = this.$route.params.cName }, - created() { + created () { this.getData() this.getRegion() }, methods: { + // ��������������������������������� - bd09togcj02(bd_lon, bd_lat) { + bd09togcj02 (bd_lon, bd_lat) { var x_pi = (3.14159265358979324 * 3000.0) / 180.0 var x = bd_lon - 0.0065 var y = bd_lat - 0.006 @@ -248,17 +272,19 @@ return [gg_lat, gg_lng] }, // ������������������������������������������������������ - jump(items) { + 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) { + deviceDetail (mac, item, items, indexs) { + // this.$message.warning('���������������������������������������') // console.log('������������������������') // console.log(mac) // console.log(item) @@ -285,7 +311,7 @@ }, query: { monitorPointInfo: JSON.stringify(item), - device: items, + device: JSON.stringify(items), macName: mac, indexs: indexs, items: [items.latitude, items.longitude] @@ -293,7 +319,7 @@ }) }, // ������regionCode������������������������������������������������ - getRegionApi() { + getRegionApi () { // console.log('������getRegionApi') // console.log(this.newRegion[this.newRegion.length - 1]) this.$store.state.regionCode = this.newRegion[this.newRegion.length - 1] @@ -301,20 +327,22 @@ this.getData() this.$refs.child.getRegionApiRequest() this.jump({ latitude: this.weidu, longitude: this.jingdu }) + console.log(this.weidu, '������') + console.log(this.jingdu, '������') }, // ������������������������ - getData() { + 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 +361,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,13 +385,13 @@ 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 = [] }) }, - getRegion() { + getRegion () { this.$request({ url: '/organization/getMapPath', method: 'get', @@ -368,7 +399,7 @@ organizationId: this.$store.state.orgId } }) - .then(res => { + .then((res) => { // console.log('������������getMapPath������') // console.log(res.data) // console.log(res) @@ -394,7 +425,7 @@ } } }) - .catch(err => { + .catch((err) => { // console.log('������Region������') console.log(err) }) @@ -477,4 +508,7 @@ .title { padding: 0 20px; } +.elwidth { + width: 400px; +} </style> -- Gitblit v1.8.0