@@ -2,14 +2,10 @@ | |||||
import useIcon from "../../../hooks/useIcon"; | import useIcon from "../../../hooks/useIcon"; | ||||
import cls from "./index.module.css"; | import cls from "./index.module.css"; | ||||
import { useMemo, useState } from "react"; | import { useMemo, useState } from "react"; | ||||
import { Switch, Select, Radio } from "antd"; | |||||
import { Switch, Select } from "antd"; | |||||
import "./selector.style.overwrite.css"; | import "./selector.style.overwrite.css"; | ||||
// import { Switch, Select, Space } from 'antd'; | |||||
import triangle from "../../../assets/Icon/triangle.svg"; | import triangle from "../../../assets/Icon/triangle.svg"; | ||||
const handleChange = (value: string) => { | |||||
console.log(`selected ${value}`); | |||||
}; | |||||
function choseBg(size) { | function choseBg(size) { | ||||
const [width, height] = size; | const [width, height] = size; | ||||
return width === "long" && height === "middle" | return width === "long" && height === "middle" | ||||
@@ -53,7 +49,6 @@ function GraphBase(props) { | |||||
const [showChart, setShowChart] = useState(true); | const [showChart, setShowChart] = useState(true); | ||||
let dto = null; | let dto = null; | ||||
let timerangeHint = null; | |||||
const switchStyle = {}; | const switchStyle = {}; | ||||
if (props.switchPosition) { | if (props.switchPosition) { | ||||
@@ -65,7 +60,6 @@ function GraphBase(props) { | |||||
} | } | ||||
if (dateOptions) { | if (dateOptions) { | ||||
console.log("dateoptions ", title, dateOptions); | |||||
dto = ( | dto = ( | ||||
<Select | <Select | ||||
defaultValue={defaultSelect || dateOptions[0]} | defaultValue={defaultSelect || dateOptions[0]} | ||||
@@ -89,9 +83,6 @@ function GraphBase(props) { | |||||
onChange={(value, option) => onDateChange(value)} | onChange={(value, option) => onDateChange(value)} | ||||
/> | /> | ||||
); | ); | ||||
// <Radio.Button value={item} key={item} className="radio-group__item"> | |||||
// {item} | |||||
// </Radio.Button> | |||||
} | } | ||||
function handleSwitchChange(v) { | function handleSwitchChange(v) { | ||||
@@ -137,19 +128,7 @@ function GraphBase(props) { | |||||
))} | ))} | ||||
</div> | </div> | ||||
)} | )} | ||||
{ | |||||
dateOptions && dto | |||||
// ( | |||||
// <Radio.Group | |||||
// value={defaultSelect || dateOptions[0]} | |||||
// buttonStyle="solid" | |||||
// className={cls.graphBaseDate + " " + cls.radioGroup} | |||||
// onChange={({ target }) => onDateChange(target.value)} | |||||
// > | |||||
// {dto} | |||||
// </Radio.Group> | |||||
// ) | |||||
} | |||||
{dateOptions && dto} | |||||
{props.children} | {props.children} | ||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -76,7 +76,7 @@ const SmokeTrendChart = (props) => { | |||||
); | ); | ||||
} | } | ||||
function handleSourceChange(value) { | function handleSourceChange(value) { | ||||
setPeriod( | |||||
setSource( | |||||
{ | { | ||||
氧气: "O2_float", | 氧气: "O2_float", | ||||
氮氧化物: "NOX_float", | 氮氧化物: "NOX_float", | ||||
@@ -8,7 +8,7 @@ import * as echarts from "echarts"; | |||||
function FaultType(props) { | function FaultType(props) { | ||||
const [init, setInit] = useState(true); | const [init, setInit] = useState(true); | ||||
const [currentLine, setCurrentLine] = useState(""); | |||||
const [currentLine, setCurrentLine] = useState("Y61"); | |||||
const isra = useSelector((state) => state.isra); | const isra = useSelector((state) => state.isra); | ||||
const currentStatistic = isra.dayStatistic || []; | const currentStatistic = isra.dayStatistic || []; | ||||
const currentLineStatistic = | const currentLineStatistic = | ||||
@@ -86,9 +86,7 @@ function ElecCost(props) { | |||||
export default ElecCost; | export default ElecCost; | ||||
function getOptions(period, trend) { | function getOptions(period, trend) { | ||||
console.log("getOptions", period, trend); | |||||
if (trend[period].length === 0) return null; | if (trend[period].length === 0) return null; | ||||
// export default function getOptions(seriesData, name) { | |||||
const colors = [ | const colors = [ | ||||
"#FFD160", | "#FFD160", | ||||
"#12FFF5", | "#12FFF5", | ||||
@@ -29,20 +29,10 @@ function NO(props) { | |||||
const options = getOptions("NOX_float", period, currentTrend); | const options = getOptions("NOX_float", period, currentTrend); | ||||
function handleSwitch(v) { | |||||
// console.log('switched ', v); | |||||
} | |||||
function handleSwitch(v) {} | |||||
function handleDateChange(value) { | function handleDateChange(value) { | ||||
setPeriod( | |||||
{ | |||||
日: "day", | |||||
周: "week", | |||||
月: "month", | |||||
年: "year", | |||||
}[value] | |||||
); | |||||
setPeriod(value); | |||||
setTimestr( | setTimestr( | ||||
{ | { | ||||
日: | 日: | ||||
@@ -76,23 +66,13 @@ function NO(props) { | |||||
defaultSelect={period} | defaultSelect={period} | ||||
onSwitch={handleSwitch} | onSwitch={handleSwitch} | ||||
dateOptions={["日", "周", "月", "年"]} | dateOptions={["日", "周", "月", "年"]} | ||||
// legend={["总量", "白班", "夜班"]} | |||||
onDateChange={handleDateChange} | onDateChange={handleDateChange} | ||||
size={["long", "middle"]} | size={["long", "middle"]} | ||||
> | > | ||||
{/* real echarts here */} | |||||
{options && ( | {options && ( | ||||
<ReactECharts | <ReactECharts | ||||
key={Math.random()} | key={Math.random()} | ||||
option={options} | option={options} | ||||
// option={getOptions( | |||||
// [ | |||||
// [148, 110, 140, 122, 84, 153, 89], | |||||
// [88, 79, 75, 73, 33, 54, 31], | |||||
// [60, 31, 65, 49, 51, 99, 58], | |||||
// ], | |||||
// "氧气" | |||||
// )} | |||||
style={{ height: "100%" }} | style={{ height: "100%" }} | ||||
/> | /> | ||||
)} | )} | ||||
@@ -109,7 +89,6 @@ function NO(props) { | |||||
暂无数据 | 暂无数据 | ||||
</p> | </p> | ||||
)} | )} | ||||
{/* real table data here */} | |||||
</GraphBase> | </GraphBase> | ||||
); | ); | ||||
} | } | ||||
@@ -127,16 +106,6 @@ function getOptions(source, period, trend) { | |||||
grid: { top: 40, right: 12, bottom: 20, left: 64 }, | grid: { top: 40, right: 12, bottom: 20, left: 64 }, | ||||
xAxis: { | xAxis: { | ||||
type: "category", | type: "category", | ||||
// data: Array(7) | |||||
// .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(), | |||||
data: trend[source].map((item) => item.time), | data: trend[source].map((item) => item.time), | ||||
axisLabel: { | axisLabel: { | ||||
color: "#fff", | color: "#fff", | ||||
@@ -174,9 +143,6 @@ function getOptions(source, period, trend) { | |||||
color: "#213259a0", | color: "#213259a0", | ||||
}, | }, | ||||
}, | }, | ||||
// interval: 10, | |||||
// min: 0, | |||||
// max: 100, | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
@@ -193,40 +159,7 @@ function getOptions(source, period, trend) { | |||||
{ offset: 1, color: "#FFD16010" }, | { offset: 1, color: "#FFD16010" }, | ||||
]), | ]), | ||||
}, | }, | ||||
// smooth: true, | |||||
}, | }, | ||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#12FFF540" }, | |||||
// { offset: 0.5, color: "#12FFF520" }, | |||||
// { offset: 1, color: "#12FFF510" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#2760FF40" }, | |||||
// { offset: 0.5, color: "#2760FF20" }, | |||||
// { offset: 1, color: "#2760FF10" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
], | ], | ||||
tooltip: { | tooltip: { | ||||
trigger: "axis", | trigger: "axis", | ||||
@@ -234,7 +167,6 @@ function getOptions(source, period, trend) { | |||||
type: "shadow", | type: "shadow", | ||||
}, | }, | ||||
className: "xc-chart-tooltip", | className: "xc-chart-tooltip", | ||||
// backgroundColor: '' | |||||
}, | }, | ||||
}; | }; | ||||
} | } |
@@ -28,20 +28,10 @@ function Dust(props) { | |||||
const options = getOptions("dust_float", period, currentTrend); | const options = getOptions("dust_float", period, currentTrend); | ||||
function handleSwitch(v) { | |||||
// console.log('switched ', v); | |||||
} | |||||
function handleSwitch(v) {} | |||||
function handleDateChange(value) { | function handleDateChange(value) { | ||||
setPeriod( | |||||
{ | |||||
日: "day", | |||||
周: "week", | |||||
月: "month", | |||||
年: "year", | |||||
}[value] | |||||
); | |||||
setPeriod(value); | |||||
setTimestr( | setTimestr( | ||||
{ | { | ||||
日: | 日: | ||||
@@ -67,7 +57,6 @@ function Dust(props) { | |||||
); | ); | ||||
} | } | ||||
return ( | return ( | ||||
<GraphBase | <GraphBase | ||||
icon="smoke" | icon="smoke" | ||||
@@ -77,23 +66,13 @@ function Dust(props) { | |||||
defaultSelect={period} | defaultSelect={period} | ||||
onSwitch={handleSwitch} | onSwitch={handleSwitch} | ||||
dateOptions={["日", "周", "月", "年"]} | dateOptions={["日", "周", "月", "年"]} | ||||
// legend={["总量", "白班", "夜班"]} | |||||
onDateChange={handleDateChange} | onDateChange={handleDateChange} | ||||
size={["long", "middle"]} | size={["long", "middle"]} | ||||
> | > | ||||
{/* real echarts here */} | |||||
{options && ( | {options && ( | ||||
<ReactECharts | <ReactECharts | ||||
key={Math.random()} | key={Math.random()} | ||||
option={options} | option={options} | ||||
// option={getOptions( | |||||
// [ | |||||
// [91, 164, 88, 120, 167, 158, 43], | |||||
// [30, 75, 52, 43, 73, 66, 36], | |||||
// [61, 89, 36, 77, 94, 92, 7], | |||||
// ], | |||||
// "氧气" | |||||
// )} | |||||
style={{ height: "100%" }} | style={{ height: "100%" }} | ||||
/> | /> | ||||
)} | )} | ||||
@@ -110,7 +89,6 @@ function Dust(props) { | |||||
暂无数据 | 暂无数据 | ||||
</p> | </p> | ||||
)} | )} | ||||
{/* real table data here */} | |||||
</GraphBase> | </GraphBase> | ||||
); | ); | ||||
} | } | ||||
@@ -128,16 +106,6 @@ function getOptions(source, period, trend) { | |||||
grid: { top: 40, right: 12, bottom: 20, left: 64 }, | grid: { top: 40, right: 12, bottom: 20, left: 64 }, | ||||
xAxis: { | xAxis: { | ||||
type: "category", | type: "category", | ||||
// data: Array(7) | |||||
// .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(), | |||||
data: trend[source].map((item) => item.time), | data: trend[source].map((item) => item.time), | ||||
axisLabel: { | axisLabel: { | ||||
color: "#fff", | color: "#fff", | ||||
@@ -175,13 +143,9 @@ function getOptions(source, period, trend) { | |||||
color: "#213259a0", | color: "#213259a0", | ||||
}, | }, | ||||
}, | }, | ||||
// interval: 10, | |||||
// min: 0, | |||||
// max: 100, | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
// (isNaN((+"f")) ? 0 : (+"f")).toFixed(2) | |||||
data: trend[source].map((item) => | data: trend[source].map((item) => | ||||
!(item.value == null || isNaN(+item.value)) | !(item.value == null || isNaN(+item.value)) | ||||
? (+item.value).toFixed(2) | ? (+item.value).toFixed(2) | ||||
@@ -197,40 +161,7 @@ function getOptions(source, period, trend) { | |||||
{ offset: 1, color: "#FFD16010" }, | { offset: 1, color: "#FFD16010" }, | ||||
]), | ]), | ||||
}, | }, | ||||
// smooth: true, | |||||
}, | }, | ||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#12FFF540" }, | |||||
// { offset: 0.5, color: "#12FFF520" }, | |||||
// { offset: 1, color: "#12FFF510" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#2760FF40" }, | |||||
// { offset: 0.5, color: "#2760FF20" }, | |||||
// { offset: 1, color: "#2760FF10" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
], | ], | ||||
tooltip: { | tooltip: { | ||||
trigger: "axis", | trigger: "axis", | ||||
@@ -238,7 +169,6 @@ function getOptions(source, period, trend) { | |||||
type: "shadow", | type: "shadow", | ||||
}, | }, | ||||
className: "xc-chart-tooltip", | className: "xc-chart-tooltip", | ||||
// backgroundColor: '' | |||||
}, | }, | ||||
}; | }; | ||||
} | } |
@@ -29,19 +29,10 @@ function Oxygen(props) { | |||||
const options = getOptions("O2_float", period, currentTrend); | const options = getOptions("O2_float", period, currentTrend); | ||||
function handleSwitch(v) { | |||||
// console.log('switched ', v); | |||||
} | |||||
function handleSwitch(v) {} | |||||
function handleDateChange(value) { | function handleDateChange(value) { | ||||
setPeriod( | |||||
{ | |||||
日: "day", | |||||
周: "week", | |||||
月: "month", | |||||
年: "year", | |||||
}[value] | |||||
); | |||||
setPeriod(value); | |||||
setTimestr( | setTimestr( | ||||
{ | { | ||||
日: | 日: | ||||
@@ -75,23 +66,13 @@ function Oxygen(props) { | |||||
defaultSelect={period} | defaultSelect={period} | ||||
onSwitch={handleSwitch} | onSwitch={handleSwitch} | ||||
dateOptions={["日", "周", "月", "年"]} | dateOptions={["日", "周", "月", "年"]} | ||||
// legend={["总量", "白班", "夜班"]} | |||||
onDateChange={handleDateChange} | onDateChange={handleDateChange} | ||||
size={["long", "middle"]} | size={["long", "middle"]} | ||||
> | > | ||||
{/* real echarts here */} | |||||
{options && ( | {options && ( | ||||
<ReactECharts | <ReactECharts | ||||
key={Math.random()} | key={Math.random()} | ||||
option={options} | option={options} | ||||
// option={getOptions( | |||||
// [ | |||||
// [172, 165, 135, 35, 101, 53, 68], // 总量 | |||||
// [87, 68, 81, 33, 35, 44, 38], // 白班 | |||||
// [85, 97, 54, 2, 66, 9, 30], // 夜班 | |||||
// ], | |||||
// "氧气" | |||||
// )} | |||||
style={{ height: "100%" }} | style={{ height: "100%" }} | ||||
/> | /> | ||||
)} | )} | ||||
@@ -108,7 +89,6 @@ function Oxygen(props) { | |||||
暂无数据 | 暂无数据 | ||||
</p> | </p> | ||||
)} | )} | ||||
{/* real table data here */} | |||||
</GraphBase> | </GraphBase> | ||||
); | ); | ||||
} | } | ||||
@@ -175,9 +155,6 @@ function getOptions(source, period, trend) { | |||||
color: "#213259a0", | color: "#213259a0", | ||||
}, | }, | ||||
}, | }, | ||||
// interval: 10, | |||||
// min: 0, | |||||
// max: 100, | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
@@ -196,40 +173,7 @@ function getOptions(source, period, trend) { | |||||
{ offset: 1, color: "#FFD16010" }, | { offset: 1, color: "#FFD16010" }, | ||||
]), | ]), | ||||
}, | }, | ||||
// smooth: true, | |||||
}, | }, | ||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#12FFF540" }, | |||||
// { offset: 0.5, color: "#12FFF520" }, | |||||
// { offset: 1, color: "#12FFF510" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#2760FF40" }, | |||||
// { offset: 0.5, color: "#2760FF20" }, | |||||
// { offset: 1, color: "#2760FF10" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
], | ], | ||||
tooltip: { | tooltip: { | ||||
trigger: "axis", | trigger: "axis", | ||||
@@ -237,7 +181,6 @@ function getOptions(source, period, trend) { | |||||
type: "shadow", | type: "shadow", | ||||
}, | }, | ||||
className: "xc-chart-tooltip", | className: "xc-chart-tooltip", | ||||
// backgroundColor: '' | |||||
}, | }, | ||||
}; | }; | ||||
} | } |
@@ -28,19 +28,10 @@ function SO2(props) { | |||||
); | ); | ||||
const options = getOptions("SO2_float", period, currentTrend); | const options = getOptions("SO2_float", period, currentTrend); | ||||
function handleSwitch(v) { | |||||
// console.log('switched ', v); | |||||
} | |||||
function handleSwitch(v) {} | |||||
function handleDateChange(value) { | function handleDateChange(value) { | ||||
setPeriod( | |||||
{ | |||||
日: "day", | |||||
周: "week", | |||||
月: "month", | |||||
年: "year", | |||||
}[value] | |||||
); | |||||
setPeriod(value); | |||||
setTimestr( | setTimestr( | ||||
{ | { | ||||
日: | 日: | ||||
@@ -75,22 +66,12 @@ function SO2(props) { | |||||
defaultSelect={period} | defaultSelect={period} | ||||
onSwitch={handleSwitch} | onSwitch={handleSwitch} | ||||
dateOptions={["日", "周", "月", "年"]} | dateOptions={["日", "周", "月", "年"]} | ||||
// legend={["总量", "白班", "夜班"]} | |||||
onDateChange={handleDateChange} | onDateChange={handleDateChange} | ||||
size={["long", "middle"]} | size={["long", "middle"]} | ||||
> | > | ||||
{/* real echarts here */} | |||||
{options && ( | {options && ( | ||||
<ReactECharts | <ReactECharts | ||||
key={Math.random()} | key={Math.random()} | ||||
// option={getOptions( | |||||
// [ | |||||
// [132, 155, 140, 83, 180, 67, 136], | |||||
// [83, 58, 60, 22, 80, 64, 43], | |||||
// [49, 97, 80, 61, 100, 3, 93], | |||||
// ], | |||||
// '氧气', | |||||
// )} | |||||
option={options} | option={options} | ||||
style={{ height: "100%" }} | style={{ height: "100%" }} | ||||
/> | /> | ||||
@@ -108,7 +89,6 @@ function SO2(props) { | |||||
暂无数据 | 暂无数据 | ||||
</p> | </p> | ||||
)} | )} | ||||
{/* real table data here */} | |||||
</GraphBase> | </GraphBase> | ||||
); | ); | ||||
} | } | ||||
@@ -126,16 +106,6 @@ function getOptions(source, period, trend) { | |||||
grid: { top: 40, right: 12, bottom: 20, left: 64 }, | grid: { top: 40, right: 12, bottom: 20, left: 64 }, | ||||
xAxis: { | xAxis: { | ||||
type: "category", | type: "category", | ||||
// data: Array(7) | |||||
// .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(), | |||||
data: trend[source].map((item) => item.time), | data: trend[source].map((item) => item.time), | ||||
axisLabel: { | axisLabel: { | ||||
color: "#fff", | color: "#fff", | ||||
@@ -173,9 +143,6 @@ function getOptions(source, period, trend) { | |||||
color: "#213259a0", | color: "#213259a0", | ||||
}, | }, | ||||
}, | }, | ||||
// interval: 10, | |||||
// min: 0, | |||||
// max: 100, | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
@@ -194,40 +161,7 @@ function getOptions(source, period, trend) { | |||||
{ offset: 1, color: "#FFD16010" }, | { offset: 1, color: "#FFD16010" }, | ||||
]), | ]), | ||||
}, | }, | ||||
// smooth: true, | |||||
}, | }, | ||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#12FFF540" }, | |||||
// { offset: 0.5, color: "#12FFF520" }, | |||||
// { offset: 1, color: "#12FFF510" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
// { | |||||
// data: Array(7) | |||||
// .fill(1) | |||||
// .map((_) => { | |||||
// return randomInt(60, 100); | |||||
// }), | |||||
// type: "line", | |||||
// areaStyle: { | |||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | |||||
// { offset: 0, color: "#2760FF40" }, | |||||
// { offset: 0.5, color: "#2760FF20" }, | |||||
// { offset: 1, color: "#2760FF10" }, | |||||
// ]), | |||||
// }, | |||||
// // smooth: true, | |||||
// }, | |||||
], | ], | ||||
tooltip: { | tooltip: { | ||||
trigger: "axis", | trigger: "axis", | ||||
@@ -235,7 +169,6 @@ function getOptions(source, period, trend) { | |||||
type: "shadow", | type: "shadow", | ||||
}, | }, | ||||
className: "xc-chart-tooltip", | className: "xc-chart-tooltip", | ||||
// backgroundColor: '' | |||||
}, | }, | ||||
}; | }; | ||||
} | } |
@@ -15,7 +15,6 @@ function EnergyAnalysis(props) { | |||||
return ( | return ( | ||||
<div className={cls.grid}> | <div className={cls.grid}> | ||||
<div className={cls.vgrid + " col-1"}> | <div className={cls.vgrid + " col-1"}> | ||||
{/* <SmokeHandle /> */} | |||||
<div style={{ gridRow: "1 / 3" }}> | <div style={{ gridRow: "1 / 3" }}> | ||||
<Oxygen /> | <Oxygen /> | ||||
</div> | </div> | ||||
@@ -33,32 +32,24 @@ function EnergyAnalysis(props) { | |||||
</div> | </div> | ||||
</div> | </div> | ||||
{/* <div className={" " + cls.line}></div> */} | |||||
<div className={cls.vgrid + " col-3"}> | <div className={cls.vgrid + " col-3"}> | ||||
<div style={{ gridRow: 2 }}> | <div style={{ gridRow: 2 }}> | ||||
{/* <RestHeat /> */} | |||||
<NatGas /> | <NatGas /> | ||||
</div> | </div> | ||||
<div style={{ gridRow: 3 }}> | <div style={{ gridRow: 3 }}> | ||||
{/* <WaterCost /> */} | |||||
<Gas /> | <Gas /> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div className={cls.vvgrid + " col-4"}> | <div className={cls.vvgrid + " col-4"}> | ||||
{/* <div className="bgray energy"></div> */} | |||||
{/* <Energy /> */} | |||||
<div className=" electronic"> | <div className=" electronic"> | ||||
<Energy /> | <Energy /> | ||||
</div> | </div> | ||||
<div className=" gas"> | <div className=" gas"> | ||||
{/* <NatGas /> */} | |||||
<SmokeHandle /> | <SmokeHandle /> | ||||
</div> | </div> | ||||
<div style={{ height: "100%" }}> | <div style={{ height: "100%" }}> | ||||
<ElecCost /> | <ElecCost /> | ||||
{/* <Gas /> */} | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||