Skip to content

S
station-elec-manage-view
Commit 82e0fcfa authored by 李成龙's avatar 李成龙
Browse files
Options

代码优化

parent 0b4c954a
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 402 additions and 414 deletions
src/view/biz/duty/detail/data.js
View file @ 82e0fcfa
This diff is collapsed.
src/view/biz/duty/detail/echarts/IncidenceSeverityMatrix.js
View file @ 82e0fcfa
......@@ -19,18 +19,16 @@ class IncidenceSeverityMatrix extends Component {
};
}
getOptions() {
return {
legend: {
data: ['故障率(O)', '严重度(S)', '最低线', '最高线'],
x: 100,
y: 20,
textStyle: {
color: '#fff',
fontSize: 14,
},
fontSize: 14
}
},
xAxis: {
type: 'category',
......@@ -38,7 +36,7 @@ class IncidenceSeverityMatrix extends Component {
nameTextStyle: {
fontWeight: 'bold',
fontSize: 20,
color:'#5FFFFD',
color: '#5FFFFD'
},
boundaryGap: false,
data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
......@@ -46,21 +44,20 @@ class IncidenceSeverityMatrix extends Component {
show: true,
textStyle: {
color: '#fff',
fontSize: 14,
fontSize: 14
}
},
axisLine: {
lineStyle: {
color: '#245665',
color: '#245665'
}
},
splitLine: {
show: true,
lineStyle: {
color: ['#245665'],
width: 1,
},
width: 1
}
}
},
yAxis: {
......@@ -69,9 +66,9 @@ class IncidenceSeverityMatrix extends Component {
nameTextStyle: {
fontWeight: 'bold',
fontSize: 20,
color:'#5FFFFD',
color: '#5FFFFD'
},
fontSize:20,
fontSize: 20,
data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
axisLabel: {
show: true,
......@@ -82,14 +79,14 @@ class IncidenceSeverityMatrix extends Component {
},
axisLine: {
lineStyle: {
color: '#245665',
color: '#245665'
}
},
splitLine: {
show: true,
lineStyle: {
color: ['#245665'],
width: 1,
width: 1
}
}
},
......@@ -116,9 +113,8 @@ class IncidenceSeverityMatrix extends Component {
lineStyle: {
color: '#0A73FF',
width: 2
},
},
}
}
}
},
{
......@@ -133,13 +129,12 @@ class IncidenceSeverityMatrix extends Component {
lineStyle: {
color: '#FF0000',
width: 2
},
},
},
},
}
}
}
}
]
}
};
}
render() {
const option = this.getOptions();
......
src/view/biz/duty/detail/echarts/RiskDegreeHistogram.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import AmosEcharts from 'amos-viz/lib/echarts';
import JsonData from './../data';
import { OverFlowText } from 'amos-framework';
// import { queryRiskSourceRpnCountAction } from './../../../../services/situationService';
// import SysWsURL, { completeToken } from './../../../../consts/wsUrlConsts';
const riskTopTenData=JsonData.riskTopTenData;
const riskTopTenData = JsonData.riskTopTenData;
const labelOption = {
normal: {
show: true,
......@@ -38,76 +34,83 @@ class RiskDegreeHistogram extends Component {
this.getBarViewContent();
}
componentWillReceiveProps() {
}
componentWillReceiveProps() {}
getBarViewContent() {
}
getBarViewContent() {}
getOptions() {
return {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['RPNi', 'RPNr']
data: ['RPNi', 'RPNr']
},
grid: {
left: '3%',
right: '3%',
bottom: '1%',
containLabel: true
left: '3%',
right: '3%',
bottom: '1%',
containLabel: true
},
xAxis: {
type: 'value',
boundaryGap: [0, 0]
type: 'value',
boundaryGap: [0, 0]
},
yAxis: {
type: 'category',
data: ['极3低端换流变流台', '极2低端换流变流台','极1低端换流变流台','极3低端换流变流台','极2低端换流变流台', '极1低端换流变流台',
'极3低端换流变流台', '极2低端换流变流台', '极1低端换流变流台','极3低端换流变流台' ],
width:50,
axisLabel: {
show: true,
textStyle: {
color: '#fff',
fontSize: 18,
width:'10px'
}
},
type: 'category',
data: [
'极3低端换流变流台',
'极2低端换流变流台',
'极1低端换流变流台',
'极3低端换流变流台',
'极2低端换流变流台',
'极1低端换流变流台',
'极3低端换流变流台',
'极2低端换流变流台',
'极1低端换流变流台',
'极3低端换流变流台'
],
width: 50,
axisLabel: {
show: true,
textStyle: {
color: '#fff',
fontSize: 18,
width: '10px'
}
}
},
series: [
{
name: 'RPNi',
type: 'bar',
itemStyle:{
normal: {
color:'#5FFFFD',
},
},
data: [100, 100, 100, 100, 100, 100, 100, 100, 100,100]
{
name: 'RPNi',
type: 'bar',
itemStyle: {
normal: {
color: '#5FFFFD'
}
},
{
name: 'RPNr',
type: 'bar',
itemStyle:{
normal: {
color:'#FF0000',
},
},
data: [99,99,99,99,99,99,99,99,99,99]
}
data: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100]
},
{
name: 'RPNr',
type: 'bar',
itemStyle: {
normal: {
color: '#FF0000'
}
},
data: [99, 99, 99, 99, 99, 99, 99, 99, 99, 99]
}
]
};
};
}
handleData = () => {
this.getBarViewContent();
}
};
render() {
const option = this.getOptions();
......@@ -115,34 +118,31 @@ class RiskDegreeHistogram extends Component {
return (
<div className="risk-top-ten-content">
{/* <AmosEcharts option={option} style={{ height: '970px', width: '480px' }}/> */}
<div className='top-ten-content' style={{position:"initial"}}>
<div style={{position:"initial",width:28,height:28,marginTop:-32,marginLeft:352}}
onClick={this.props.onClick}></div>
{
riskTopTenData.map((item,index)=>
<div className='top-ten-item' key={index}>
<OverFlowText style={{marginTop:10}}>
<div style={{ width: '100px',height:'70px',whiteSpace:'normal',lineHeight:'30px'}}>{item.name}</div>
<div className="top-ten-content" style={{ position: 'initial' }}>
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -32, marginLeft: 352 }} onClick={this.props.onClick}></div>
{riskTopTenData.map((item, index) => (
<div className="top-ten-item" key={index}>
<OverFlowText style={{ marginTop: 10 }}>
<div style={{ width: '100px', height: '70px', whiteSpace: 'normal', lineHeight: '30px' }}>{item.name}</div>
</OverFlowText>
<div className="top-risk">
<div className='top-ten-item-middle' style={{display:'flex'}}>
<div className='top-ten-item-middlelinear' style={{height:16,width:`${item.rpni}%`}}> </div>
<div style={{lineHeight:'15px',position:'absolute',right:'45px'}}>{item.rpni}</div>
</div>
<div className='top-ten-item-middleRed' style={{display:'flex'}}>
<div className='top-ten-item-middlelinearRed' style={{height:16,width:`${item.rpnr}%`}}></div>
<div style={{lineHeight:'15px',position:'absolute',right:'45px'}}>{item.rpnr}</div>
</div>
<div className="top-ten-item-middle" style={{ display: 'flex' }}>
<div className="top-ten-item-middlelinear" style={{ height: 16, width: `${item.rpni}%` }}>
{' '}
</div>
<div style={{ lineHeight: '15px', position: 'absolute', right: '45px' }}>{item.rpni}</div>
</div>
<div className="top-ten-item-middleRed" style={{ display: 'flex' }}>
<div className="top-ten-item-middlelinearRed" style={{ height: 16, width: `${item.rpnr}%` }}></div>
<div style={{ lineHeight: '15px', position: 'absolute', right: '45px' }}>{item.rpnr}</div>
</div>
</div>
<div className ='top-ten-item-bottom'>
<div className="top-ten-item-bottom">
<span>{item.value}</span>
</div>
</div>
</div>
)
}
))}
</div>
</div>
);
}
......
src/view/biz/duty/detail/index.js
View file @ 82e0fcfa
This diff is collapsed.
src/view/biz/duty/detail/riskDetail.js
View file @ 82e0fcfa
......@@ -10,114 +10,108 @@ import IncidenceSeverityMatrix from './echarts/IncidenceSeverityMatrix';
*/
class RiskAssessment extends Component {
//获取等级
getLegend() {
return (
<div className="situation-map-legend">
<div className="situation-map-legend-item">
<div className="situation-map-legend-block" style={{ background: '#15653d' }} />
<div>初始</div>
</div>
<div className="situation-map-legend-item">
<div className="situation-map-legend-block" style={{ background: '#0078ef' }} />
<div>4/5级</div>
</div>
<div className="situation-map-legend-item">
<div className="situation-map-legend-block" style={{ background: '#ffcc2a' }} />
<div>3级</div>
</div>
<div className="situation-map-legend-item">
<div className="situation-map-legend-block" style={{ background: '#ff5a20' }} />
<div>2级</div>
</div>
<div className="situation-map-legend-item">
<div className="situation-map-legend-block" style={{ background: '#f42828' }} />
<div>1级</div>
</div>
</div>
);
}
onClick = () => {
this.props.updateParents({ divVisable: 'block', riskVisable: 'none' });
};
//获取等级
getLegend() {
return (
<div className='situation-map-legend' >
<div className='situation-map-legend-item'>
<div className='situation-map-legend-block' style={{ background: '#15653d' }} />
<div>初始</div>
</div>
<div className='situation-map-legend-item'>
<div className='situation-map-legend-block' style={{ background: '#0078ef' }} />
<div>4/5级</div>
</div>
<div className='situation-map-legend-item'>
<div className='situation-map-legend-block' style={{ background: '#ffcc2a' }} />
<div>3级</div>
</div>
<div className='situation-map-legend-item'>
<div className='situation-map-legend-block' style={{ background: '#ff5a20' }} />
<div>2级</div>
</div>
<div className='situation-map-legend-item'>
<div className='situation-map-legend-block' style={{ background: '#f42828' }} />
<div>1级</div>
</div>
render() {
return (
<div className="mainContent" style={{ display: this.props.riskVisable }}>
<Layout>
<Header className="contentHeader">
<div className="headerLeft" style={{ display: 'inline' }}>
{this.props.detailTitle}
</div>
);
}
onClick=()=>{
this.props.updateParents({ divVisable:'block', riskVisable:'none'});
}
render() {
return (
<div className="mainContent" style={{display: this.props.riskVisable }}>
<Layout>
<Header className="contentHeader">
<div className="headerLeft" style={{ display: 'inline' }}>{this.props.detailTitle}</div>
<div className="headerRight" style={{ display: 'inline' }}>
<img src="/src/assets/detail/return.png" onClick={this.onClick} width="42px" style={{marginTop:3}} />
</div>
<div className="headerRight" style={{ display: 'inline' }}>
<img src="/src/assets/detail/return.png" onClick={this.onClick} width="42px" style={{ marginTop: 3 }} />
</div>
</Header>
<Layout>
<Content className="riskcontent">
<Header className="blockOneHeader">
<Header className="oneChildHeader">
<img src="/src/assets/detail/secondTitle4.png" style={{ width: 256, height: 38, margin: 0 }} />
</Header>
<Layout>
<Content className="riskcontent">
<Header className="blockOneHeader">
<Header className="oneChildHeader">
<img src="/src/assets/detail/secondTitle4.png" style={{ width: 256, height: 38, margin: 0 }} />
</Header>
<Content className="oneHeaderContent">
<img src="/src/assets/detail/RPNr.png" style={{ width: 922, height: 503, marginTop: 35 ,marginLeft:160}} />
{this.getLegend()}
</Content>
</Header>
<Content className="blockOneContent">
<Layout className="oneChildLayout">
<Sider className="oneChildSider">
<Layout>
<Header className="twoChildHeader">
<img src="/src/assets/detail/secondTitle1.png" style={{ width: 277, height: 38, margin: 0 }} />
</Header>
<Content className="twoHeaderContent">
<div className="risk-degree-pie">
<div className="risk-degree-pie1">
<RiskDegreePie />
</div>
</div>
</Content>
</Layout>
</Sider>
</Layout>
</Content>
<Content className="blockTwoContent">
<Layout className="oneChildLayout">
<Sider className="oneChildSider">
<Layout>
<Header className="twoChildHeader">
<img src="/src/assets/detail/secondTitle2.png" style={{ width: 277, height: 38, margin: 0 }} />
</Header>
<Content className="twoHeaderContent">
<IncidenceSeverityMatrix />
</Content>
</Layout>
</Sider>
</Layout>
</Content>
</Content>
<Sider className="risksider">
<Header className="risksiderHeader">
<img src="/src/assets/detail/secondTitle3.png" style={{ width: 256, height: 38, margin: 0 }} />
</Header>
<Content className="risksiderContent">
<RiskDegreeHistogram />
</Content>
</Sider>
</Layout>
<Content className="oneHeaderContent">
<img src="/src/assets/detail/RPNr.png" style={{ width: 922, height: 503, marginTop: 35, marginLeft: 160 }} />
{this.getLegend()}
</Content>
</Header>
<Content className="blockOneContent">
<Layout className="oneChildLayout">
<Sider className="oneChildSider">
<Layout>
<Header className="twoChildHeader">
<img src="/src/assets/detail/secondTitle1.png" style={{ width: 277, height: 38, margin: 0 }} />
</Header>
<Content className="twoHeaderContent">
<div className="risk-degree-pie">
<div className="risk-degree-pie1">
<RiskDegreePie />
</div>
</div>
</Content>
</Layout>
</Sider>
</Layout>
</div>
);
}
}
</Content>
<Content className="blockTwoContent">
<Layout className="oneChildLayout">
<Sider className="oneChildSider">
<Layout>
<Header className="twoChildHeader">
<img src="/src/assets/detail/secondTitle2.png" style={{ width: 277, height: 38, margin: 0 }} />
</Header>
<Content className="twoHeaderContent">
<IncidenceSeverityMatrix />
</Content>
</Layout>
</Sider>
</Layout>
</Content>
</Content>
RiskAssessment.propTypes = {
<Sider className="risksider">
<Header className="risksiderHeader">
<img src="/src/assets/detail/secondTitle3.png" style={{ width: 256, height: 38, margin: 0 }} />
</Header>
<Content className="risksiderContent">
<RiskDegreeHistogram />
</Content>
</Sider>
</Layout>
</Layout>
</div>
);
}
}
};
RiskAssessment.propTypes = {};
export default RiskAssessment;
src/view/biz/duty/situation/GrowthStatistics.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {growthData} from './data';
import { growthData } from './data';
class GrowthStatistics extends Component {
render() {
return (
<div className='growth-statistics-view common-margin'>
<div className='daily-title daily-title-content'>告警隐患周增幅统计</div>
<div className='growth-content'>
<div style={{position:"initial",width:28,height:28,marginTop:-28,marginLeft:358}}
onClick={this.props.onWarnClick}></div>
<div className='growth-item growth-item-header'>
<div className="growth-statistics-view common-margin">
<div className="daily-title daily-title-content">告警隐患周增幅统计</div>
<div className="growth-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -28, marginLeft: 358 }} onClick={this.props.onWarnClick}></div>
<div className="growth-item growth-item-header">
<div>日期</div>
<div>告警/隐患</div>
<div>周增量</div>
</div>
{
growthData.map((item,index)=>(
<div className='growth-item growth-item-text'>
<div className='growth-item-datatext'>{item.date}</div>
{growthData.map((item, index) => (
<div className="growth-item growth-item-text">
<div className="growth-item-datatext">{item.date}</div>
<div>{item.risk}</div>
<div>{item.growth}</div>
</div>
)
)
}
))}
</div>
</div>
);
......
src/view/biz/duty/situation/RecentStatistics.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactEcharts from 'amos-viz/lib/echarts';
import {recentData1,recentData2} from './data';
import { recentData1, recentData2 } from './data';
import { Button } from 'amos-framework';
const ButtonGroup = Button.Group;
class RecentStatistics extends Component {
constructor(props) {
super(props);
this.state = {
value:'1',
recentData:recentData1
value: '1',
recentData: recentData1
};
}
handleChange = (value) => {
if(value == '1'){
this.setState({value:value,recentData:recentData1})
}else{
this.setState({value:value,recentData:recentData2})
handleChange = value => {
if (value == '1') {
this.setState({ value: value, recentData: recentData1 });
} else {
this.setState({ value: value, recentData: recentData2 });
}
}
};
render() {
const {value,recentData} =this.state
const { value, recentData } = this.state;
const select={backgroundColor:'#0C85B1',color:'#FFF700'};
const noselect={backgroundColor:'rgba(12, 133, 177, 0)',color:'#45FEFE' }
const select = { backgroundColor: '#0C85B1', color: '#FFF700' };
const noselect = { backgroundColor: 'rgba(12, 133, 177, 0)', color: '#45FEFE' };
return (
<div className='recent-statistics-view common-margin'>
<div className='daily-title daily-title-content'>最近 7 日风险统计</div>
<ButtonGroup className='buttongroup-style' defaultValue="1" onChange={this.handleChange}>
<Button size='sm' children={<span>告警</span>} className='button-style' value="1" style={(value == '1')?select:noselect} />
<Button size='sm' children={<span>隐患</span>} className='button-style' value="2" style={(value == '2')?select:noselect}/>
</ButtonGroup>
<div className='recent-statistics-content'>
<div style={{position:"initial",width:28,height:28,marginTop:-19,marginLeft:362}}
onClick={this.props.onStatisticClick}></div>
<ReactEcharts option={recentData} style={{ height: '100%', width: '100%' }} />
</div>
<div className="recent-statistics-view common-margin">
<div className="daily-title daily-title-content">最近 7 日风险统计</div>
<ButtonGroup className="buttongroup-style" defaultValue="1" onChange={this.handleChange}>
<Button size="sm" children={<span>告警</span>} className="button-style" value="1" style={value == '1' ? select : noselect} />
<Button size="sm" children={<span>隐患</span>} className="button-style" value="2" style={value == '2' ? select : noselect} />
</ButtonGroup>
<div className="recent-statistics-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -19, marginLeft: 362 }} onClick={this.props.onStatisticClick}></div>
<ReactEcharts option={recentData} style={{ height: '100%', width: '100%' }} />
</div>
</div>
);
}
......
src/view/biz/duty/situation/RiskFailure.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {riskFailureData} from './data'
import { riskFailureData } from './data';
import { OverFlowText } from 'amos-framework';
class RiskFailure extends Component {
render() {
return (
<div className='risk-failure-view common-margin daily-title'>
<div className='daily-title daily-title-content'>安全风险失效 TOP10</div>
<div className='top-ten-content'>
<div style={{position:"initial",width:28,height:28,marginTop:-35,marginLeft:352}}
onClick={this.props.onRiskClick}></div>
{
riskFailureData.map((item,index)=>
<div className='top-ten-item' key={index}>
<div className="risk-failure-view common-margin daily-title">
<div className="daily-title daily-title-content">安全风险失效 TOP10</div>
<div className="top-ten-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -35, marginLeft: 352 }} onClick={this.props.onRiskClick}></div>
{riskFailureData.map((item, index) => (
<div className="top-ten-item" key={index}>
<OverFlowText>
<p style={{ width: '80px' }}>{item.name}</p>
</OverFlowText>
<div className='top-ten-item-middle'>
<div className='top-ten-item-middlelinear' style={{height:8,width:`${item.value}%`}}> </div>
<div className="top-ten-item-middle">
<div className="top-ten-item-middlelinear" style={{ height: 8, width: `${item.value}%` }}>
{' '}
</div>
</div>
<div className ='top-ten-item-bottom'>
<div className="top-ten-item-bottom">
<span>{item.value}</span>
</div>
</div>
</div>
)
}
))}
</div>
</div>
);
......
src/view/biz/duty/situation/RiskTrend.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactEcharts from 'amos-viz/lib/echarts';
import {riskTrendData} from './data'
import { riskTrendData } from './data';
import { Button } from 'amos-framework';
const ButtonGroup = Button.Group;
class RiskTrend extends Component {
constructor(props) {
super(props);
this.state = {
value:'1',
value: '1'
};
}
handleChange = (value) => {
this.setState({value:value})
}
handleChange = value => {
this.setState({ value: value });
};
render() {
const {value} =this.state
const { value } = this.state;
const select={backgroundColor:'#0C85B1',color:'#FFF700'};
const noselect={backgroundColor:'rgba(12, 133, 177, 0)',color:'#45FEFE' }
const select = { backgroundColor: '#0C85B1', color: '#FFF700' };
const noselect = { backgroundColor: 'rgba(12, 133, 177, 0)', color: '#45FEFE' };
return (
<div className='risk-trend-view common-margin'>
<div className='daily-title daily-title-content'>安全风险总体趋势</div>
<ButtonGroup className='buttongroup-style' defaultValue="1" onChange={this.handleChange}>
<Button size='sm' children={<span>总数</span>} className='button-style' value="1" style={(value == '1')?select:noselect} />
<Button size='sm' children={<span>换流站</span>} className='button-style' value="2" style={(value == '2')?select:noselect}/>
<Button size='sm' children={<span>上升数</span>} className='button-style' value="3" style={(value == '3')?select:noselect}/>
<Button size='sm' children={<span>治理数</span>} className='button-style' value="4" style={(value == '4')?select:noselect}/>
</ButtonGroup>
<div className='risk-trend-content'>
<ReactEcharts option={riskTrendData} style={{ height: '280px', width: '1100px',left:'-60px'}} />
</div>
<div className="risk-trend-view common-margin">
<div className="daily-title daily-title-content">安全风险总体趋势</div>
<ButtonGroup className="buttongroup-style" defaultValue="1" onChange={this.handleChange}>
<Button size="sm" children={<span>总数</span>} className="button-style" value="1" style={value == '1' ? select : noselect} />
<Button size="sm" children={<span>换流站</span>} className="button-style" value="2" style={value == '2' ? select : noselect} />
<Button size="sm" children={<span>上升数</span>} className="button-style" value="3" style={value == '3' ? select : noselect} />
<Button size="sm" children={<span>治理数</span>} className="button-style" value="4" style={value == '4' ? select : noselect} />
</ButtonGroup>
<div className="risk-trend-content">
<ReactEcharts option={riskTrendData} style={{ height: '280px', width: '1100px', left: '-60px' }} />
</div>
</div>
);
}
......
src/view/biz/duty/situation/SafetyRate.js
View file @ 82e0fcfa
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {SafetyRateData} from './data';
import { SafetyRateData } from './data';
import { OverFlowText, Button } from 'amos-framework';
class SafetyRate extends Component {
render() {
return (
<div className='safety-rate-view common-margin daily-title'>
<div className='daily-title-content'>
安全指数 TOP10
</div>
<div className='top-ten-content' style={{position:"initial"}}>
<div style={{position:"initial",width:28,height:28,marginTop:-36,marginLeft:352}}
onClick={this.props.onClick}></div>
{
SafetyRateData.map((item,index)=>
<div className='top-ten-item' key={index}>
<div className="safety-rate-view common-margin daily-title">
<div className="daily-title-content">安全指数 TOP10</div>
<div className="top-ten-content" style={{ position: 'initial' }}>
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -36, marginLeft: 352 }} onClick={this.props.onClick}></div>
{SafetyRateData.map((item, index) => (
<div className="top-ten-item" key={index}>
<OverFlowText>
<p style={{ width: '80px' }}>{item.name}</p>
</OverFlowText>
<div className='top-ten-item-middle'>
<div className='top-ten-item-middlelinear' style={{height:8,width:`${item.value}%`}}> </div>
<div className="top-ten-item-middle">
<div className="top-ten-item-middlelinear" style={{ height: 8, width: `${item.value}%` }}>
{' '}
</div>
</div>
<div className ='top-ten-item-bottom'>
<div className="top-ten-item-bottom">
<span>{item.value}</span>
</div>
</div>
</div>
)
}
))}
</div>
</div>
);
......
src/view/biz/duty/situation/Statistics.js
View file @ 82e0fcfa
This diff is collapsed.
src/view/biz/duty/situation/index.js
View file @ 82e0fcfa
......@@ -18,82 +18,84 @@ class Situation extends Component {
constructor(props) {
super(props);
this.state = {
divVisable:'none' ,//控制弹窗显示
title: '', //modal标题
type: '' //弹窗类型（根据类型切换不同弹窗）
divVisable: 'none', //控制弹窗显示
title: '', //modal标题
type: '' //弹窗类型（根据类型切换不同弹窗）
};
}
componentWillMount() {
componentWillMount() {}
}
componentDidMount() {
}
componentWillUnmount() {
componentDidMount() {}
}
componentWillUnmount() {}
onRef=(ref)=>{
this.child1=ref;
}
onRef = ref => {
this.child1 = ref;
};
//安全指数弹窗
kpsi(values){
kpsi(values) {
console.log(values);
this.setState({
divVisable : values.divVisable,
title : values.title,
type : values.type
})
divVisable: values.divVisable,
title: values.title,
type: values.type
});
}
render() {
return (
<div className='class-Situation'>
<div className='daily-duties-content'>
<div className='daily-duties-left'>
<div className="class-Situation">
<div className="daily-duties-content">
<div className="daily-duties-left">
<div>
<SafetyRate onClick={()=>{
this.child1.kpsi()}}/>
<SafetyRate
onClick={() => {
this.child1.kpsi();
}}
/>
</div>
<div>
<GrowthStatistics onWarnClick={()=>{
this.child1.dangerWeekCensus()}}/>
<GrowthStatistics
onWarnClick={() => {
this.child1.dangerWeekCensus();
}}
/>
</div>
</div>
<div className='daily-duties-middle'>
<div>
<Statistics/>
<div className="daily-duties-middle">
<div>
<Statistics />
</div>
<div>
<RiskTrend/>
<RiskTrend />
</div>
</div>
<div className='daily-duties-right'>
<div>
<RiskFailure onRiskClick={()=>{
this.child1.safetyRiskFailure()}}/>
<div className="daily-duties-right">
<div>
<RiskFailure
onRiskClick={() => {
this.child1.safetyRiskFailure();
}}
/>
</div>
<div>
<RecentStatistics onStatisticClick={()=>{
this.child1.sevenDaysRiskCensus()}}/>
<RecentStatistics
onStatisticClick={() => {
this.child1.sevenDaysRiskCensus();
}}
/>
</div>
</div>
</div>
<div>
</div>
</div>
<CentralInfoView onRef={this.onRef}/>
<div></div>
<CentralInfoView onRef={this.onRef} />
</div>
);
}
}
Situation.propTypes = {
};
Situation.propTypes = {};
export default Situation;
src/view/biz/duty/situationDetail/data.js
View file @ 82e0fcfa
This diff is collapsed.
src/view/biz/duty/situationDetail/index.js
View file @ 82e0fcfa
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment