import { useState } from 'react';
import cls from './index.module.less';
import { ScrollBoard } from '@jiaminghi/data-view-react';

const TodayTableData = (props) => {
	const [config, setConfig] = useState({
		// headerBGC: 'rgba(4, 44, 76, 0.3)',
		// headerBGC: 'rgba(4, 44, 76, .8)',
		headerBGC: '#044A8425',
		header: [
			'<span style="color:#fff">产线<span/>',
			'<span style="color:#fff">一等率<span/>',
			'<span style="color:#fff">二等率<span/>',
			'<span style="color:#fff">成品率<span/>',
			'<span style="color:#fff">废品率<span/>',
		],
		// oddRowBGC: '#042444',
		oddRowBGC: '#044A8425',
		// evenRowBGC: '#042c4c',
		evenRowBGC: '#0B549945',
		columnWidth: [90],
		headerHeight: 40,
		hoverPause: false,
		data: [
			['产线1', '37%', '62%', '97%', '7%'],
			['产线2', '95%', '10%', '99%', '3%'],
			['产线3', '68%', '1%', '92%', '4%'],
			['产线4', '94%', '21%', '97%', '2%'],
			['产线5', '99%', '30%', '95%', '5%'],
		],
	});
	return (
		<div className={cls.todayTableData}>
			<ScrollBoard
				config={config}
				className={cls.tableClass}
				style={{ width: '100%' }}
			/>
		</div>
	);
};

export default TodayTableData;