Skip to content

S
SmartAgricWeb
Commit 9aa4cde5 authored by zhanglw's avatar zhanglw
Browse files
Options

x

parent edd05f12
Hide whitespace changes
Inline Side-by-side
Showing with 111 additions and 23 deletions
src/api/common.js
View file @ 9aa4cde5
......@@ -56,7 +56,12 @@ export const HttpReq = {
dynamic: function(params) {
return request({
url: 'api/dynamic?' + qs.stringify(params, { indices: false }),
dataType: 'json',
method: 'get'
})
},
findDevicesByProjectId: function(params) {
return request({
url: 'api/dynamic/findDevicesByProjectId?' + qs.stringify(params, { indices: false }),
method: 'get'
})
},
......
src/views/daping.vue
View file @ 9aa4cde5
......@@ -37,11 +37,12 @@
</div>
</div>
<div class="box_div">
<div class="box_title"><span class="touch" @click="visible=!visible">{{ currentBase.proName }}基地设备实时监测<a style="font-size:16px;vertical-align: top"> ▼ </a></span></div>
<div class="box_title"><span class="touch" @click="vDataObj2.visible=!vDataObj2.visible">设备实时监测<a v-if="vDataObj2.list[vDataObj2.index]" style="font-size:16px;vertical-align: top"> {{ vDataObj2.list[vDataObj2.index].name }} ▼ </a></span></div>
<div class="select-box">
<ul v-show="visible">
<li v-for="(item,index) in vDataMap.proListInfo" :key="index" :class="currentBase===item?'active':''" class="touch" @click="changeItem(item,index)">
{{ item.proName }}
<ul v-show="vDataObj2.visible">
<li v-for="(item,index) in vDataObj2.list" :key="'co2'+index" :class="vDataObj2.list[vDataObj2.index]===item?'active':''" class="touch" @click="changeChartItem(vDataObj2,index)">
<span v-if="item.online">{{ item.name }}（在线）</span>
<span v-else class="translucent">{{ item.name }}（离线）</span>
</li>
</ul>
</div>
......@@ -51,63 +52,63 @@
<li>
<div>
<span v-if="vData2.connectionStatus" style="font-weight: 400;color: white">已连接</span>
<span v-else style="font-weight: 400;color: #c3c3c3">未连接</span>
<span v-else style="font-weight: 400;color: #b7b7b7">未连接</span>
<font>&nbsp;</font>
</div>
<p>连接状态</p>
</li>
<li>
<div>
<span>{{ vData2.soilMoisture||'-' }}</span>
<span>{{ vData2.soilMoisture||'—' }}</span>
<font>%</font>
</div>
<p>土壤湿度</p>
</li>
<li>
<div>
<span style="color:#FFBB2E">{{ vData2.soilTemperature||'-' }}</span>
<span style="color:#FFBB2E">{{ vData2.soilTemperature||'—' }}</span>
<font>°C</font>
</div>
<p>土壤温度</p>
</li>
<li>
<div>
<span style="color:#FFBB2E">{{ vData2.tsp||'-' }}</span>
<span style="color:#FFBB2E">{{ vData2.tsp||'—' }}</span>
<font>ug/m3</font>
</div>
<p>TSP</p>
</li>
<li>
<div>
<span>{{ vData2.windSpeed||'-' }}</span>
<span>{{ vData2.windSpeed||'—' }}</span>
<font>m/s</font>
</div>
<p>风速</p>
</li>
<li>
<div>
<span style="color:#FF547C">{{ vData2.windDirection||'-' }}</span>
<span style="color:#FF547C">{{ vData2.windDirection||'—' }}</span>
<font>风</font>
</div>
<p>风向</p>
</li>
<li>
<div>
<span style="color:#FFBB2E">{{ vData2.airTemperature||'-' }}</span>
<span style="color:#FFBB2E">{{ vData2.airTemperature||'—' }}</span>
<font>°C</font>
</div>
<p>空气温度</p>
</li>
<li>
<div>
<span>{{ vData2.airHumidity||'-' }}</span>
<span>{{ vData2.airHumidity||'—' }}</span>
<font>%</font>
</div>
<p>空气湿度</p>
</li>
<li>
<div>
<span style="color:#FF547C">{{ vData2.atmosphericPressure||'-' }}</span>
<span style="color:#FF547C">{{ vData2.atmosphericPressure||'—' }}</span>
<font>kpa</font>
</div>
<p>大气压</p>
......@@ -211,15 +212,39 @@
<div ref="chart2" class="chart_box"/>
</div>
<div class="box_div">
<div class="box_title"><span>土壤水分监测</span></div>
<div class="box_title"><span class="touch" @click="chartData3.visible=!chartData3.visible">土壤水分监测<a v-if="chartData3.list[chartData3.index]" style="font-size:16px;vertical-align: top"> {{ chartData3.list[chartData3.index].name }} ▼ </a></span></div>
<div class="select-box">
<ul v-show="chartData3.visible">
<li v-for="(item,index) in chartData3.list" :key="'co2'+index" :class="chartData3.list[chartData3.index]===item?'active':''" class="touch" @click="changeChartItem(chartData3,index)">
<span v-if="item.online">{{ item.name }}（在线）</span>
<span v-else class="translucent">{{ item.name }}（离线）</span>
</li>
</ul>
</div>
<div ref="chart3" class="chart_box"/>
</div>
<div class="box_div">
<div class="box_title"><span>温湿度气象监测</span></div>
<div class="box_title"><span class="touch" @click="chartData4.visible=!chartData4.visible">温湿度气象监测<a v-if="chartData4.list[chartData4.index]" style="font-size:16px;vertical-align: top"> {{ chartData4.list[chartData4.index].name }} ▼ </a></span></div>
<div class="select-box">
<ul v-show="chartData4.visible">
<li v-for="(item,index) in chartData4.list" :key="'co2'+index" :class="chartData4.list[chartData4.index]===item?'active':''" class="touch" @click="changeChartItem(chartData4,index)">
<span v-if="item.online">{{ item.name }}（在线）</span>
<span v-else class="translucent">{{ item.name }}（离线）</span>
</li>
</ul>
</div>
<div ref="chart4" class="chart_box"/>
</div>
<div class="box_div">
<div class="box_title"><span>二氧化碳室外气象监测</span></div>
<div class="box_title"><span class="touch" @click="chartData5.visible=!chartData5.visible">二氧化碳室外气象监测<a v-if="chartData5.list[chartData5.index]" style="font-size:16px;vertical-align: top"> {{ chartData5.list[chartData5.index].name }} ▼ </a></span></div>
<div class="select-box">
<ul v-show="chartData5.visible">
<li v-for="(item,index) in chartData5.list" :key="'co2'+index" :class="chartData5.list[chartData5.index]===item?'active':''" class="touch" @click="changeChartItem(chartData5,index)">
<span v-if="item.online">{{ item.name }}（在线）</span>
<span v-else class="translucent">{{ item.name }}（离线）</span>
</li>
</ul>
</div>
<div ref="chart5" class="chart_box"/>
</div>
</div>
......@@ -235,7 +260,6 @@ import enterpriseImg from '@/assets/home/enterpriseImg.png'
import linePoint from '@/assets/home/point.png'
import { HttpReq } from '@/api/common'
import mark from '@/assets/home/mark.png'
import { randNormality } from '../utils'
export default {
data() {
......@@ -249,6 +273,12 @@ export default {
name: ''
},
vData1: {},
vDataObj2: {
index: 0,
list: [],
visible: false,
drawFnName: 'initVData2'
},
vData2: {},
vData34: {
realTimeAlarm: [],
......@@ -262,6 +292,24 @@ export default {
chart3: null,
chart4: null,
chart5: null,
chartData3: {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart3'
},
chartData4: {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart4'
},
chartData5: {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart5'
},
querySocketTimer: null
}
},
......@@ -292,21 +340,50 @@ export default {
this.currenIndex = index
this.visible = false
this.mapDom.setCenter([this.currentBase.proLng, this.currentBase.proLat])
this.vDataObj2 = {
index: 0,
list: [],
visible: false,
drawFnName: 'initVData2'
}
this.chartData3 = {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart3'
}
this.chartData4 = {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart4'
}
this.chartData5 = {
index: 0,
list: [],
visible: false,
drawFnName: 'initChart5'
}
this.loadData()
},
changeChartItem(dataObj, index) {
dataObj.index = index
dataObj.visible = false
this[dataObj.drawFnName](dataObj.list[dataObj.index])
},
loadData() {
this.$nextTick(() => {
HttpReq.webClientApi.population({}).then((res) => {
this.vData1 = res.data.equipmentMonitoringStatus
this.vData34 = res.data
})
HttpReq.webClientApi.dynamic({}).then((res) => {
HttpReq.webClientApi.dynamic({ proId: this.currentBase.proId }).then((res) => {
const d = res.data
this.vData2 = d['equipmentMonitoringDto']
this.vDataObj2.list = d['allDevices']
this.initChart2(d['meteorologicalMonitoring'])
// this.initChart3(d['soilMonitoring'])
// this.initChart4(d['temperatureAndHumidityMonitoring'])
// this.initChart5(d['co2Monitoring'])
this.chartData3.list = d['soilDevices']
this.chartData4.list = d['wsdDevices']
this.chartData5.list = d['co2Devices']
})
})
},
......@@ -335,6 +412,9 @@ export default {
}
/* eslint-enable */
},
initVData2(item) {
console.log(item)
},
initChart1() {
this.chart1 = echarts.init(this.$refs.chart1, 'macarons')
const dataX = this.vDataMap.proListInfo.map((item) => { return item.proName })
......@@ -1303,6 +1383,9 @@ export default {
.touch {
cursor:pointer;
}
.translucent {
opacity: 0.6;
}
.chart_box {
width: 100%;
height: 170px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment