59 lines
2.2 KiB
JavaScript
59 lines
2.2 KiB
JavaScript
|
import {
|
||
|
|
Row,
|
||
|
|
Col,
|
||
|
|
} from 'antd'
|
||
|
|
|
||
|
|
import React from 'react'
|
||
|
|
|
||
|
|
class DataStatistics extends React.Component {
|
||
|
|
constructor(props) {
|
||
|
|
super(props);
|
||
|
|
}
|
||
|
|
|
||
|
|
getIcon(i, pathname) {
|
||
|
|
switch (i) {
|
||
|
|
case 0:
|
||
|
|
return <div className='hrm-report-box'><div style={{backgroundColor: '#00A9FF'}} className='hrm-report-icon hrm-report-radius'><i className='icon-coms-synergism' /></div></div>;
|
||
|
|
case 1:
|
||
|
|
return <div className='hrm-report-box'><div style={{backgroundColor: '#F67C4C'}} className='hrm-report-icon hrm-report-radius'><i className='icon-coms-hrm' /></div></div>;
|
||
|
|
case 2:
|
||
|
|
return <div className='hrm-report-box'><div style={ (pathname == 'departmentStatistics') ? {backgroundColor: '#7DC756'} :{backgroundColor: '#AC7CFF'} } className='hrm-report-icon hrm-report-radius'><i className='icon-coms-meeting' /></div></div>;
|
||
|
|
case 3:
|
||
|
|
return <div className='hrm-report-box'><div style={ (pathname == 'departmentStatistics') ? {backgroundColor: '#F9A825'} : {backgroundColor: '#50D0A3'} } className='hrm-report-icon hrm-report-radius'><i className='icon-coms-crm' /></div></div>;
|
||
|
|
default:
|
||
|
|
return <div className='hrm-report-box'><div style={{backgroundColor: '#00A9FF'}} className='hrm-report-icon hrm-report-radius'><i className='icon-coms-synergism' /></div></div>;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
const {
|
||
|
|
countDatas,
|
||
|
|
pathname
|
||
|
|
} = this.props;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div style={{margin: '8px 16px',height: 120, border: '1px solid #DDD',borderRadius: 3}}>
|
||
|
|
{countDatas.map( (data,index) => {
|
||
|
|
const {
|
||
|
|
showname,
|
||
|
|
num
|
||
|
|
} = data;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div style={{width:`${1/countDatas.length*100}%`}} className='hrm-report-count-item'>
|
||
|
|
<div className='hrm-report-count-item-icon'>{
|
||
|
|
this.getIcon(index,pathname)
|
||
|
|
}</div>
|
||
|
|
<div className='hrm-report-count-item-label'>
|
||
|
|
<div className='hrm-report-count-item-showname'>{showname}</div>
|
||
|
|
<div className='hrm-report-count-item-num'>{num}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
})}
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default DataStatistics
|