From 7beb37c5170f93a33c059c72fac3233b82865481 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Sun, 04 Feb 2024 09:43:09 +0800 Subject: [PATCH] fix:修改成16位风向值 --- src/views/deviceDetail/index.vue | 171 +++++++++++++++++++++++++++++++++----------------------- 1 files changed, 100 insertions(+), 71 deletions(-) diff --git a/src/views/deviceDetail/index.vue b/src/views/deviceDetail/index.vue index 0fe0de8..7859683 100644 --- a/src/views/deviceDetail/index.vue +++ b/src/views/deviceDetail/index.vue @@ -38,7 +38,10 @@ :key="i" style="flex: 1; display: flex" > - <span style="width: 33%; font-size: 0.9rem" @click="chuan(val)">{{ + <span + style="width: 33%; font-size: 0.9rem" + @click="chuan(val)" + >{{ val.sensorCode | sensorFilter }}</span> <span @@ -75,7 +78,10 @@ " > <div style="position: relative"> - <img style="width: 5.5rem; height: 5.5rem" :src="compassBg"> + <img + style="width: 5.5rem; height: 5.5rem" + :src="compassBg" + > <img style=" font-size: 2rem; @@ -111,7 +117,9 @@ justify-content: center; " > - <div style="font-size: 0.9rem">������������������(������������)</div> + <div style="font-size: 0.9rem"> + ������������������(������������) + </div> <div style="font-size: 1.5rem; margin-top: 7px"> {{ aqi }}<span style="font-size: 0.8rem">(AQI)</span> </div> @@ -119,22 +127,27 @@ </div> </el-main> </el-aside> - <el-container class="border-left border-right" style="margin: 0 10px"> + <el-container + class="border-left border-right" + style="margin: 0 10px" + > <el-header class="title0" style="text-align: center; display: unset !important; margin-top: 10px" - ><h1 - style=" + > + <h1 + style=" text-align: center; text-align: center; margin: 0; padding-top: 20px; font-size: 1.2rem; " - @click="websocketData()" - > - {{ deviceName ? deviceName : '������' }} - </h1></el-header> + @click="websocketData()" + > + {{ deviceName ? deviceName : '������' }} + </h1> + </el-header> <el-main style=" padding-left: 0; @@ -211,8 +224,15 @@ </div> </div> </div> - <div class="border-top" style="display: flex; height: 50%"> - <div ref="main" class="middle1" style="flex: 1; padding-top: 2rem" /> + <div + class="border-top" + style="display: flex; height: 50%" + > + <div + ref="main" + class="middle1" + style="flex: 1; padding-top: 2rem" + /> <!-- <line-chart :chart-data="lineChartData" /> --> <div class="border-left middle2" @@ -223,9 +243,13 @@ margin-left: 10px; " > - <h3 style="font-size: 0.9rem">���������������</h3> + <h3 style="font-size: 0.9rem"> + ��������������� + </h3> <div> - <div style="font-size: 0.9rem">{{ chartSensorName }}</div> + <div style="font-size: 0.9rem"> + {{ chartSensorName }} + </div> <div style="padding: 8px 0 0; font-size: 2.3rem; font-weight: bold" > @@ -265,17 +289,30 @@ > <div style="height: 100%; display: flex; flex-direction: column"> <div style="height: 30%"> - <h3 v-if="macLat" style="text-align: center; font-size: 0.9rem"> + <h3 + v-if="macLat" + style="text-align: center; font-size: 0.9rem" + > <span>���������</span> {{ macLat }}, {{ macLng }} </h3> - <h3 style="font-size: 0.9rem">������������������������</h3> + <h3 style="font-size: 0.9rem"> + ������������������������ + </h3> </div> <div style="height: 70%"> <!-- padding-top: 4%--> - <img :src="url1" alt="" style="width: 70%"> + <img + :src="url1" + alt="" + style="width: 70%" + > </div> <div> - <img style="width: 75%" :src="url2" alt=""> + <img + style="width: 75%" + :src="url2" + alt="" + > </div> </div> </div> @@ -284,7 +321,9 @@ class="right1" style="height: 40%; display: flex; flex-direction: column" > - <h3 style="text-align: center; font-size: 0.9rem">������������</h3> + <h3 style="text-align: center; font-size: 0.9rem"> + ������������ + </h3> <ul class="listUl" style=" @@ -310,7 +349,9 @@ class="right1" style="height: 40%; display: flex; flex-direction: column" > - <h3 style="text-align: center; font-size: 0.9rem">���������</h3> + <h3 style="text-align: center; font-size: 0.9rem"> + ��������� + </h3> <ul class="listUl" style=" @@ -336,7 +377,7 @@ <script> // ���������������������������������������������������������js������������������js���json������������������������������ // ���������import������������������from'������������������'; - +import { WWindUtil } from '@/components/Wind/WRatingArr.js' import json from '@/assets/json/sensor.json' import * as echarts from 'echarts' // import { parse } from 'path-to-regexp' @@ -350,13 +391,13 @@ }, filters: { // ���������������websocket���������������key��� - sensorFilter: function(value) { + sensorFilter: function (value) { if (!value) return '' return json[value] } }, props: {}, - data() { + data () { // ������������������ return { circle: 0, @@ -439,25 +480,25 @@ }, // ������������ ���������data������ computed: { - leftaSide() { + leftaSide () { return this.$store.state.leftaSide } }, // ������data������������������ watch: { - PM2_5Data(val) { + PM2_5Data (val) { // console.log('���������' + val) this.myChart = null this.drawChart() }, - leftaSide(n, o) { + leftaSide (n, o) { // this.myChart.resize() this.myChart = null // this.drawChart() } }, // ������������ - ��������������������������������� this ��������� - created() { + created () { this.$store.dispatch('app/toggleSideBar', 0) // this.$Cookies.set('sidebarStatus', 1) // setTimeout(() => { @@ -489,7 +530,7 @@ // this.ws.send('{"mac":' + '"' + this.macName + '"' + ',"accountIdInfo":' + this.$store.state.accountId + '}') }, // ������������ - ��������������������������� DOM ��������� - mounted() { + mounted () { // this.$nextTick(() => { // console.log('zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz') // this.drawChart() @@ -503,11 +544,11 @@ // ��������������������������� // this.getCircleWH() }, - beforeCreate() {}, // ������������ - ������������ - beforeMount() {}, // ������������ - ������������ - beforeUpdate() {}, // ������������ - ������������ - updated() {}, // ������������ - ������������ - beforeDestroy() { + beforeCreate () {}, // ������������ - ������������ + beforeMount () {}, // ������������ - ������������ + beforeUpdate () {}, // ������������ - ������������ + updated () {}, // ������������ - ������������ + beforeDestroy () { if (this.ws) { this.ws.close() } @@ -515,11 +556,11 @@ clearInterval(this.timer) // ���Vue������������������������������������������ } }, // ������������ - ������������ - destroyed() {}, // ������������ - ������������ - activated() {}, + destroyed () {}, // ������������ - ������������ + activated () {}, // ������������ methods: { - chuan(val) { + chuan (val) { console.log(val) this.chartSensorKey[0] = {} this.chartSensorKey[0] = val @@ -529,7 +570,7 @@ // console.log(this.chartSensorKey[0].sensorCode); // console.log(this.chartSensorKey) }, - chuan2(val) { + chuan2 (val) { console.log(val) this.chartSensorKey[0] = {} this.chartSensorKey[0] = val @@ -538,7 +579,7 @@ this.filterSensorName() }, // ��������������������� - getCircleWH() { + getCircleWH () { // var circleWHList = document.getElementsByClassName('circleWH') // var dom = this.$refs.test // var circleWHWidth = circleWHList[0].offsetWidth @@ -546,13 +587,13 @@ // console.log(circleWHWidth, circleWHeight, '������') }, // ������������������������ - filterSensorName() { + filterSensorName () { this.chartSensorName = this.$options.filters.sensorFilter( this.chartSensorKey[0].sensorCode ) }, // ������������������ - sensorLayout() { + sensorLayout () { return new Promise((resolve, reject) => { this.$request({ url: '/organizationLayout/getLayoutByMac', @@ -582,7 +623,7 @@ }) }, // ������������������������ - getAlarmLevels() { + getAlarmLevels () { this.$axios .get('http://121.43.179.139:8080/screen_api_v2/screen/alarm-levels', { params: { @@ -600,9 +641,9 @@ }) }, // ������������������������ - getTime() { + getTime () { var _this = this // ������������������������Vue������this������������������������ - this.timer = setInterval(function() { + this.timer = setInterval(function () { _this.currentTime = // ������������date _this.appendZero(new Date().getFullYear()) + '-' + @@ -617,11 +658,11 @@ _this.appendZero(new Date().getSeconds()) }, 1000) }, - appendZero(obj) { + appendZero (obj) { return obj < 10 ? '0' + obj : obj }, // ������������������������������ - reMac(newMac, i, name) { + reMac (newMac, i, name) { this.PM2_5Data = [] this.wsData2 = null this.url1 = require('@/assets/images/alarmlevel-1.png') @@ -639,14 +680,14 @@ } }, // ������������ - getkeyName() { + getkeyName () { for (var kn in this.wsData2) { this.keyName.push(kn) alert(this.keyName) } }, // ������������������������������ - getHourlyAqi() { + getHourlyAqi () { this.$request({ url: '/deviceInfo/getHourlyAqi', method: 'get', @@ -665,7 +706,7 @@ }) }, // ��������������������������������������� - getSensorMonthAvg() { + getSensorMonthAvg () { this.$request({ url: '/deviceInfo/getMonthAvg', method: 'get', @@ -685,7 +726,7 @@ }) }, // ��������������������� - alarmSort() { + alarmSort () { this.sensorLayout().then(() => { var newAlarmLevel = {} for (let i = 0; i < this.totalArray.length; i++) { @@ -700,7 +741,7 @@ }) }, // ws������ - websocketData() { + websocketData () { if (this.ws) { this.ws.close() } @@ -724,13 +765,13 @@ console.log('socketUrl', socketUrl) this.ws = new WebSocket(socketUrl) - this.ws.onopen = function() { + this.ws.onopen = function () { console.log('websocket������������') } console.log(2) // this.ws.send('{"mac":' + '"' + this.macName + '"' + ',"accountIdInfo":' + this.$store.state.accountId + '}') // ������������������ - this.ws.onmessage = function(msg) { + this.ws.onmessage = function (msg) { // console.log(1); // if (JSON.parse(msg.data).������) { that.wsData2 = JSON.parse(msg.data) @@ -752,20 +793,8 @@ that.windDeg = windDirs if (windDirs === 0) { that.windDir = '������' - } else if (windDirs > 0 && windDirs < 90) { - that.windDir = '���������' - } else if (windDirs === 90) { - that.windDir = '������' - } else if (windDirs > 90 && windDirs < 180) { - that.windDir = '���������' - } else if (windDirs === 180) { - that.windDir = '������' - } else if (windDirs > 180 && windDirs < 270) { - that.windDir = '���������' - } else if (windDirs === 270) { - that.windDir = '������' - } else if (windDirs > 270 && windDirs < 360) { - that.windDir = '���������' + } else { + that.windDir = WWindUtil.windValueFormat(windDirs) } } that.alarmColour = {} @@ -1199,7 +1228,7 @@ } }, // ��������������������� - queryAlarmByMac() { + queryAlarmByMac () { this.$request({ url: '/deviceInfo/queryAlarmByMac', method: 'get', @@ -1231,7 +1260,7 @@ }) }, // ��������� - drawChart() { + drawChart () { const that = this var bar_dv = this.$refs.main if (bar_dv) { @@ -1251,7 +1280,7 @@ bottom: 25 }, tooltip: { - formatter: function(res) { + formatter: function (res) { console.log(res, 'res') var result = '' var html1 = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:red;"></span>' @@ -1322,8 +1351,8 @@ ] } that.myChart.setOption(option) - setTimeout(function() { - window.onresize = function() { + setTimeout(function () { + window.onresize = function () { that.myChart.resize() } }, 200) -- Gitblit v1.8.0