xuchang-screen/src/components/Container.jsx
2023-07-02 11:29:05 +08:00

44 lines
993 B
JavaScript

import { useEffect, useRef } from 'react';
import cls from './container.module.less';
import IconStack from '../assets/Icon/icon-stack.png';
import IconGood from '../assets/Icon/icon-good.png';
import IconCharger from '../assets/Icon/icon-charge.png';
import IconSmoke from '../assets/Icon/icon-taiji.png';
const Container = (props) => {
let icon = useRef(null);
switch (props.icon) {
case 'kiln':
icon.current = IconStack;
break;
case 'good': // 良品率
icon.current = IconGood;
break;
case 'charger':
icon.current = IconCharger;
break;
case 'smoke':
icon.current = IconSmoke;
break;
}
return (
<div className={`${cls.container} ${props.className}`}>
<div className={cls.container__head}>
<img
src={icon.current}
alt="#"
className={props.icon == 'kiln' ? cls.bigger : ''}
/>
<h2>{props.title}</h2>
</div>
<div className={cls.container__content}>{props.children}</div>
</div>
);
};
export default Container;