| | |
| | | range-separator="~" |
| | | start-placeholder="开始时间" |
| | | end-placeholder="结束时间" |
| | | @change = "chooseTime" |
| | | |
| | | /> |
| | | <!-- @change = "chooseTime"--> |
| | | </el-form-item> |
| | | <el-form-item label="气象类型:"> |
| | | <el-select |
| | |
| | | </el-button> |
| | | </el-form> |
| | | </div> |
| | | <div id="gasChart" style="height: 500px;width: auto"></div> |
| | | <div :id="weatherChart" style="height: 500px;width: auto" v-loading="picLoading"></div> |
| | | <el-table :data="state.tableData.data" style="width: 100%;margin-top: 20px" v-loading="loading"> |
| | | <el-table-column type="index" label="序号" width="80" /> |
| | | <el-table-column align="center" prop="time" label="采集时间"/> |
| | |
| | | } |
| | | }); |
| | | const loading = ref(false); |
| | | const picLoading = ref(false); |
| | | const weatherName = ref('温度'); |
| | | const dataZoomEnd = ref(); |
| | | const xData = ref([]); |
| | | const yData = ref([]); |
| | | const myChart = shallowRef(null) |
| | | const weatherChart = ref("eChartweatherN" + Date .now() + Math .random()) |
| | | |
| | | const chooseTime = (val: any) => { |
| | | console.log("val",val) |
| | |
| | | getNowTime(); |
| | | initInfoData(); |
| | | initCharts(); |
| | | |
| | | } |
| | | ); |
| | | const getNowTime = () => { |
| | |
| | | state.tableData.listQuery.searchParams.time = [sTime ,eTime]; |
| | | } |
| | | const initInfoData = async () => { |
| | | picLoading.value = true; |
| | | //折线图 |
| | | const chartParam = { |
| | | startTime: moment(state.tableData.listQuery.searchParams.time[0]).format('YYYY-MM-DD HH:mm:ss'), |
| | |
| | | return item.value; |
| | | }) |
| | | dataZoomEnd.value = xData.value.length > 25 ? 5 : 100; |
| | | picLoading.value = false |
| | | }else { |
| | | xData.value = []; |
| | | yData.value = []; |
| | |
| | | }); |
| | | } |
| | | |
| | | loading.value = true; |
| | | loading.value = true |
| | | //表格 |
| | | const pageParam = { |
| | | pageIndex: state.tableData.listQuery.pageIndex, |
| | |
| | | let res = await weatherDataApi().getWeatherLinePage(pageParam); |
| | | if(res.data.code == 100) { |
| | | state.tableData.data = res.data.data; |
| | | state.tableData.total = res.data.total; |
| | | state.tableData.total = res.data.total == null ? 0 :res.data.total; |
| | | state.tableData.listQuery.pageIndex = res.data.pageIndex; |
| | | state.tableData.listQuery.pageSize = res.data.pageSize; |
| | | loading.value = false; |
| | |
| | | }; |
| | | |
| | | const search = () => { |
| | | console.log("vla",state.tableData.listQuery.searchParams) |
| | | changeWeather(state.tableData.listQuery.searchParams.weatherType); |
| | | initInfoData(); |
| | | changeWeather(state.tableData.listQuery.searchParams.weatherType); |
| | | } |
| | | const reset = () => { |
| | | getNowTime(); |
| | |
| | | if (myChart.value != null && myChart.value != "" && myChart.value != undefined) { |
| | | myChart.value.dispose(); |
| | | } |
| | | myChart.value = echarts.init(document.getElementById('gasChart')); |
| | | myChart.value = echarts.init(document.getElementById(weatherChart.value)); |
| | | // 指定图表的配置项和数据 |
| | | const option = { |
| | | tooltip: { |