mt-fe-group/xuchang-screen
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update datetime

Browse Source
This commit is contained in:
lb 2023-07-02 16:32:34 +08:00
parent 8f3a94f431
commit d18ba333a5
1 changed files with 44 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
src/components/Head/index.jsx
View File

@ -1,68 +1,50 @@
import React, { useEffect, useState, useRef } from 'react' import React, { useEffect, useState, useRef } from 'react';
import TopSide from "../../assets/TopSide.png" import TopSide from '../../assets/TopSide.png';
import LeftLine from "../../assets/TopTitleLeftIcon.png" import LeftLine from '../../assets/TopTitleLeftIcon.png';
import RightLine from "../../assets/TopTitleRightIcon.png" import RightLine from '../../assets/TopTitleRightIcon.png';
import ButtonLine from "../../assets/TopButtonLine.png" import ButtonLine from '../../assets/TopButtonLine.png';
import './index.less' import './index.less';
export default function index() { export default function index() {
const timmer = useRef() const [now, setNow] = useState('2023.07.01 12:00:00');
const [Hour, setHour] = useState('');
const [Seconds, setSeconds] = useState('');
const [Minutes, setMinutes] = useState('');
const [Year, setYear] = useState('');
const [Month, setMonth] = useState('');
const [Day, setDay] = useState('');
const getNewDate = () => {
const time = new Date();
const year = time.getFullYear();
const month = time.getMonth() + 1;
const day = time.getDate();
const hour = time.getHours();
const minutes = time.getMinutes();
const s = time.getSeconds();
const seconds = s <= 9 ? "0" + s : s;
// const t = `${year}年${month}月${day}日 ${hour}:${minutes}:${seconds}`
setHour(hour)
setSeconds(seconds)
if (minutes < 10) {
setMinutes(`0${minutes}`)
} else {
setMinutes(minutes)
}
setYear(year)
setMonth(month)
setDay(day)
}
useEffect(() => { useEffect(() => {
timmer.current = setInterval(getNewDate, 1000); setInterval(() => {
return () => { const now = new Date();
clearTimeout(timmer.current) setNow(
} now
// eslint-disable-next-line .toLocaleDateString('zh-hans', {
}, []) year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
})
.replaceAll('/', '.'),
);
}, 1000);
}, []);
return ( return (
<div className='TopTitleBoder' > <div className="TopTitleBoder">
<img src={TopSide} alt="图片丢失" className='TopSideLeft' /> <img src={TopSide} alt="图片丢失" className="TopSideLeft" />
<div className='TopSideLeftLine' > <div className="TopSideLeftLine">
<img src={LeftLine} alt="图片丢失" className='TopSideLeftLineicon' /> <img src={LeftLine} alt="图片丢失" className="TopSideLeftLineicon" />
<h2 className='TopSideLeftTxt'>单位：中建材智能自动化研究院</h2> <h2 className="TopSideLeftTxt">单位：中建材智能自动化研究院</h2>
</div> </div>
<div > <div>
<h2 className='TopTitleText'>许昌安彩新能科技&ensp;&ensp;4800万方光伏轻质基板生产线 </h2> <h2 className="TopTitleText">
<img src={ButtonLine} alt="图片加载错误" className='TopButtonLine' /> 许昌安彩新能科技&ensp;&ensp;4800万方光伏轻质基板生产线{' '}
</h2>
<img src={ButtonLine} alt="图片加载错误" className="TopButtonLine" />
</div> </div>
<div className='TopSideRightLine' > <div className="TopSideRightLine">
<h2 className='TopSideRightTxt'>{Year}.{Month}.{Day} {Hour}.{Minutes}.{Seconds}</h2> <h2 className="TopSideRightTxt">{now}</h2>
<img src={RightLine} alt="图片丢失" className='TopSideRightLineicon' /> <img src={RightLine} alt="图片丢失" className="TopSideRightLineicon" />
</div> </div>
<img src={TopSide} alt="图片丢失" className='TopSideRight' /> <img src={TopSide} alt="图片丢失" className="TopSideRight" />
</div> </div>
) );
} }