weaver_trunk_cli/pc4mobx/hrmAttendance/components/Test.js

63 lines
1.4 KiB
JavaScript

import React from 'react';
import {
Row,
Col
} from 'antd';
const datas = [{
key: 'evection',
icon: 'icon-Human-resources-business-travel',
bgColor: '#48C651',
title: '出差',
value: 10
}, {
key: 'official',
icon: 'icon-Human-resources-work',
bgColor: '#4F8CFF',
title: '公出',
value: 20
}, {
key: 'overtime',
icon: 'icon-Human-resources-overtime',
bgColor: '#8D6BF3',
title: '加班',
value: 30
}];
export default class Test extends React.Component {
render() {
const len = datas.length;
return (
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@wckko3`} type="flex" justify="space-around" align="middle">
{
datas.map((data, index) => {
const {
key,
icon,
bgColor,
title,
value
} = data;
return (
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@hqwwvh@${index}`} span={24/len} key={key}>
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@2plf5z@${index}`}>
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@csawhb@${index}`} span={12}>
<div style={{backgroundColor:bgColor}}>
<i className={icon}/>
</div>
</Col>
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@ioufvl@${index}`} span={12}>
<div>{value}</div>
<div>{title}</div>
</Col>
</Row>
</Col>
)
})
}
</Row>
);
}
}