import React from 'react'

import { BorderBox5, Decoration3,BorderBox8,BorderBox13 } from '@jiaminghi/data-view-react'

import './TopLeftCmp.less'

const style = { width: '200px', height: '20px','margin-left': '181px'}

export default () => (
  <div className="top-left-cmp">
    {/* <div className="dc-left">
      <BorderBox5>
        <div className="main-value">
          <span>0</span>件
        </div>
        <div className="compare-value">
          <span>同比</span>81
        </div>
        <div className="compare-value">
          <span>环比</span>15
        </div>
      </BorderBox5>
      <div className="dc-text">
        运维人均工作量
        <Decoration3 style={style} />
      </div>
    </div>
    <div className="dc-right">
      <div className="dc-text">
        当月维修任务量
        <Decoration3 style={style} />
      </div>
      <BorderBox5 reverse={true}>
        <div className="main-value">
          <span>0.1</span>件 / 日
        </div>
        <div className="compare-value">
          <span>同比</span>66
        </div>
        <div className="compare-value">
          <span>环比</span>9
        </div>
      </BorderBox5>
    </div> */}
    <BorderBox13>
    <div className="dc-text">
        传感器
        <Decoration3 style={style} />
    </div>
    <div style={{'margin-left': '50px',height: 56,'line-height': 56}}>
      <img style={{opacity: 1,height: 30}} src="https://bingovue.oss-cn-beijing.aliyuncs.com/share/ef3dea82def2f83828d11e3718b39f88.png?playing"></img>
      <span  style={{'margin-left': '10px',fontSize:18}}>纯水罐温度：</span>
      <span  style={{'margin-left': '50px',fontSize:24,color:'rgb(227, 69, 97)'}}>25</span>
      <span  style={{'margin-left': '10px',fontSize:18}}>°C</span>
    </div>
    <div style={{'margin-left': '50px',height: 56,'line-height': 56}}>
      <img style={{opacity: 1,height: 30}} src="https://bingovue.oss-cn-beijing.aliyuncs.com/share/ef3dea82def2f83828d11e3718b39f88.png?playing"></img>
      <span  style={{'margin-left': '10px',fontSize:18}}>冷水罐温度：</span>
      <span  style={{'margin-left': '50px',fontSize:24,color:'rgb(227, 69, 97)'}}>12</span>
      <span  style={{'margin-left': '10px',fontSize:18}}>°C</span>
    </div>
    <div style={{'margin-left': '50px',height: 56,'line-height': 56}}>
      <img style={{opacity: 1,height: 30}} src="https://bingovue.oss-cn-beijing.aliyuncs.com/share/ef3dea82def2f83828d11e3718b39f88.png?playing"></img>
      <span  style={{'margin-left': '10px',fontSize:18}}>热水罐温度：</span>
      <span  style={{'margin-left': '50px',fontSize:24,color:'rgb(227, 69, 97)'}}>66</span>
      <span  style={{'margin-left': '10px',fontSize:18}}>°C</span>
    </div>
    <div style={{'margin-left': '50px',height: 56,'line-height': 56}}>
      <img style={{opacity: 1,height: 30}} src="https://bingovue.oss-cn-beijing.aliyuncs.com/share/ef3dea82def2f83828d11e3718b39f88.png?playing"></img>
      <span  style={{'margin-left': '10px',fontSize:18}}>纯水罐压力：</span>
      <span  style={{'margin-left': '50px',fontSize:24,color:'rgb(227, 69, 97)'}}>128</span>
      <span  style={{'margin-left': '10px',fontSize:18}}>P</span>
    </div>
    </BorderBox13>
  </div>
)
