|
@@ -11,6 +11,7 @@
|
|
start-placeholder="开始日期"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
end-placeholder="结束日期"
|
|
:default-time="['00:00:00', '23:45:00']" popper-class="cpp-popper"
|
|
:default-time="['00:00:00', '23:45:00']" popper-class="cpp-popper"
|
|
|
|
+ :picker-options="pickerOptions"
|
|
/>
|
|
/>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="场站名称">
|
|
<el-form-item label="场站名称">
|
|
@@ -32,44 +33,45 @@
|
|
<div style="padding-top: 10px">
|
|
<div style="padding-top: 10px">
|
|
<el-tabs type="card" v-model="activeName" @tab-click="tabClick">
|
|
<el-tabs type="card" v-model="activeName" @tab-click="tabClick">
|
|
<el-tab-pane label="列表" name="first">
|
|
<el-tab-pane label="列表" name="first">
|
|
- <vxe-table
|
|
|
|
- highlight-hover-row
|
|
|
|
- :keep-source="true"
|
|
|
|
- align="center"
|
|
|
|
- :loading="loading"
|
|
|
|
- ref="xTable"
|
|
|
|
- auto-resize
|
|
|
|
- highlight-current-row
|
|
|
|
- border
|
|
|
|
- resizable
|
|
|
|
- show-overflow
|
|
|
|
- max-height="500px"
|
|
|
|
- :data="tableData.slice((currentPage-1) * pageSize,currentPage * pageSize)">
|
|
|
|
- <vxe-table-column field="stationCode" title="场站名称" :formatter="stationCodeFormat" width="200px" fixed="left"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="time" title="时间" width="180px" fixed="left"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="t" title="温度(℃)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="rh" title="湿度(RH%)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="pa" title="气压(kPa)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wsHubHeight" title="轮毂风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wdHubHeight" title="轮毂风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws10" title="10米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd10" title="10米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws30" title="30米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd30" title="30米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws50" title="50米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd50" title="50米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws60" title="60米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd60" title="60米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws70" title="70米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd70" title="70米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws80" title="80米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd80" title="80米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws90" title="90米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd90" title="90米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="ws100" title="100米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
- <vxe-table-column field="wd100" title="100米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
- </vxe-table>
|
|
|
|
- <vxe-pager
|
|
|
|
|
|
+ <div class="vxe-max-height-65vh">
|
|
|
|
+ <vxe-table
|
|
|
|
+ highlight-hover-row
|
|
|
|
+ :keep-source="true"
|
|
|
|
+ align="center"
|
|
|
|
+ :loading="loading"
|
|
|
|
+ ref="xTable"
|
|
|
|
+ auto-resize
|
|
|
|
+ highlight-current-row
|
|
|
|
+ border
|
|
|
|
+ resizable
|
|
|
|
+ show-overflow
|
|
|
|
+ :data="tableData.slice((currentPage-1) * pageSize,currentPage * pageSize)">
|
|
|
|
+ <vxe-table-column field="stationCode" title="场站名称" :formatter="stationCodeFormat" width="200px"
|
|
|
|
+ fixed="left"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="time" title="时间" width="180px" fixed="left"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="t" title="温度(℃)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="rh" title="湿度(RH%)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="pa" title="气压(kPa)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wsHubHeight" title="轮毂风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wdHubHeight" title="轮毂风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws10" title="10米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd10" title="10米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws30" title="30米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd30" title="30米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws50" title="50米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd50" title="50米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws60" title="60米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd60" title="60米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws70" title="70米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd70" title="70米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws80" title="80米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd80" title="80米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws90" title="90米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd90" title="90米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="ws100" title="100米风速(m/s)" width="180px"></vxe-table-column>
|
|
|
|
+ <vxe-table-column field="wd100" title="100米风向(°)" width="180px"></vxe-table-column>
|
|
|
|
+ </vxe-table>
|
|
|
|
+ <vxe-pager
|
|
perfect
|
|
perfect
|
|
:current-page.sync="currentPage"
|
|
:current-page.sync="currentPage"
|
|
:page-size.sync="pageSize"
|
|
:page-size.sync="pageSize"
|
|
@@ -77,8 +79,11 @@
|
|
:page-sizes=[10,50,100]
|
|
:page-sizes=[10,50,100]
|
|
:layouts="['PrevJump', 'PrevPage','JumpNumber', 'NextPage', 'NextJump', 'Sizes', 'FullJump', 'Total']"
|
|
:layouts="['PrevJump', 'PrevPage','JumpNumber', 'NextPage', 'NextJump', 'Sizes', 'FullJump', 'Total']"
|
|
@page-change="handlePageChange"
|
|
@page-change="handlePageChange"
|
|
- >
|
|
|
|
- </vxe-pager>
|
|
|
|
|
|
+ >
|
|
|
|
+ </vxe-pager>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="风速曲线图" name="second">
|
|
<el-tab-pane label="风速曲线图" name="second">
|
|
<div style="float:left;width: 95%;height: 550px" id="wscharts"></div>
|
|
<div style="float:left;width: 95%;height: 550px" id="wscharts"></div>
|
|
@@ -101,7 +106,7 @@ export default {
|
|
wsChart: null,
|
|
wsChart: null,
|
|
wdChart: null,
|
|
wdChart: null,
|
|
activeName: 'first',
|
|
activeName: 'first',
|
|
- dateTime: [new Date(new Date().toLocaleDateString()).getTime(), new Date(new Date().toLocaleDateString()).getTime() + 60 * 60 * 24 * 1000-5*1000*60],
|
|
|
|
|
|
+ dateTime: [new Date(new Date().toLocaleDateString()).getTime(), new Date(new Date().toLocaleDateString()).getTime() + 60 * 60 * 24 * 1000 - 5 * 1000 * 60],
|
|
total: 0,
|
|
total: 0,
|
|
sortOrder: 'asc',
|
|
sortOrder: 'asc',
|
|
pageSize: 10,
|
|
pageSize: 10,
|
|
@@ -110,7 +115,7 @@ export default {
|
|
stationCode: [],
|
|
stationCode: [],
|
|
searchForm: {},
|
|
searchForm: {},
|
|
tableData: [],
|
|
tableData: [],
|
|
- nameList:[],
|
|
|
|
|
|
+ nameList: [],
|
|
loading: false,
|
|
loading: false,
|
|
modId: '',//备用id
|
|
modId: '',//备用id
|
|
itemStyle: [
|
|
itemStyle: [
|
|
@@ -440,7 +445,8 @@ export default {
|
|
},
|
|
},
|
|
|
|
|
|
],
|
|
],
|
|
- colorArr: [{
|
|
|
|
|
|
+ colorArr: [
|
|
|
|
+ {
|
|
start: "rgba(155, 101, 229,",
|
|
start: "rgba(155, 101, 229,",
|
|
end: "rgba(219,44,44,0.5)"
|
|
end: "rgba(219,44,44,0.5)"
|
|
},
|
|
},
|
|
@@ -678,9 +684,28 @@ export default {
|
|
}
|
|
}
|
|
],
|
|
],
|
|
lineColor: '#3b3b3b',
|
|
lineColor: '#3b3b3b',
|
|
|
|
+ pickerMinDate: null,
|
|
|
|
+ pickerMaxDate: null,
|
|
|
|
+ day30: 30 * 24 * 3600 * 1000,
|
|
|
|
+ // 日期使用
|
|
|
|
+ pickerOptions: {
|
|
|
|
+ onPick: ({ maxDate, minDate }) => {
|
|
|
|
+ if (minDate && this.pickerMinDate) {
|
|
|
|
+ this.pickerMinDate = null;
|
|
|
|
+ } else if (minDate) {
|
|
|
|
+ this.pickerMinDate = minDate.getTime();
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ disabledDate: (time) => {
|
|
|
|
+ if (this.pickerMinDate) {
|
|
|
|
+ return (time.getTime() > (this.pickerMinDate + this.day30)) || (time.getTime() < (this.pickerMinDate - this.day30));
|
|
|
|
+ }
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ },
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- created(){
|
|
|
|
|
|
+ created() {
|
|
this.getStationCode()
|
|
this.getStationCode()
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
@@ -700,14 +725,14 @@ export default {
|
|
},
|
|
},
|
|
computed: {},
|
|
computed: {},
|
|
methods: {
|
|
methods: {
|
|
- tabClick(tab){
|
|
|
|
|
|
+ tabClick(tab) {
|
|
if (this.activeName == 'second') {
|
|
if (this.activeName == 'second') {
|
|
- this.$nextTick(function() {
|
|
|
|
|
|
+ this.$nextTick(function () {
|
|
this.wsChart.resize();
|
|
this.wsChart.resize();
|
|
})
|
|
})
|
|
}
|
|
}
|
|
if (this.activeName == 'three') {
|
|
if (this.activeName == 'three') {
|
|
- this.$nextTick(function() {
|
|
|
|
|
|
+ this.$nextTick(function () {
|
|
this.wdChart.resize();
|
|
this.wdChart.resize();
|
|
})
|
|
})
|
|
}
|
|
}
|
|
@@ -724,7 +749,7 @@ export default {
|
|
this.currentPage = currentPage
|
|
this.currentPage = currentPage
|
|
this.pageSize = pageSize
|
|
this.pageSize = pageSize
|
|
},
|
|
},
|
|
- async dataQuery() {
|
|
|
|
|
|
+ async dataQuery() {
|
|
let startTime = Math.round(this.dateTime[0])
|
|
let startTime = Math.round(this.dateTime[0])
|
|
let endTime = Math.round(this.dateTime[1])
|
|
let endTime = Math.round(this.dateTime[1])
|
|
if (endTime <= startTime) {
|
|
if (endTime <= startTime) {
|
|
@@ -745,7 +770,7 @@ export default {
|
|
let wsMap = response.data.wsMap
|
|
let wsMap = response.data.wsMap
|
|
let wsTime = response.data.wsTime
|
|
let wsTime = response.data.wsTime
|
|
let wdMap = response.data.wdMap
|
|
let wdMap = response.data.wdMap
|
|
- this.wsDraw(wsTime,wsMap)
|
|
|
|
|
|
+ this.wsDraw(wsTime, wsMap)
|
|
this.wdDraw(wdMap);
|
|
this.wdDraw(wdMap);
|
|
|
|
|
|
this.loading = false
|
|
this.loading = false
|
|
@@ -762,8 +787,8 @@ export default {
|
|
}
|
|
}
|
|
})
|
|
})
|
|
},
|
|
},
|
|
- wsDraw(wsTime,wsMap) {
|
|
|
|
- this.wsChart = echarts.init(document.getElementById('wscharts'),'dark')
|
|
|
|
|
|
+ wsDraw(wsTime, wsMap) {
|
|
|
|
+ this.wsChart = echarts.init(document.getElementById('wscharts'), 'dark')
|
|
let option = {
|
|
let option = {
|
|
backgroundColor: 'transparent',
|
|
backgroundColor: 'transparent',
|
|
title: {
|
|
title: {
|
|
@@ -807,7 +832,7 @@ export default {
|
|
left: "15%",
|
|
left: "15%",
|
|
right: "15%",
|
|
right: "15%",
|
|
// textStyle: {
|
|
// textStyle: {
|
|
- // color: this.lineColor
|
|
|
|
|
|
+ // color: this.lineColor
|
|
// }
|
|
// }
|
|
}, {
|
|
}, {
|
|
type: 'inside'
|
|
type: 'inside'
|
|
@@ -824,8 +849,8 @@ export default {
|
|
boundaryGap: false,
|
|
boundaryGap: false,
|
|
// axisLine: {
|
|
// axisLine: {
|
|
// lineStyle: {
|
|
// lineStyle: {
|
|
- // color: this.lineColor
|
|
|
|
- // }
|
|
|
|
|
|
+ // color: this.lineColor
|
|
|
|
+ // }
|
|
// },
|
|
// },
|
|
data: []
|
|
data: []
|
|
}],
|
|
}],
|
|
@@ -837,8 +862,8 @@ export default {
|
|
},
|
|
},
|
|
// axisLine: {
|
|
// axisLine: {
|
|
// lineStyle: {
|
|
// lineStyle: {
|
|
- // color: this.lineColor
|
|
|
|
- // }
|
|
|
|
|
|
+ // color: this.lineColor
|
|
|
|
+ // }
|
|
// },
|
|
// },
|
|
|
|
|
|
axisLabel: {
|
|
axisLabel: {
|
|
@@ -861,11 +886,11 @@ export default {
|
|
var index = 0;
|
|
var index = 0;
|
|
|
|
|
|
for (var key in wsMap) {
|
|
for (var key in wsMap) {
|
|
- for (let i=0;i<wsMap[key].length;i++){
|
|
|
|
- wsMap[key][i] = wsMap[key][i]==-99?null:wsMap[key][i]
|
|
|
|
|
|
+ for (let i = 0; i < wsMap[key].length; i++) {
|
|
|
|
+ wsMap[key][i] = wsMap[key][i] == -99 ? null : wsMap[key][i]
|
|
}
|
|
}
|
|
option.legend.data.push(key)
|
|
option.legend.data.push(key)
|
|
- if (key=='轮毂风速') {
|
|
|
|
|
|
+ if (key == '轮毂风速') {
|
|
option.legend.selected[key] = true
|
|
option.legend.selected[key] = true
|
|
} else {
|
|
} else {
|
|
option.legend.selected[key] = false
|
|
option.legend.selected[key] = false
|
|
@@ -899,7 +924,7 @@ export default {
|
|
});
|
|
});
|
|
},
|
|
},
|
|
wdDraw(wdMap) {
|
|
wdDraw(wdMap) {
|
|
- this.wdChart = echarts.init(document.getElementById('wdcharts'),'dark')
|
|
|
|
|
|
+ this.wdChart = echarts.init(document.getElementById('wdcharts'), 'dark')
|
|
const option = {
|
|
const option = {
|
|
backgroundColor: 'transparent',
|
|
backgroundColor: 'transparent',
|
|
color: ['#4A99FF', '#4BFFFC', '#ff654a', '#edff4a', '#65ff4a', '#4affea', '#894aff', '#d84aff', '#ff4aae'],
|
|
color: ['#4A99FF', '#4BFFFC', '#ff654a', '#edff4a', '#65ff4a', '#4affea', '#894aff', '#d84aff', '#ff4aae'],
|
|
@@ -988,7 +1013,7 @@ export default {
|
|
var index = 0;
|
|
var index = 0;
|
|
for (var key in wdMap) {
|
|
for (var key in wdMap) {
|
|
option.legend.data.push(key)
|
|
option.legend.data.push(key)
|
|
- if (key=='轮毂风向') {
|
|
|
|
|
|
+ if (key == '轮毂风向') {
|
|
option.legend.selected[key] = true
|
|
option.legend.selected[key] = true
|
|
} else {
|
|
} else {
|
|
option.legend.selected[key] = false
|
|
option.legend.selected[key] = false
|