import React, { useEffect, useState, useRef } from 'react';

import TopSide from '../../../assets/TopSide.png';
import LeftLine from '../../../assets/TopTitleLeftIcon.png';
import RightLine from '../../../assets/TopTitleRightIcon.png';
import ButtonLine from '../../../assets/TopButtonLine.png';
import cls from './index.module.scss';

export default function CompanyName() {
	const [now, setNow] = useState('2023.07.01 12:00:00');

	useEffect(() => {
		setInterval(() => {
			const now = new Date();
			setNow(
				now
					.toLocaleDateString('zh-hans', {
						year: 'numeric',
						month: '2-digit',
						day: '2-digit',
						hour: '2-digit',
						minute: '2-digit',
						second: '2-digit',
					})
					.replaceAll('/', '.'),
			);
		}, 1000);
	}, []);

	return (
		<div className={cls.TopTitleBoder}>
			<img src={TopSide} alt="图片丢失" className={cls.TopSideLeft}/>
			<div className={cls.TopSideLeftLine}>
				<img src={LeftLine} alt="图片丢失" className={cls.TopSideLeftLineicon}/>
				<h2 className={cls.TopSideLeftTxt}>单位：河南汇融数字科技有限公司</h2>
			</div>
			<div>
				<h2 className={cls.TopTitleText}>
					许昌安彩新能科技&ensp;&ensp;4800万方光伏轻质基板生产线{' '}
				</h2>
				<img src={ButtonLine} alt="图片加载错误" className={cls.TopButtonLine}/>
			</div>
			<div className={cls.TopSideRightLine}>
				<h2 className={cls.TopSideRightTxt}>{now}</h2>
				<img src={RightLine} alt="图片丢失" className={cls.TopSideRightLineicon}/>
			</div>
			<img src={TopSide} alt="图片丢失" className={cls.TopSideRight}/>
		</div>
	);
}