mt-fe-group/xuchang-new
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

1

Browse Source
This commit is contained in:
lb
2024-01-25 10:31:51 +08:00
parent b27a20f3cf
commit 2fb3d05f8c
13 changed files with 288 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/Modules/EnergyCostAnalysis/BadGas/index.jsx
View File

@@ -5,11 +5,16 @@ import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import { lunarYear } from "../../../../utils/energeChartOption";
import dayjs from "dayjs";
function Gas(props) {
const elecTrend = useSelector((state) => state.energy.trend.natGas2);
const [period, setPeriod] = useState("周");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const options = getOptions(
{ 周: "week", 月: "month", 年: "year" }[period],
elecTrend ?? { week: [], month: [], year: [] }
@@ -19,16 +24,33 @@ function Gas(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
// console.log('date ', v);
setPeriod(v);
}
function handleDateChange(value) {
setPeriod(value);
setTimestr(
{
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="battery"
title="天然气II"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
onSwitch={handleSwitch}
defaultSelect={period}

32
src/components/Modules/EnergyCostAnalysis/ElectricityCost/index.jsx
View File

@@ -4,11 +4,16 @@ import ReactECharts from "echarts-for-react";
import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import dayjs from "dayjs";
function ElecCost(props) {
const elecTrend = useSelector((state) => state.energy.trend.elec);
const [period, setPeriod] = useState("周");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const options = getOptions(
{ 周: "week", 月: "month", 年: "year" }[period],
elecTrend ?? { week: [], month: [], year: [] }
@@ -18,15 +23,32 @@ function ElecCost(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
function handleDateChange(value) {
setPeriod(value);
setTimestr(
{
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="battery"
title="电耗能"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
onSwitch={handleSwitch}
defaultSelect={period}

45
src/components/Modules/EnergyCostAnalysis/NO/index.jsx
View File

@@ -4,6 +4,7 @@ import ReactECharts from "echarts-for-react";
import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import dayjs from "dayjs";
function NO(props) {
const dayTrend = useSelector((state) => state.smoke?.dayTrend);
@@ -11,6 +12,11 @@ function NO(props) {
const monthTrend = useSelector((state) => state.smoke?.monthTrend);
const yearTrend = useSelector((state) => state.smoke?.yearTrend);
const [period, setPeriod] = useState("日");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const currentTrend =
period === "日"
@@ -27,16 +33,45 @@ function NO(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
// console.log('date ', v);
}
function handleDateChange(value) {
setPeriod(
{
日: "day",
周: "week",
月: "month",
年: "year",
}[value]
);
setTimestr(
{
日:
dayjs().subtract(1, "day").format("YYYY.MM.DD") +
" 7点 - " +
dayjs().format("YYYY.MM.DD") +
" 7点",
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="smoke"
title="氮氧化物"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
defaultSelect={period}
onSwitch={handleSwitch}

46
src/components/Modules/EnergyCostAnalysis/NO2/index.jsx
View File

@@ -4,6 +4,7 @@ import ReactECharts from "echarts-for-react";
import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import dayjs from "dayjs";
function Dust(props) {
const dayTrend = useSelector((state) => state.smoke?.dayTrend);
@@ -11,7 +12,11 @@ function Dust(props) {
const monthTrend = useSelector((state) => state.smoke?.monthTrend);
const yearTrend = useSelector((state) => state.smoke?.yearTrend);
const [period, setPeriod] = useState("日");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const currentTrend =
period === "日"
? dayTrend
@@ -27,16 +32,47 @@ function Dust(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
// console.log('date ', v);
function handleDateChange(value) {
setPeriod(
{
日: "day",
周: "week",
月: "month",
年: "year",
}[value]
);
setTimestr(
{
日:
dayjs().subtract(1, "day").format("YYYY.MM.DD") +
" 7点 - " +
dayjs().format("YYYY.MM.DD") +
" 7点",
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="smoke"
title="颗粒物"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
defaultSelect={period}
onSwitch={handleSwitch}

37
src/components/Modules/EnergyCostAnalysis/NatGas/index.jsx
View File

@@ -5,10 +5,16 @@ import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import { lunarYear } from "../../../../utils/energeChartOption";
import dayjs from "dayjs";
function NatGas(props) {
const elecTrend = useSelector((state) => state.energy.trend.natGas1);
const [period, setPeriod] = useState("周");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const options = getOptions(
{ 周: "week", 月: "month", 年: "year" }[period],
@@ -19,16 +25,33 @@ function NatGas(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
// console.log('date ', v);
function handleDateChange(value) {
setPeriod(value);
setTimestr(
{
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="battery"
title="天然气I"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
onSwitch={handleSwitch}
defaultSelect={period}
@@ -114,7 +137,7 @@ function getOptions(period, trend) {
.fill(1)
.map((_, index) => {
if (period == "week") {
const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
const dtimestamp = today - (index + 1) * 24 * 60 * 60 * 1000;
return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
dtimestamp
).getDate()}`;
@@ -163,7 +186,9 @@ function getOptions(period, trend) {
},
},
series: {
data: trend[period].map(item => item != null ? (+item).toFixed(2) : null),
data: trend[period].map((item) =>
item != null ? (+item).toFixed(2) : null
),
type: "line",
symbol: "circle",
symbolSize: 6,

44
src/components/Modules/EnergyCostAnalysis/O/index.jsx
View File

@@ -4,6 +4,7 @@ import ReactECharts from "echarts-for-react";
import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import dayjs from "dayjs";
function Oxygen(props) {
const dayTrend = useSelector((state) => state.smoke?.dayTrend);
@@ -11,6 +12,11 @@ function Oxygen(props) {
const monthTrend = useSelector((state) => state.smoke?.monthTrend);
const yearTrend = useSelector((state) => state.smoke?.yearTrend);
const [period, setPeriod] = useState("日");
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const currentTrend =
period === "日"
@@ -27,16 +33,44 @@ function Oxygen(props) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
// console.log('date ', v);
function handleDateChange(value) {
setPeriod(
{
日: "day",
周: "week",
月: "month",
年: "year",
}[value]
);
setTimestr(
{
日:
dayjs().subtract(1, "day").format("YYYY.MM.DD") +
" 7点 - " +
dayjs().format("YYYY.MM.DD") +
" 7点",
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="smoke"
title="氧气含量"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
defaultSelect={period}
onSwitch={handleSwitch}

45
src/components/Modules/EnergyCostAnalysis/SO2/index.jsx
View File

@@ -4,6 +4,7 @@ import ReactECharts from "echarts-for-react";
import { useSelector } from "react-redux";
import { useState } from "react";
import * as echarts from "echarts";
import dayjs from "dayjs";
function SO2(props) {
const dayTrend = useSelector((state) => state.smoke?.dayTrend);
@@ -20,22 +21,56 @@ function SO2(props) {
: period === "月"
? monthTrend
: yearTrend;
const [timestr, setTimestr] = useState(
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD")
);
const options = getOptions("SO2_float", period, currentTrend);
function handleSwitch(v) {
// console.log('switched ', v);
}
function handleDateChange(v) {
setPeriod(v);
// console.log('date ', v);
function handleDateChange(value) {
setPeriod(
{
日: "day",
周: "week",
月: "month",
年: "year",
}[value]
);
setTimestr(
{
日:
dayjs().subtract(1, "day").format("YYYY.MM.DD") +
" 7点 - " +
dayjs().format("YYYY.MM.DD") +
" 7点",
年:
dayjs().subtract(1, "year").endOf("year").format("YYYY.MM.") +
"29 - " +
dayjs().endOf("year").format("YYYY.MM.") +
"28",
周:
dayjs().subtract(7, "day").format("YYYY.MM.DD") +
" - " +
dayjs().subtract(1, "day").format("YYYY.MM.DD"),
月:
dayjs().subtract(1, "month").format("YYYY.MM.") +
"29 - " +
dayjs().format("YYYY.MM.") +
"28",
}[value]
);
}
return (
<GraphBase
icon="smoke"
title="二氧化硫"
desc="能耗趋势图"
desc={`能耗趋势图 ${timestr}`}
switchOptions={false}
defaultSelect={period}
onSwitch={handleSwitch}