update 天然气历史

src/components/Common/Energy/EnergyCostChart/index.jsx

@@ -1,9 +1,9 @@
 import cls from "./index.module.css";
-import * as echarts from "echarts";
-import { Switch, Radio } from "antd";
+import { Radio } from "antd";
 import ReactECharts from "echarts-for-react";
 import { useState } from "react";
 import { useSelector } from "react-redux";
+import { getOptions } from "../../../../utils/energeChartOption";
 
 const EnergyCostChart = (props) => {
   const elecTrend = useSelector((state) => state.energy.trend.elec);
@@ -86,86 +86,3 @@ const EnergyCostChart = (props) => {
 };
 
 export default EnergyCostChart;
-
-function getOptions(period, source, trend) {
-  if (trend[period].length == 0) return null;
-  return {
-    color: ["#FFD160", "#12FFF5", "#2760FF"],
-    grid: { top: 32, right: 12, bottom: 56, left: 48 },
-    xAxis: {
-      type: "category",
-      data:
-        source == "elec"
-          ? trend[period].map((item) => item.time)
-          : Array(period == "week" ? 7 : period == "year" ? 12 : 30)
-              .fill(1)
-              .map((_, index) => {
-                const today = new Date();
-                const dtimestamp = today - index * 24 * 60 * 60 * 1000;
-                return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
-                  dtimestamp
-                ).getDate()}`;
-              })
-              .reverse(),
-      axisLabel: {
-        color: "#fff",
-        fontSize: 12,
-      },
-      axisTick: { show: false },
-      axisLine: {
-        lineStyle: {
-          width: 1,
-          color: "#213259",
-        },
-      },
-    },
-    yAxis: {
-      name: "单位/m³",
-      nameTextStyle: {
-        color: "#fff",
-        fontSize: 10,
-        align: "right",
-      },
-      type: "value",
-      axisLabel: {
-        color: "#fff",
-        fontSize: 12,
-        // formatter: "{value} %",
-      },
-      axisLine: {
-        show: true,
-        lineStyle: {
-          color: "#213259",
-        },
-      },
-      splitLine: {
-        lineStyle: {
-          color: "#213259a0",
-        },
-      },
-      // interval: 10,
-      // min: 0,
-      // max: 100,
-    },
-    series: [
-      {
-        data:
-          source == "elec"
-            ? trend[period].map((item) => item.qty)
-            : trend[period],
-        type: "line",
-        areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            { offset: 0, color: "#FFD16040" },
-            { offset: 0.5, color: "#FFD16020" },
-            { offset: 1, color: "#FFD16010" },
-          ]),
-        },
-        // smooth: true,
-      },
-    ],
-    tooltip: {
-      trigger: "axis",
-    },
-  };
-}