Commit 2c6c852b authored by caicaicai's avatar caicaicai

环境监测页面编写

parent 680934fc
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">车辆定位报警记录查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">车辆定位历史数据查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">车辆定位实时数据查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
<template>
<div>
<span>环境在线监测首页</span>
<div class="AutomationHomepageViews">
<div class="AutomationBrieflyMenuBar">
<div class="AutomationSpecificItems" v-for="(item,index) in brieflyMenuBarArray" :key="index">
<div style="display: flex;justify-content: space-between;padding: 33px 25px 0px;">
<div style="font-size:16px;"><span style="color:white;">{{item.name}}</span><span style="color:rgb(9,199,204);">{{item.context}}</span></div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data(){
return{
brieflyMenuBarArray:[
{name:"噪声监测",context:"200dB"},
{name:"温度监测",context:"32℃"},
{name:"风速监测",context:"10m/s"},
{name:"湿度监测",context:"100%RH"},
{name:"风向监测",context:"东北风"},
{name:"大气压监测",context:"200KPa"},
{name:"扬尘监测",context:"正常"},
],
}
}
}
</script>
<style>
<style scoped>
*{
margin: 0;
padding: 0;
}
.AutomationHomepageViews{
background-color: rgb(0,20,78);
width: 100%;
height: 100%;
position: relative;
}
.AutomationBrieflyMenuBar{
position: relative;
top: 8%;
left: 2%;
width: 350px;
}
.AutomationSpecificItems{
width: 100%;
height: 90px;
background-image: url('../../imgs/changkuang1.png');
background-size: 100% 100%;
}
</style>
\ No newline at end of file
This diff is collapsed.
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">人员定位报警记录查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">人员定位历史数据查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">人员定位实时数据查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -2,7 +2,7 @@
<div class="AuHiViewBody">
<div class="AuHiTop">
<div style="font-size:20px;font-weight:600;">查询搜索</div>
<div style="font-size:20px;font-weight:600;">生产报表查询搜索</div>
<div style="margin-top:10px;display:flex;">
<div>
<template>
......
......@@ -47,55 +47,36 @@ export default {
var myChart1 = echarts.init(document.querySelector('#sensor1'));
var option1 = {
title: {
text: '坝体表面位移0-7传感器位置变化量',
text: '传感器坝体表面位移0-7',
left:"center",
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['坝体表面位移0-7(左右)', '坝体表面位移0-7(前后)', '橙色警戒线', '红色警戒线'],
data: ['坝体表面位移0-7(沉降大小0.01毫米)'],
y:'bottom',
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
splitLine:{
show:true
}
data: ['', '', '', '', '', '', '','', '', '', '', '', '']
},
yAxis: {
type: 'value',
name:"毫米",
max:40,
min:-10,
min:0,
max:25,
splitNumber : 5,
splitLine:{
show:true,
}
},
series: [
{
name: '坝体表面位移0-7(左右)',
type: 'line',
data: [0, 0, 0, 0, 0, 0, 0]
},
{
name: '坝体表面位移0-7(前后)',
type: 'line',
data: [1, 1, 1, 1, 1, 1, 1]
name:"高度(米)",
},
{
name: '橙色警戒线',
type: 'line',
data: [25, 25, 25, 25, 25, 25, 25]
},
{
name: '红色警戒线',
type: 'line',
data: [30, 30, 30, 30, 30, 30, 30]
},
]
series: [{
name:"坝体表面位移0-7(沉降大小0.01毫米)",
data: [0, 0, 0, 0, 0, 5, 7, 9, 12, 15, 17, 19, 19],
type: 'line'
}]
};
option1 && myChart1.setOption(option1);
var myChart2 = echarts.init(document.querySelector('#sensor2'));
......@@ -155,55 +136,36 @@ export default {
var myChart3 = echarts.init(document.querySelector('#sensor3'));
var option3 = {
title: {
text: '坝体表面位移0-7传感器位置变化量',
text: '传感器坝体表面位移0-7',
left:"center",
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['坝体表面位移0-7(左右)', '坝体表面位移0-7(前后)', '橙色警戒线', '红色警戒线'],
data: ['坝体表面位移0-7(沉降大小0.01毫米)'],
y:'bottom',
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
splitLine:{
show:true
}
data: ['', '', '', '', '', '', '','', '', '', '', '', '']
},
yAxis: {
type: 'value',
name:"毫米",
max:40,
min:-10,
min:0,
max:25,
splitNumber : 5,
splitLine:{
show:true,
}
},
series: [
{
name: '坝体表面位移0-7(左右)',
type: 'line',
data: [0, 0, 0, 0, 0, 0, 0]
},
{
name: '坝体表面位移0-7(前后)',
type: 'line',
data: [1, 1, 1, 1, 1, 1, 1]
name:"高度(米)",
},
{
name: '橙色警戒线',
type: 'line',
data: [25, 25, 25, 25, 25, 25, 25]
},
{
name: '红色警戒线',
type: 'line',
data: [30, 30, 30, 30, 30, 30, 30]
},
]
series: [{
name:"坝体表面位移0-7(沉降大小0.01毫米)",
data: [0, 0, 0, 0, 0, 5, 7, 9, 12, 15, 17, 19, 19],
type: 'line'
}]
};
option3 && myChart3.setOption(option3);
var myChart4 = echarts.init(document.querySelector('#sensor4'));
......
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