风险评估页面样式

src/styles/view/biz/situation/riskassessment.scss

@@ -17,7 +17,6 @@
 
     .amos-layout-sider {
       padding-left: 20px;
-      flex: 0 0 27% !important;
       background: #f9f9f9;
 
       .amos-layout-sider-children {
@@ -63,7 +62,6 @@
           background: #f9f9f9;
 
           .amos-layout-sider {
-            flex: 0 0 55% !important;
             width: 50%;
             padding: 0;
             background: white;

src/view/bizview/situation/riskAssessment/index.js

 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import { Layout } from 'amos-framework';
 import RiskDegreePie from './RiskDegreePie';
 import RiskDegreeHistogram from './RiskDegreeHistogram';
@@ -11,33 +10,40 @@ const { Header, Content, Sider } = Layout;
  * 风险评估
  */
 class RiskAssessment extends Component {
-
   render() {
+    const styles = {
+      rpnPercent: {
+        flexBasis: '55%'
+      },
+      rpnTop: {
+        flexBasis: '27%'
+      }
+    };
     return (
-        <div className="risk-assessment-view" style={{ width: '100%', height: '100%' }}>
+      <div className='risk-assessment-view' style={{ width: '100%', height: '100%' }}>
         <Layout>
           <Layout>
             <Header>
-                <div className="risk-assessment-view-situation">厂区风险态势图</div>
+              <div className='risk-assessment-view-situation'>厂区风险态势图</div>
               <div style={{ margin: '20px' }}>
                 <SituationMap />
               </div>
             </Header>
             <Content>
-                <Layout className="risk-assessment-view-content">
-                  <Sider>
-                    <div className="risk-assessment-view-situation">风险度(RPN)上升百分比</div>
+              <Layout className='risk-assessment-view-content'>
+                <Sider width='' style={styles.rpnPercent} >
+                  <div className='risk-assessment-view-situation'>风险度(RPN)上升百分比</div>
                   <RiskDegreePie />
                 </Sider>
                 <Content className='risk-assessment-view-situation-matrix' >
-                    <div className="risk-assessment-view-situation">发生率/严重度矩阵</div>
+                  <div className='risk-assessment-view-situation'>发生率/严重度矩阵</div>
                   <IncidenceSeverityMatrix />
                 </Content>
               </Layout>
             </Content>
           </Layout>
-            <Sider className='risk-assessment-view-situation-histogram' >
-              <div className="risk-assessment-view-situation">风险度(RPN) TOP10</div>
+          <Sider width='' style={styles.rpnTop} className='risk-assessment-view-situation-histogram' >
+            <div className='risk-assessment-view-situation'>风险度(RPN) TOP10</div>
             <RiskDegreeHistogram />
           </Sider>
         </Layout>