|
|
<template>
|
|
|
<div class="weatherBox">
|
|
|
<div class="weatherContain">
|
|
|
<leftTree ref="sideTree"></leftTree>
|
|
|
<div class="rightTable">
|
|
|
<div class="dataBox">
|
|
|
<div class="fatherTableShowBox" v-if="!childFlag">
|
|
|
<el-table
|
|
|
:data="tableData"
|
|
|
style="width: 100%"
|
|
|
height="calc(100% - 40px)"
|
|
|
>
|
|
|
<el-table-column prop="line" label="线路"> </el-table-column>
|
|
|
<el-table-column prop="pole" label="杆塔"> </el-table-column>
|
|
|
<el-table-column prop="terminal" label="终端"> </el-table-column>
|
|
|
<el-table-column prop="time" label="时间"> </el-table-column>
|
|
|
<el-table-column prop="temperature" label="温度(℃)">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="humidity" label="湿度(%RH)">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="windSpeed" label="瞬时风速(m/s)">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="windDirection" label="瞬时风向(°)">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="rainfall" label="雨量(mm/hour)">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="pressure" label="气压(hPa(百帕))">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="sunlight" label="日照(W/m2)">
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div class="pageNation">
|
|
|
<el-pagination
|
|
|
@current-change="handleCurrentChange"
|
|
|
@size-change="handleSizeChange"
|
|
|
:current-page="page"
|
|
|
:page-size="pageSize"
|
|
|
layout="sizes, prev, pager, next, jumper,total"
|
|
|
:total="total"
|
|
|
>
|
|
|
</el-pagination>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="childBox" v-else>
|
|
|
<div class="searchBox" ref="searchref">
|
|
|
<el-form
|
|
|
:inline="true"
|
|
|
:model="formdata"
|
|
|
class="demo-form-inline"
|
|
|
>
|
|
|
<el-form-item label="开始日期">
|
|
|
<el-date-picker
|
|
|
v-model="formdata.starttime"
|
|
|
type="date"
|
|
|
placeholder="开始日期"
|
|
|
>
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="结束日期">
|
|
|
<el-date-picker
|
|
|
v-model="formdata.endtime"
|
|
|
type="date"
|
|
|
placeholder="结束日期"
|
|
|
class="ml10"
|
|
|
>
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="onSubmit">查询</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<div class="childTableShowBox">
|
|
|
<el-table :data="childTableDate" style="width: 100%">
|
|
|
<el-table-column prop="time" label="时间"></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="temperature"
|
|
|
label="温度(℃)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="humidity"
|
|
|
label="湿度(%RH)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="windSpeed"
|
|
|
label="瞬时风速(m/s)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="windDirection"
|
|
|
label="瞬时风向(°)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="rainfall"
|
|
|
label="雨量(mm/hour)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="pressure"
|
|
|
label="气压(hPa(百帕))"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="sunlight"
|
|
|
label="日照(W/m2)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="minuteAverageWindSpeed"
|
|
|
label="1分钟平均风速(m/s)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="minuteAverageWindDirection"
|
|
|
label="1分钟平均风向(°)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="tenMinuteAverageWindSpeed"
|
|
|
label="10分钟平均风速(m/s)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="tenMinuteAverageWindDirection"
|
|
|
label="10分钟平均风向(°)"
|
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
|
prop="tenMinuteMaxWindSpeed"
|
|
|
label="10分钟最大风速(m/s)"
|
|
|
></el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="pageNation">
|
|
|
<el-pagination
|
|
|
@current-change="handleCurrentChange"
|
|
|
@size-change="handleSizeChange"
|
|
|
:current-page="page"
|
|
|
:page-size="pageSize"
|
|
|
layout="sizes, prev, pager, next, jumper,total"
|
|
|
:total="total"
|
|
|
>
|
|
|
</el-pagination>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import leftTree from "../../fubingCommon/leftTree";
|
|
|
export default {
|
|
|
name: "weather",
|
|
|
components: {
|
|
|
leftTree,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
msg: "",
|
|
|
childFlag: false,
|
|
|
tableData: [],
|
|
|
childTableDate: [],
|
|
|
formdata: {},
|
|
|
page: 1, // 当前页数
|
|
|
pageSize: 20, // 每页数量
|
|
|
total: 0, //总条数
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
var that = this;
|
|
|
document.onkeydown = function (e) {
|
|
|
var key = window.event.keyCode;
|
|
|
if (key === 13) {
|
|
|
that.onSubmit(); // 触发事件
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
this.$set(
|
|
|
this.formdata,
|
|
|
"starttime",
|
|
|
new Date(new Date().toLocaleDateString()).getTime()
|
|
|
);
|
|
|
this.$set(this.formdata, "endtime", new Date().getTime());
|
|
|
},
|
|
|
methods: {
|
|
|
getCurrentData(data) {
|
|
|
console.log("执行父组件", data);
|
|
|
if (data.dyValue) {
|
|
|
console.log("电压");
|
|
|
this.msg = "公司所有数据";
|
|
|
this.childFlag = false;
|
|
|
this.tableData = [
|
|
|
{
|
|
|
line: "线路A",
|
|
|
pole: "杆塔1",
|
|
|
terminal: "终端1",
|
|
|
time: "2023-03-15 08:00:00",
|
|
|
temperature: "25℃",
|
|
|
humidity: "60%",
|
|
|
windSpeed: "0.5m/s",
|
|
|
windDirection: "120°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1015hPa",
|
|
|
sunlight: "500W/m2",
|
|
|
},
|
|
|
{
|
|
|
line: "线路B",
|
|
|
pole: "杆塔2",
|
|
|
terminal: "终端2",
|
|
|
time: "2023-03-15 09:00:00",
|
|
|
temperature: "23℃",
|
|
|
humidity: "70%",
|
|
|
windSpeed: "0.3m/s",
|
|
|
windDirection: "90°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1013hPa",
|
|
|
sunlight: "350W/m2",
|
|
|
},
|
|
|
{
|
|
|
line: "线路C",
|
|
|
pole: "杆塔3",
|
|
|
terminal: "终端3",
|
|
|
time: "2023-03-15 10:00:00",
|
|
|
temperature: "27℃",
|
|
|
humidity: "55%",
|
|
|
windSpeed: "0.7m/s",
|
|
|
windDirection: "60°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1017hPa",
|
|
|
sunlight: "650W/m2",
|
|
|
},
|
|
|
{
|
|
|
line: "线路D",
|
|
|
pole: "杆塔4",
|
|
|
terminal: "终端4",
|
|
|
time: "2023-03-15 11:00:00",
|
|
|
temperature: "24℃",
|
|
|
humidity: "65%",
|
|
|
windSpeed: "0.4m/s",
|
|
|
windDirection: "30°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1016hPa",
|
|
|
sunlight: "450W/m2",
|
|
|
},
|
|
|
{
|
|
|
line: "线路E",
|
|
|
pole: "杆塔5",
|
|
|
terminal: "终端5",
|
|
|
time: "2023-03-15 12:00:00",
|
|
|
temperature: "28℃",
|
|
|
humidity: "50%",
|
|
|
windSpeed: "0.6m/s",
|
|
|
windDirection: "90°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1018hPa",
|
|
|
sunlight: "750W/m2",
|
|
|
},
|
|
|
];
|
|
|
} else if (data.bsManufacturer) {
|
|
|
this.msg = "杆塔下所有数据";
|
|
|
this.childFlag = false;
|
|
|
this.tableData = [
|
|
|
{
|
|
|
line: "线路F",
|
|
|
pole: "杆塔6",
|
|
|
terminal: "终端6",
|
|
|
time: "2023-03-15 13:00:00",
|
|
|
temperature: "26℃",
|
|
|
humidity: "60%",
|
|
|
windSpeed: "0.5m/s",
|
|
|
windDirection: "150°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1017hPa",
|
|
|
sunlight: "600W/m2",
|
|
|
},
|
|
|
{
|
|
|
line: "线路G",
|
|
|
pole: "杆塔7",
|
|
|
terminal: "终端7",
|
|
|
time: "2023-03-15 14:00:00",
|
|
|
temperature: "29℃",
|
|
|
humidity: "45%",
|
|
|
windSpeed: "0.7m/s",
|
|
|
windDirection: "180°",
|
|
|
rainfall: "mm/hour, ",
|
|
|
pressure: "184hPa（百帕） ",
|
|
|
sunlight: "789W/m²",
|
|
|
},
|
|
|
{
|
|
|
line: "线路H",
|
|
|
pole: "杆塔8 ",
|
|
|
terminal: "终端8 ",
|
|
|
time: "24-Mar-23 16:45 ",
|
|
|
temperature: "24℃（摄氏度） ",
|
|
|
humidity: "78% （百分比） ",
|
|
|
windSpeed: "1.8m/s（米/秒） ",
|
|
|
windDirection: "88 °（度） ",
|
|
|
rainfall: "至今无数据 ",
|
|
|
pressure: "184hPa（百帕） ",
|
|
|
sunlight: " 无数据 ",
|
|
|
comment: " 天气晴朗，适合户外活动。",
|
|
|
},
|
|
|
];
|
|
|
} else {
|
|
|
console.log("杆塔");
|
|
|
this.msg = "装置当天数据";
|
|
|
this.childFlag = true;
|
|
|
this.childTableDate = [
|
|
|
{
|
|
|
time: "2023-03-15 08:00:00",
|
|
|
temperature: "25℃",
|
|
|
humidity: "60%",
|
|
|
windSpeed: "0.5m/s",
|
|
|
windDirection: "120°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1015hPa",
|
|
|
sunlight: "500W/m2",
|
|
|
minuteAverageWindSpeed: "无数据",
|
|
|
minuteAverageWindDirection: "无数据",
|
|
|
tenMinuteAverageWindSpeed: "无数据",
|
|
|
tenMinuteAverageWindDirection: "无数据",
|
|
|
tenMinuteMaxWindSpeed: "无数据",
|
|
|
},
|
|
|
{
|
|
|
time: "2023-03-15 09:00:00",
|
|
|
temperature: "23℃",
|
|
|
humidity: "70%",
|
|
|
windSpeed: "0.3m/s",
|
|
|
windDirection: "90°",
|
|
|
rainfall: "0mm/hour",
|
|
|
pressure: "1013hPa",
|
|
|
sunlight: "350W/m2",
|
|
|
minuteAverageWindSpeed: "无数据",
|
|
|
minuteAverageWindDirection: "无数据",
|
|
|
tenMinuteAverageWindSpeed: "无数据",
|
|
|
tenMinuteAverageWindDirection: "无数据",
|
|
|
tenMinuteMaxWindSpeed: "无数据",
|
|
|
},
|
|
|
];
|
|
|
}
|
|
|
},
|
|
|
onSubmit() {},
|
|
|
//点击分页
|
|
|
handleCurrentChange(val) {
|
|
|
this.page = val;
|
|
|
// this.picList = [];
|
|
|
// this.getPicData();
|
|
|
},
|
|
|
//每页条数
|
|
|
handleSizeChange(val) {
|
|
|
this.pageSize = val;
|
|
|
//this.getPicData();
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
.weatherBox {
|
|
|
width: calc(100% - 24px);
|
|
|
height: calc(100% - 24px);
|
|
|
padding: 12px 12px;
|
|
|
background: #fff;
|
|
|
.weatherContain {
|
|
|
display: flex;
|
|
|
height: 100%;
|
|
|
box-sizing: border-box;
|
|
|
background: #fff;
|
|
|
border: 1px solid #ddd;
|
|
|
border-radius: 4px;
|
|
|
}
|
|
|
.rightTable {
|
|
|
display: flex;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
flex: 1;
|
|
|
overflow: hidden;
|
|
|
border-left: 1px solid #ddd;
|
|
|
.dataBox {
|
|
|
width: calc(100% - 24px);
|
|
|
height: calc(100% - 24px);
|
|
|
padding: 12px 12px;
|
|
|
background: #fff;
|
|
|
}
|
|
|
.fatherTableShowBox {
|
|
|
height: calc(100% - 0px);
|
|
|
}
|
|
|
.childBox {
|
|
|
height: calc(100% - 50px);
|
|
|
.childTableShowBox {
|
|
|
height: calc(100% - 50px);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style>
|