odjbin/tunnel-cloud-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

邓洁 : 有害气体echarts数据,切换站点与隧道数据渲染

Browse Source
This commit is contained in:
dengj
2023-12-18 14:38:40 +08:00
parent 61261eeee1
commit 24c54caca7
5 changed files with 147 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
src/components/content/badGasInfo/BadGasInfo.vue
View File

@@ -44,10 +44,12 @@
import GasInfoItem from "./childComps/GasInfoItem.vue";
import * as echarts from "echarts";
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue";
import {getBadGasEchartsInfo} from "@/api/largeScreen";
const props = defineProps({
list: Array,
badGasData: Array,
tunnelId:Number
});
const timeList = ref(["年", "月", "日"]);
const selectTimeButton = ref(2);
@@ -80,6 +82,14 @@ watch(
},
{ deep: true }
);
watch(
() => props.tunnelId,
(now) => {
props.tunnelId=now
},
{ deep: true }
);
const timeSelect = (index) => {
console.log("选择时间", index);
if (index === 0) {
@@ -119,12 +129,19 @@ const changeData = (item) => {
unit: item.unit,
};
};
const getBadGasChartInfo = () => {
console.log('tunnnelid--------',props.tunnelId)
getBadGasEchartsInfo(props.tunnelId).then(res => {
if (res?.code === 1000) {
isVisited.value = true
nextTick(() => {
initChart(res.data.dates, res.data)
})
}
})
}
const handleOpenChart = () => {
console.log("有害气体弹窗");
isVisited.value = true;
nextTick(() => {
initChart();
});
getBadGasChartInfo()
};
const getImageUrl = (name) => {
return new URL(`../../../assets/images/badGasInfo/${name}`, import.meta.url)
@@ -133,7 +150,7 @@ const getImageUrl = (name) => {
/**
* 初始化echarts实例方法
*/
const initChart = () => {
const initChart = (type, values) => {
//3.初始化container容器
myEcharts = echarts.init(document.getElementById("containerBad"));
//5.传入数据
@@ -196,33 +213,34 @@ const initChart = () => {
//X轴
xAxis: {
type: "category",
data: [
"00:00",
"01:00",
"02:00",
"03:00",
"04:00",
"05:00",
"06:00",
"07:00",
"08:00",
"09:00",
"10:00",
"11:00",
"12:00",
"13:00",
"14:00",
"15:00",
"16:00",
"17:00",
"18:00",
"19:00",
"20:00",
"21:00",
"22:00",
"23:00",
"24:00",
],
// data: [
// "00:00",
// "01:00",
// "02:00",
// "03:00",
// "04:00",
// "05:00",
// "06:00",
// "07:00",
// "08:00",
// "09:00",
// "10:00",
// "11:00",
// "12:00",
// "13:00",
// "14:00",
// "15:00",
// "16:00",
// "17:00",
// "18:00",
// "19:00",
// "20:00",
// "21:00",
// "22:00",
// "23:00",
// "24:00",
// ],
data:type,
axisLabel: {
textStyle: {
fontSize: 45,
@@ -244,10 +262,11 @@ const initChart = () => {
series: [
{
name: "二氧化碳",
data: [
56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 3, 85, 47, 92, 17, 76,
69, 25, 31, 49, 81, 63,
],
// data: [
// 56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 3, 85, 47, 92, 17, 76,
// 69, 25, 31, 49, 81, 63,
// ],
data:values.carbonDioxideValues,
type: "line",
smooth: true,
symbolSize: 24,
@@ -257,10 +276,11 @@ const initChart = () => {
},
{
name: "一氧化碳",
data: [
96, 38, 75, 10, 62, 81, 41, 27, 69, 16, 33, 57, 73, 87, 22, 46, 11,
79, 51, 29, 60, 48, 83, 15,
],
// data: [
// 96, 38, 75, 10, 62, 81, 41, 27, 69, 16, 33, 57, 73, 87, 22, 46, 11,
// 79, 51, 29, 60, 48, 83, 15,
// ],
data:values.carbonMonoxideValues,
type: "line",
smooth: true,
symbolSize: 24,
@@ -270,10 +290,11 @@ const initChart = () => {
},
{
name: "二氧化氮",
data: [
53, 88, 10, 67, 92, 31, 74, 46, 20, 37, 85, 16, 63, 70, 41, 99, 25,
77, 82, 13, 68, 49, 55, 7, 39,
],
// data: [
// 53, 88, 10, 67, 92, 31, 74, 46, 20, 37, 85, 16, 63, 70, 41, 99, 25,
// 77, 82, 13, 68, 49, 55, 7, 39,
// ],
data:values.nitrogenDioxideValues,
type: "line",
smooth: true,
symbolSize: 24,
@@ -283,10 +304,11 @@ const initChart = () => {
},
{
name: "一氧化氮",
data: [
37, 19, 85, 62, 28, 91, 43, 76, 14, 68, 33, 52, 71, 26, 97, 49, 82,
17, 66, 30, 78, 55, 23, 47,
],
// data: [
// 37, 19, 85, 62, 28, 91, 43, 76, 14, 68, 33, 52, 71, 26, 97, 49, 82,
// 17, 66, 30, 78, 55, 23, 47,
// ],
data:values.sulfurMonoxideValues,
type: "line",
smooth: true,
symbolSize: 24,
@@ -296,10 +318,11 @@ const initChart = () => {
},
{
name: "二氧化硫",
data: [
6, 30, 91, 77, 28, 51, 42, 83, 16, 65, 35, 72, 18, 96, 47, 79, 100,
23, 80, 44, 62, 59, 13, 86,
],
// data: [
// 6, 30, 91, 77, 28, 51, 42, 83, 16, 65, 35, 72, 18, 96, 47, 79, 100,
// 23, 80, 44, 62, 59, 13, 86,
// ],
data:values.sulfurDioxideValues,
type: "line",
smooth: true,
symbolSize: 24,
@@ -309,10 +332,11 @@ const initChart = () => {
},
{
name: "硫化氢",
data: [
13, 27, 39, 51, 62, 73, 84, 95, 10, 20, 30, 40, 50, 60, 70, 80, 90,
100, 11, 21, 31, 41, 51,
],
// data: [
// 13, 27, 39, 51, 62, 73, 84, 95, 10, 20, 30, 40, 50, 60, 70, 80, 90,
// 100, 11, 21, 31, 41, 51,
// ],
data:values.hydrogenSulfideValues,
type: "line",
smooth: true,
symbolSize: 24,

3
src/components/content/windPressure/WindPressureList.vue
View File

@@ -31,7 +31,7 @@
import WindPressureItem from "./childComps/WindPressureItem.vue";
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
import * as echarts from 'echarts';
import {getEchartsInfo} from "../../../api/largeScreen";
import {getEchartsInfo} from "@/api/largeScreen";
const props = defineProps({
list: Array,
@@ -60,7 +60,6 @@ watch(() => props.winData, (now) => {
const getWindInfo = (equipmentId) => {
getEchartsInfo(equipmentId).then(res => {
console.log('res-wind', res)
if (res?.code === 1000) {
isVisited.value = true
nextTick(() => {