This commit is contained in:
lb 2023-07-02 16:11:06 +08:00
parent 4aaa12b630
commit 8f3a94f431

View File

@ -1,35 +1,33 @@
import React, { useState } from 'react';
import React, { useState } from 'react' import icon1 from '@/assets/CenterChart2icon1.svg';
import icon2 from '@/assets/CenterChart2icon2.svg';
import icon3 from '@/assets/CenterChart2icon3.svg';
import icon4 from '@/assets/CenterChart2icon4.svg';
import icon1 from '@/assets/CenterChart2icon1.svg' import cls from './leftbox.module.less';
import icon2 from '@/assets/CenterChart2icon2.svg'
import icon3 from '@/assets/CenterChart2icon3.svg'
import icon4 from '@/assets/CenterChart2icon4.svg'
import cls from './leftbox.module.less'
const Chart2 = () => { const Chart2 = () => {
const [data, setData] = useState([ const [data, setData] = useState([
{ icon: icon1, label: '换火时间', value: '12:08:34' }, { icon: icon1, label: '换火时间', value: '08:34' },
{ icon: icon3, label: '剩余时间', value: '11h' }, { icon: icon3, label: '剩余时间', value: '1170s' },
{ icon: icon2, label: '当前火向', value: '南向' }, { icon: icon2, label: '当前火向', value: '南向' },
// { icon: icon4, label: '', value: '28' }, // { icon: icon4, label: '', value: '28' },
]) ]);
return ( return (
<div className={`${cls.leftbox} flex h-half`}> <div className={`${cls.leftbox} flex h-half`}>
{data.map(item => {data.map((item) => (
<div className={cls.box} key={item.label}> <div className={cls.box} key={item.label}>
<img src={item.icon} alt="Error" className='box__logo' /> <img src={item.icon} alt="Error" className="box__logo" />
<div className={cls.box__inner} > <div className={cls.box__inner}>
<h2 className={cls.box__label}>{item.label}</h2> <h2 className={cls.box__label}>{item.label}</h2>
<h2 className={cls.box__value}> {item.value}</h2> <h2 className={cls.box__value}> {item.value}</h2>
</div> </div>
</div> </div>
)} ))}
</div > </div>
); );
} };
export default Chart2; export default Chart2;