update rightbar
This commit is contained in:
bovenliggende
ba472e6574
commit
54b3cce498
@ -1,4 +1,8 @@
|
||||
import cls from './index.module.less';
|
||||
import cls from './index.module.css';
|
||||
import { randomInt } from '../../../../utils';
|
||||
import * as echarts from 'echarts';
|
||||
import { Switch, Radio } from 'antd';
|
||||
import ReactECharts from 'echarts-for-react';
|
||||
|
||||
const EnergyCostChart = (props) => {
|
||||
const options = {
|
||||
|
@ -1,4 +1,9 @@
|
||||
import cls from './index.module.less';
|
||||
import cls from './index.module.css';
|
||||
import { randomInt } from '../../../../utils';
|
||||
|
||||
import * as echarts from 'echarts';
|
||||
import { Switch, Radio } from 'antd';
|
||||
import ReactECharts from 'echarts-for-react';
|
||||
|
||||
const SmokeTrendChart = (props) => {
|
||||
const options = {
|
||||
|
@ -1,17 +1,17 @@
|
||||
.EnergyCostChart {
|
||||
.energyCostChart {
|
||||
margin-top: 12px;
|
||||
height: 1px;
|
||||
flex: 1;
|
||||
padding-top: 8px;
|
||||
background: #ae27276a;
|
||||
}
|
||||
.EnergyCostChart .titleBar {
|
||||
.energyCostChart .titleBar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: white;
|
||||
}
|
||||
.EnergyCostChart .titleBar h2 {
|
||||
.energyCostChart .titleBar h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
@ -19,17 +19,17 @@
|
||||
color: #52fff8;
|
||||
}
|
||||
|
||||
.EnergyCostChart .titleBar .legend {
|
||||
.energyCostChart .titleBar .legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.EnergyCostChart .titleBar .legend * {
|
||||
.energyCostChart .titleBar .legend * {
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
color: #dff1fe;
|
||||
}
|
||||
|
||||
.EnergyCostChart .titleBar .legend ul {
|
||||
.energyCostChart .titleBar .legend ul {
|
||||
display: flex;
|
||||
margin: 0;
|
||||
margin-left: 8px;
|
||||
@ -37,12 +37,12 @@
|
||||
list-style: none;
|
||||
align-items: center;
|
||||
}
|
||||
.EnergyCostChart .titleBar .legend ul li {
|
||||
.energyCostChart .titleBar .legend ul li {
|
||||
position: relative;
|
||||
margin: 4px;
|
||||
padding-left: 16px;
|
||||
}
|
||||
.EnergyCostChart .titleBar .legend ul li::before {
|
||||
.energyCostChart .titleBar .legend ul li::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 2px;
|
||||
@ -53,15 +53,15 @@
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.EnergyCostChart .titleBar .legend ul li:first-child::before {
|
||||
.energyCostChart .titleBar .legend ul li:first-child::before {
|
||||
background-color: #ffd160;
|
||||
}
|
||||
|
||||
.EnergyCostChart .titleBar .legend ul li:nth-child(2)::before {
|
||||
.energyCostChart .titleBar .legend ul li:nth-child(2)::before {
|
||||
background-color: #12fff5;
|
||||
}
|
||||
|
||||
.EnergyCostChart .titleBar .legend ul li:nth-child(3)::before {
|
||||
.energyCostChart .titleBar .legend ul li:nth-child(3)::before {
|
||||
background-color: #2760ff;
|
||||
}
|
||||
|
||||
|
@ -1,27 +1,27 @@
|
||||
import React from 'react'
|
||||
import React from 'react';
|
||||
|
||||
|
||||
import Chart1 from './Chart1'
|
||||
|
||||
import Chart2 from './Chart2'
|
||||
|
||||
import Chart3 from './Chart3'
|
||||
import Chart1 from './Chart1';
|
||||
import Chart2 from './Chart2';
|
||||
import Chart3 from './Chart3';
|
||||
// import RightChart2 from './Chart2'
|
||||
|
||||
import SmokeHandle from './SmokeHandle';
|
||||
import EnergyCost from './EnergyCost';
|
||||
//引用原来的公共工程
|
||||
import RightChart2 from './Chart2'
|
||||
// import RightChart2 from './Chart2'
|
||||
// import RightChart3 from './Chart3'
|
||||
|
||||
|
||||
import RightChart3 from './Chart3'
|
||||
|
||||
import './index.less'
|
||||
import cls from './index.module.less';
|
||||
|
||||
export default function index() {
|
||||
return (
|
||||
<div className='RightBorder'>
|
||||
<Chart1 />
|
||||
<Chart2 />
|
||||
<Chart3 />
|
||||
</div>
|
||||
)
|
||||
return (
|
||||
<div className={cls.rightBar}>
|
||||
<div className={cls.demoFloat}>
|
||||
<EnergyCost />
|
||||
<SmokeHandle />
|
||||
</div>
|
||||
<Chart1 />
|
||||
<Chart2 />
|
||||
<Chart3 />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,18 +0,0 @@
|
||||
.RightBorder {
|
||||
width: 625px;
|
||||
height: 966px;
|
||||
margin-left: 24px;
|
||||
display: flex;
|
||||
flex-direction:column;
|
||||
justify-content: flex-start;
|
||||
|
||||
.RightBorder1 {
|
||||
width: 440px;
|
||||
height: 340px;
|
||||
}
|
||||
.RightBorder2 {
|
||||
width: 850px;
|
||||
height: 305px;
|
||||
margin-left: 25px;
|
||||
}
|
||||
}
|
10
src/components/RightBar/index.module.less
Normal file
10
src/components/RightBar/index.module.less
Normal file
@ -0,0 +1,10 @@
|
||||
.rightBar {
|
||||
}
|
||||
|
||||
.demoFloat {
|
||||
position: fixed;
|
||||
top: 100px;
|
||||
right: 600px;
|
||||
background: #77777737;
|
||||
z-index: 10000;
|
||||
}
|
Laden…
Verwijs in nieuw issue
Block a user