From a10c7076f59177b04861b3a27eb618ef9a9c4d06 Mon Sep 17 00:00:00 2001 From: zhouwenxuan <1175765986@qq.com> Date: 星期四, 04 一月 2024 16:02:08 +0800 Subject: [PATCH] 修改密码 --- src/views/monitorData/weatherData/index.vue | 49 ++++++++++++++++++++++++++++++++++++------------- 1 files changed, 36 insertions(+), 13 deletions(-) diff --git a/src/views/monitorData/weatherData/index.vue b/src/views/monitorData/weatherData/index.vue index b76f938..d760617 100644 --- a/src/views/monitorData/weatherData/index.vue +++ b/src/views/monitorData/weatherData/index.vue @@ -38,8 +38,8 @@ </el-button> </el-form> </div> - <div id="gasChart" style="height: 500px;width: auto"></div> - <el-table :data="state.tableData.data" style="width: 100%;margin-top: 20px"> + <div :id="weatherChart" style="height: 500px;width: auto"></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="采集时间"/> <el-table-column align="center" prop="value" :label='weatherName' /> @@ -108,11 +108,13 @@ ] } }); +const loading = 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) @@ -141,7 +143,6 @@ getNowTime(); initInfoData(); initCharts(); - } ); const getNowTime = () => { @@ -161,13 +162,20 @@ } let resChart = await weatherDataApi().getWeatherLineChart(chartParam); if(resChart.data.code == 100) { - xData.value = resChart.data.data.map((item: any) => { - return item.time; - }) - yData.value = resChart.data.data.map((item: any) => { - return item.value; - }) - dataZoomEnd.value = xData.value.length > 25 ? 5 : 100; + if(resChart.data.data) { + xData.value = resChart.data.data.map((item: any) => { + return item.time; + }) + yData.value = resChart.data.data.map((item: any) => { + return item.value; + }) + dataZoomEnd.value = xData.value.length > 25 ? 5 : 100; + }else { + xData.value = []; + yData.value = []; + dataZoomEnd.value = 100; + } + initCharts(); }else { ElMessage({ @@ -176,6 +184,7 @@ }); } + loading.value = true; //表格 const pageParam = { pageIndex: state.tableData.listQuery.pageIndex, @@ -192,6 +201,7 @@ state.tableData.total = res.data.total; state.tableData.listQuery.pageIndex = res.data.pageIndex; state.tableData.listQuery.pageSize = res.data.pageSize; + loading.value = false; }else { ElMessage({ type: 'warning', @@ -216,9 +226,8 @@ }; 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(); @@ -232,7 +241,7 @@ 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: { @@ -250,6 +259,20 @@ show: true, type: 'value' }, + graphic: { + type: 'text', // 类型:文本 + left: 'center', + top: 'middle', + silent: true, // 不响应事件 + invisible: yData.value.length > 0, // 有数据就隐藏 + style: { + fill: '#9d9d9d', + fontWeight: 'bold', + text: '暂无数据', + fontFamily: 'Microsoft YaHei', + fontSize: '25px' + } + }, series: [ { data: yData.value, -- Gitblit v1.9.2